Get next and previous elements out of an array in liquid

Question

Short version:

I want to add 1 to a number in a liquid template and use the result as an array index.

{% capture plus_one %}{{ 0 | plus: 1 }}{% endcapture %}
<div>-Value of plus_one: {{plus_one}}</div>
<div>-This works: {{site.posts[1].title}}</div>
<div>-This doesn't: {{site.posts[plus_one].title}}</div>

Result:

-Value of plus_one: 1
-This works: The Zone
-This doesn't:

---

Long version:

I'm using Jekyll, with no plugins. I want to give the current post a link to the next post that is in the same category. (The category is hardcoded to 'journal' in this code.)

My code loops over all posts in the category array, looking for the current post. When it is found, I try to grab the next post in the category array.

{% for num in (0..site.categories.journal.size) %}
    {% assign page2 = site.categories.journal[num] %}
        {% if page2.title == page.title and page2.date == page.date %}
            {% capture plus_one %}{{ num | plus: 1 }}{% endcapture %}
        {% endif %}
{% endfor %}

<div>value of plus_one: {{plus_one}}</div>
<div>This doesn't work: {{site.categories.journal[plus_one].title}}</div>
<div>This does: {{site.categories.journal[1].title}}</div>

Result:

<div>value of plus_one: 1</div>
<div>This doesn't work: </div>
<div>This does: A Blog Post Title</div>

I guess the value of my variable 'plus_one' is being treated as a string instead of a number.

Is there any way to convert it to a number?

Or is there another way to achieve what I'm trying to do?

Answer 1

{% for category in site.categories %}
    {% assign catg_name = category.first %}
    {% if catg_name == page.category %}
        {% assign catg_posts = category.last %}
    {% endif %}
{% endfor %}
{% for post in catg_posts %}
    {% if post.title == page.title %}
        {% unless forloop.last %}
            {% assign next = catg_posts[forloop.index] %}
            <li class="previous">
            <a href="{{ site.baseurl }}{{ next.url }}">&larr;{{ next.title }}</a>
            </li>
        {% endunless %}
        {% unless forloop.first %}
            <li class="next">
            <a href="{{ site.baseurl }}{{ prev.url }}">{{ prev.title }}&rarr;</a>
            </li>
        {% endunless %}
    {% endif %}
    {% assign prev = post %}
{% endfor %}

As you have mentioned you can save and use the previous iteration value for the previous post link( in my case I use it as the next post link since I don't want the default newest-first order ). For the next array element you can use forloop.index. This is the 1-based index of the for loop and will give you the next item of a zero-based array.

Answer 2

assign preserves the number:

{% for item in items %}
    {% assign next_i = forloop.index0 | plus: 1 %}
    {% assign prev_i = forloop.index0 | minus: 1 %}
    {{ items[next_i] }}
    {{ items[prev_i] }}
{% endfor %}

Answer 3

You can access the next / previous post via page.next or page.previous as described in the jekyll wiki.

When you want it to be in the same category, you have to assign it to a temp variable iterate that step until you find a matching post (a post in the same category).

You can not use your plus_one variable because of the way liquid works - it's just a string. Using math in liquid is quite complicated, I almost got a headache when I implemented my weighted tag cloud in liquid.

Answer 4

I don't know if jekyll has changed since the accepted answer but I had to make a couple of changes to get it to work. According to the jekyll variables documentation there isn't a page.category, only a list of page.categories. In my site I only use one category per post so getting the first one works for me. If you use multiple categories per post you'll have to tweak this. Also I've run into issues because my categories are capitalized so I added the downcase. And finally, in my config.yml I am using url not baseurl. Hopefully this helps other people because this was the easiest way I found to add prev/next links by category to all posts.

{% for category in site.categories %}
    {% assign catg_name = category.first %}
    {% if catg_name == page.categories.first | downcase %}
        {% assign catg_posts = category.last %}
    {% endif %}
{% endfor %}
{% for post in catg_posts %}
    {% if post.title == page.title %}
        {% unless forloop.last %}
            {% assign next = catg_posts[forloop.index] %}
            <a href="{{ site.url }}{{ next.url }}">&larr;{{ next.title }}</a> |
        {% endunless %}
        {% unless forloop.first %}
            | <a href="{{ site.url }}{{ prev.url }}">{{ prev.title }}&rarr;</a>
        {% endunless %}
    {% endif %}
    {% assign prev = post %}
{% endfor %}

Answer 5

I was having a similar problem, using the answers above I got the following working on my site. Might be of help to someone else.

{% for num in (0..site.categories.work.size) %}
    {% assign page2 = site.categories.work[num] %}
    {% if page2.title == page.title and page2.date == page.date %}
        {% assign next_i = forloop.index0 | plus: 1 %}
        {% assign prev_i = forloop.index0 | minus: 2 %}

        {% if next_i == site.categories.work.size %}
            {% assign next_i = 1 %}
        {% endif %}
    {% endif %}
{% endfor %}

<nav class="pagination">
    <div class="next">
        <a href="work/{{site.categories.work[next_i].slug}}/">Next</a>
    </div>
    <div class="previous">
        <a href="work/{{site.categories.work[prev_i].slug}}/">Previous</a>
    </div>
</nav>