Jekyll & Liquid: Output category list with post count?

Question

I'm somehow stuck and don't find the right way to do it.

I want to output a category list with the number of posts in each categorie.

I got this far: https://paste.xinu.at/dOLtod/

but I never managed to get the real count. I tried so many ways and nothing worked, for example going through each post and checked on every category if it equals {{ category | first }}.

Here is the code without the count:

<ul class="dropdown-menu">
    {% for category in site.categories %}
        <li class="camelize_me">
            <a href="/tags/{{category | first}}/">
                {{category | first }}
                <span class="badge">
                <!-- Post count here -->
                </span>
            </a>
        </li>
    {% endfor %} 
</ul>

Has anyone an idea to get this done?

score 24 · Accepted Answer · answered Jan 12 '14 at 21:56

I have written a code snippet that not only shows post count in each category, but also navigates to the posts of a specific category which got clicked. I hope you find it helpful:

<ul class="tag-box inline">
{% assign tags_list = site.categories %}  
  {% if tags_list.first[0] == null %}
    {% for tag in tags_list %} 
      <li><a href="#{{ tag }}">{{ tag | capitalize }} <span>{{ site.tags[tag].size }}</span></a></li>
    {% endfor %}
  {% else %}
    {% for tag in tags_list %} 
      <li><a href="#{{ tag[0] }}">{{ tag[0] | capitalize }} <span>{{ tag[1].size }}</span></a></li>
    {% endfor %}
  {% endif %}
{% assign tags_list = nil %}
</ul>

{% for tag in site.categories %} 
  <h2 id="{{ tag[0] }}">{{ tag[0] | capitalize }}</h2>
  <ul class="post-list">
    {% assign pages_list = tag[1] %}  
    {% for post in pages_list %}
      {% if post.title != null %}
      {% if group == null or group == post.group %}
      <li><a href="{{ site.url }}{{ post.url }}">{{ post.title }}<span class="entry-date"><time datetime="{{ post.date | date_to_xmlschema }}" itemprop="datePublished">{{ post.date | date: "%B %d, %Y" }}</time></a></li>
      {% endif %}
      {% endif %}
    {% endfor %}
    {% assign pages_list = nil %}
    {% assign group = nil %}
  </ul>
{% endfor %}

Is there any way to sort categories? I tried `{% assign tags_list = site.categories | sort:"title" %}` but no success — Diogo Moreira, May 27 '15 at 13:21
can you put come comments in the code? It's kind of hard to comprehend. — blkpingu, Jul 11 '18 at 15:18

score 16 · Answer 2 · edited May 09 '14 at 14:45

16

Solution: {{ category | last }} has all my posts, so {{ category | last | size }} displays the count. I got help on the IRC. :)

edited May 09 '14 at 14:45

kleinfreund

6,546
4
30
60

answered Jan 06 '14 at 17:08

koffeingeladen

325
1
2
11

That works! I didn't find any solution from Liquid Document. But I find it here! Thanks guy! – shen Feb 24 '17 at 19:57

Mike Slinn · Answer 3 · 2020-04-04T18:56:08.150

2

An incremental improvement over Hossain's answer, which sorts the categories. Tested with Jekyll 3.3.1:

<h1 class='tag'>Blog Posts Sorted By Category</h1>
{% assign sorted_categories = site.categories | sort %}
{% for tag in sorted_categories %}
  <h2 class='tag' id="{{ tag[0] }}">{{ tag[0] | capitalize }}</h2>
  <ul class="post-list">
    {% assign pages_list = tag[1] %}
    {% for post in pages_list %}
      {% if post.title != null %}
      {% if group == null or group == post.group %}
      <li><a href="{{ site.url }}{{ post.url }}">
          <span class="entry-date"><time datetime="{{ post.date | date_to_xmlschema }}" itemprop="datePublished">{{ post.date | date: "%B %d, %Y" }}</time></span>
          &bull;
          {{ post.title }}
        </a></li>
      {% endif %}
      {% endif %}
    {% endfor %}
    {% assign pages_list = nil %}
    {% assign group = nil %}
  </ul>
{% endfor %}

edited Apr 04 '20 at 18:56

answered Jan 10 '17 at 03:01

Mike Slinn

7,705
5
51
85

I think its important to mention that this does a case-sensitive sort where uppercase precede lowercase. So if you have the categories `Apple, banana and Zebra`, then it will be sorted as `Apple, Zebra, banana`, which might not be what you want. – kimbaudi Jan 24 '17 at 10:52
This is true. I take care to use the desired capitalization in my tags. For example: AWS, AI and All Other Tags Are Capitalized. Works well! – Mike Slinn Jan 24 '17 at 14:31
This used to work, but now I get: `Liquid Warning: Liquid syntax error (line 2): Unexpected character { in "{{site.categories | sort {|left, right| left[0] <=> right[0]} }}" in blog/index.html` – Mike Slinn Apr 04 '20 at 18:39

Jekyll & Liquid: Output category list with post count?

3 Answers3

Linked