All posts from all collections on homepage

Somewhat of a head scratcher for me.
I have a simple project with some mostly empty test posts.

It’s the most basic blog layout in existence.
The issue is the homepage (Leftmost square, “Say something for The Main Page”)

I have this in index.html

  <ul class='post-list'>
    {% for dir in site.collections %}
      {% assign collection = dir.label %}
      {% for page in site[collection] %}
        {% include icon.html %} 
        <li>
          <img class='collection-icon' src="{{ src }}" alt="">
          <h2> <a href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a> </h2>
          <small>{{ page.date | date: "%b %-d, %Y" }}</small>
        </li>
      {% endfor %}
    {% endfor %}
  </ul>

However, this is not what I’m looking to accomplish.
I would like to see each post organized by date newest to oldest.
To be sure, I do not want each category, and then each post of that category listed by date (we could just use more or less the same code with reverse for that).

From what I’ve come to read (I’ve lost the link will edit momentarily) site.categories only loops the categories within the posts of the _posts dir. Is that correct? I know when I add either category: home or categories: home to any page in any dir that isn’t posts (a collection) site.categories is empty.

Besides a massive refactor, or duplicating each post in the _posts dir, how might one accomplish this?

Yes a category only applies to posts.

And a collection only appears to pages that are not posts (in fact “posts” is already a collection).

Is this correct?

  • you want all posts
  • you want date ordering
  • you do not care about category

It sounds like a very common case and you can use

site.posts

Example from docs

<ul>
  {% for post in site.posts %}
    <li>
      <a href="{{ post.url | relative_url }}">{{ post.title }}</a>
    </li>
  {% endfor %}
</ul>

If you wanted all pages instead you’d use

site.pages

And title and description.

See variables.

And you could manually implement categories by assigning frontmatter to pages and looping over the pages, getting the categories for each. Older forum posts discuss this.

Sorry for the late reply here.

You are correct in what I’d like to see on the homepage, however, missing one thing, all of posts are organized into their own sub dirs within a collection directory (specified in _config.yml)

So when I loop site.posts or site.pages (I have only the index, not sure if that counts as a page)
the collection is, unfortunately, empty.

In working on another project, I think there is a better approach in terms of the design (Not sure, in hindsight, why I’d want or need a list of categories as it’s own page, that’s a sidebar or menu thing really, but then again, shouldn’t be terribly difficult to implement if I did want one).

If I wanted this design to work, my current thinking is to refactor and use categories rather than collections.
If I understand, this would allow me to place every post in the _posts dir and the site.posts collection would no longer be empty. Whereas my current setup requires that I double every post, once in the _collection dir and once in _post if I want to loop all posts regardless of which category or collection its in.

Am I getting that right?

Everything counts as a page. Posts, collections, any index.md or dir/file.md

Putting collections inside _posts is something I’ve never heard of before so I can’t predict how that’s going to work. And it will be hard for others to advise you.

Of course you don’t want to repeat a category label on a bunch of posts in their frontmatter if you can use a directory.

So then use the category approach but with folders instead of frontmatter. Jekyll supports this.

foo/_posts/
    2021-01-01.md
    2021-02-03-b.md
_posts/

Here I have two posts in the foo category. You can have more folders like foo (no underscore). And uncategorized posts in top level _posts.

See my examples here

Plus you can still add frontmatter to add specific categories to any specific posts but you probably want to avoid that and use tags instead.

Categories are nested.

Using

categories: foo, bar

Means output path /foo/bar/2021/01/01/a.md. While tags don’t affect the path.

Using categories as directories, then you can do

site.categories.foo 

Or get the category names and then contents.

site.categories

Or all posts

site.posts

I would use {{ var | inspect }} on those first so see the structure and then use a for loop to unpack them.