Range and Arrange authors by number of Articles each author have

[Rose_Chege]

Hello people.

I have a list of authors for different posts. Now, I want to arrange the author list based on the number of each article an author has. How can I Implement this in HUGO?

Below is my simple template for ranging through the available authors

<section >
  <div class="author relative">
    <div class="author-card flex flex-wrap">
      {{ range .RegularPages }}
      <a class="author-item link-basic" href="{{.Permalink}}">
        <div class="author-content fill-white flex cta-shadow flex-column">
          {{ range .Resources }}
          <img class="avatar" src="{{ (.Resize "300x").Permalink }}" />
          {{ end }}
          <div class="author-item-content flex flex-column align-center">
            <div class="author-content-title prl-5 xs-pt-20 xs-pb-10 flex flex-column fill-white">
              <h3 class="title-5 xs-mb-20">{{.Title}}</h3>
            </div>
          </div>
        </div>
      </a>
      {{ end }}
    </div>
  </div>
</section>

[jmooring]

Is ‘authors’ a taxonomy?

[Rose_Chege]

Yes:

[taxonomies]
   tag = "tags"
   category = "categories"
   author = "authors"

[jmooring]

layouts/authors/taxonomy.html

{{ range site.Taxonomies.authors.ByCount }}
  <h2><a href="{{ .Page.RelPermalink }}">{{ .Page.LinkTitle }}</a> ({{ .Count}})</h2>
  <ul>
    {{ range .WeightedPages }}
      <li><a href="{{ .Page.RelPermalink }}">{{ .Page.LinkTitle }}</a></li>
    {{ end }}
  </ul>
{{ end }}

rendered

[Rose_Chege]

Hello Joe. How about considering the following context:

<section class="authors-posts">
  <div class="authors-block-inner flex flex-wrap justify-center">
    <div class="posts-header">
      <h3 class="title">Featured Instructors</h3>
    </div>
    <ul class="authors-posts-items list-unstyled xs-mb-0">

      {{ range .Pages }}
      
      {{ $author := path.Base .Permalink}}
      {{ $listArticles := (where (where .Site.Pages "Params.layout"
      "blog") ".Params.author" $author) }} 
      {{ $TotalArticles := len $listArticles }}
      
      {{ $getArticleUrls :=slice }} {{ range $listArticles }} {{ $getArticleUrls = $getArticleUrls |
      append .Permalink }} {{ end }} {{ $getArticleUrls = delimit
      $getArticleUrls ", "}}

      <li class="authors-posts-item">
        <div class="authors-block-item-wrap flex flex-column">
          {{ range .Resources }} <img src="{{ (.Resize " 400x").Permalink }}" />
          {{ end }}
          <div class="authors-block-item-content flex flex-column">
            <div class="authors-block-item-content-inner pt-10">
              <a class="decoration-none" href="{{ .RelPermalink }}">
                <h3 class="title-5.5 text-link">{{ .Title }}</h3>
              </a>

              <p class="title-5.5 text-link">
                {{ $TotalArticles }} Stories Written
              </p>

              <div class="authors-posts-textitems">
                <ul class="list-unstyled xs-mb-0">
                  {{ with .Params.linkedin }}
                  <li>
                    <a class="decoration-none" href="{{ . }}" target="_blank"><i class="linkedin"></i></a>
                  </li>
                  {{ end }} {{ with .Params.github }}
                  <li>
                    <a class="decoration-none" href="{{ . }}" target="_blank"><i class="github"></i></a>
                  </li>
                  {{ end }} {{ with .Params.twitter }}
                  <li class="">
                    <a class="decoration-none" href="{{ . }}" target="_blank"><i class="twitter"></i></a>
                  </li>
                  {{ end }} {{ with .Params.website }}
                  <li>
                    <a class="decoration-none" href="{{ . }}" target="_blank"><i class="website"></i></a>
                  </li>
                  {{ end }}
                </ul>
              </div>
            </div>
          </div>
        </div>
      </li>
      {{ end }}
    </ul>
  </div>
</section>

Up to this point, I have the following progress:

[jmooring]

@Rose_Chege

How about considering

See my previous response. The code above seems complicated and fragile.

Try this:

git clone --single-branch -b hugo-forum-topic-45762 https://github.com/jmooring/hugo-testing hugo-forum-topic-45762
cd hugo-forum-topic-45762
hugo server

[Rose_Chege]

Thank you, Joe.

I made a change:

{{ define "main" }}

{{ range site.Taxonomies.authors.ByCount }}

  <div class="author">
    <div class="author-portrait"> 
      {{ with .Page.Resources.Get "portrait.jpg" }}
        {{ with .Fill "80x80" }}
          <img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="">
        {{ end }}
      {{ end }}
    </div>
    <div class="author-name">
      <a href="{{ .Page.RelPermalink }}">{{ .Page.LinkTitle }}</a>
    </div>
    <div class="author-count">
      {{ printf "%d Stories Written" .Count }}
    </div>
    <div class="author-socials">
      {{ with .Page.Params.github }}
        <a href="{{ . }}">GitHub</a>
      {{ end }}
    </div> 
  </div>
{{ end }}

{{ end }}

[Rose_Chege]

Now, The only change is between using index.md and _index.md.

I found that the _index.md isn’t the structure my author folder uses. Now I’m learning to switch _index.md and index.md.

How can I switch:

content/
|-- authors/
|   |-- author-a/
|   |   |-- _index.md
|   |   |-- potrait.jpg
|   |
|   |-- author-b/
|   |   |-- _index.md
|   |   |-- potrait.jpg

To the following, and still get the desired results:

content/
|-- authors/
|   |-- author-a/
|   |   |-- index.md
|   |   |-- potrait.jpg
|   |
|   |-- author-b/
|   |   |-- index.md
|   |   |-- potrait.jpg

One final Note was the following:

    <div class="author-portrait"> 
      {{ with .Page.Resources.Get "portrait.jpg" }}
        {{ with .Fill "80x80" }}
          <img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="">
        {{ end }}
      {{ end }}
    </div>

While this still worked perfectly, I found that Images with other extensions (e.g., .png) didn’t get loaded.

Once again, Thank you Joe, for the Feedback and your solution. I appreciate it.

[jmooring]

@Rose_Chege

How can I switch:

You cannot. Taxonomy and term pages are sections, and must have an _index.md file.

@Rose_Chege

Images with other extensions (e.g., .png) didn’t get loaded.

Then change the Glob pattern.

{{ with .Page.Resources.Get "portrait.*" }}