Pulling from specific subfolders using {% for post in site.posts %}

Question

I'm currently working on my first Jekyll site. I have a page in which 2 seperate sections display previews of certain posts (a styled thumbnail).

What I want is for these sections to display posts from different subfolders in _site/_posts. I have organized _posts to contain two subfolders, /lesplannen and /verslagen (lesson plans and reports), each containing a bunch of articles.

My code for one of these sections is as follows (Jade formatting):

{% for post in site.posts limit: 4 %}
    a(href="{{post.url}}" target="_blank" style="background-image: url(assets/img/posts/lesplannen/thumbnails/{{post.thumbnail}})").lesplan-thumb
      .article-meta
        .name {{post.title}}
        .date {{ post.date | date: "%b %d, %Y" }}
    {% endfor %}

And similarly for the other section. My first instinct was to change site.posts to site.posts.lesplannen and site.posts.verslagen repectively, but this resulted in the thumbs not displaying at all. I also added the categories to the front matter in the articles themselves, but this wasn't picked up either.

For clarity, what I'm trying to do is have section 1 display posts from _site/_posts/subfolder 1 and section 2 display posts from _site/_posts/subfolder 2.

What would be the right way to go about this?

Question for bonus points: The page displays 4 posts, as expected, but chooses to display post 6 through 9 of the 12 posts available. Why is this and can I specify to e.g. always display the last x posts?

For reference:
GitHub page: https://zaena.github.io/portfolio-nadine/
GitHub repo: https://github.com/Zaena/portfolio-nadine

Answer 1

The website has several issues:

The posts folder structure is wrong

Posts should always be in a _posts folder, they can't be inside another folder (Jekyll can display them but some functionality is lost, they are not meant to be there)

If categories are folders, they can't start with an underscore (_)

The actual structure has categories defined as /_verslagen, they should be /verslagen and its posts inside /verslagen/_posts

Having the same post in two different folders has unexpected behaviour

There are posts located in different folders, only one version should exist.

Solution

The structure you are looking for is:

├── index.html
├── lesplannen
│   └── _posts
│       ├── 2016-12-10-dit-is-een-lesplan2.md
│       ├── 2016-12-10-dit-is-een-lesplan3.md
│       ├── 2016-12-10-dit-is-een-lesplan4.md
│       └── 2016-12-10-dit-is-een-lesplan.md
└── verslagen
    └── _posts
        ├── 2016-12-10-dit-is-een-verslag10.md
        ├── 2016-12-10-dit-is-een-verslag11.md
        ├── 2016-12-10-dit-is-een-verslag12.md
        ├── 2016-12-10-dit-is-een-verslag2.md
        ├── 2016-12-10-dit-is-een-verslag3.md
        ├── 2016-12-10-dit-is-een-verslag4.md
        ├── 2016-12-10-dit-is-een-verslag5.md
        ├── 2016-12-10-dit-is-een-verslag6.md
        ├── 2016-12-10-dit-is-een-verslag7.md
        ├── 2016-12-10-dit-is-een-verslag8.md
        ├── 2016-12-10-dit-is-een-verslag9.md
        └── 2016-12-10-dit-is-een-verslag.md

This will make posts available under each category in site.categories.verslagen and site.categories.lesplannen.

Then the code to show each category posts looks like:

{% for post in site.categories.verslagen %}
<p>{{post.title}}</p>
<p>{{ post.date | date: "%b %d, %Y" }}</p>
<p>{{post.thumbnail}}</p>
{% endfor %}

{% for post in site.categories.lesplannen %}
<p>{{post.title}}</p>
<p>{{ post.date | date: "%b %d, %Y" }}</p>
<p>{{post.thumbnail}}</p>
{% endfor %}

Answer 2

Here's how I got them displaying separately:

index.html

---
---

<p>Posts in dir-a:</p>

<ul>
    {% for post in site.posts %}
        {% assign first_dir = post.path | remove_first: "_posts/" | split: "/" | first %}
        {% if first_dir == 'dir-a' %}
            <li>
                <a href="{{ post.url }}">{{ post.title }}: {{ post.date | date: "%b %d, %Y" }}</a>
            </li>
        {% endif %}
    {% endfor %}
</ul>

<p>Posts in dir-b:</p>

<ul>
    {% for post in site.posts %}
        {% assign first_dir = post.path | remove_first: "_posts/" | split: "/" | first %}
        {% if first_dir == 'dir-b' %}
            <li>
                <a href="{{ post.url }}">{{ post.title }}: {{ post.date | date: "%b %d, %Y" }}</a>
            </li>
        {% endif %}
    {% endfor %}
</ul>

This assumes the following directory structure:

/_posts
/_posts/dir-a
/_posts/dir-b

Should be nice and easy to adapt to your needs.