Jekyll pagination navigates to wrong page

Question

The issue: You can click on ‘Older’ to get to the second page of older blog, i.e. https://www.bgigurtsis.com/blog/page2/. However, clicking on ‘Newer’ once on that second page takes you to the homepage https://www.bgigurtsis.com, as opposed to the page you were just on https://www.bgigurtsis.com/blog

I’ve made this GIF to illustrate the issue: https://i.imgur.com/JN9qXoN.gif

My setup I’m using a Jekyll theme hosted on AWS Amplify. Usually for this theme the index page is where all the blog posts are. I changed this so the index page is a ‘welcome’ post with a hyperlink to the blog instead.

To achieve this:

I moved index.html (pagination code) from my root dir into a folder called ‘blog’
Added an index.md (welcome page) in my root directory.
Added this code to my _config.yml: paginate_path: “/blog/page:num”

Here’s the folder structure:

website
├── config.yml
├── index.md (welcome post)
├── blog
       ├── index.html (paginate code)
│
├── posts
       ├── post1.md
       ├── post2.md
       ├── post3.md
       ├── post4.md
       ├── post5.md

My _config.yml build settings:

# Build settings
markdown:     kramdown
redcarpet:
  extensions: ['smart', 'tables', 'with_toc_data']
permalink: /blog/:title
paginate_path: "/blog/page:num"
paginate:     4

Here's my pagination code, contained inside blog/index.html:

---
layout: default
---
{% assign posts_count = paginator.posts | size %}

<div class="home">
  {% if posts_count > 0 %}
    <div class="posts">
      {% for post in paginator.posts %}
        <div class="post py3">
          <p class="post-meta">
        {% if site.date_format %}
          {{ post.date | date: site.date_format }}
        {% else %}
          {{ post.date | date: "%b %-d, %Y" }}
        {% endif %}
      </p>
          <a href="{{ post.url | relative_url }}" class="post-link"><h3 class="h1 post-title">{{ post.title }}</h3></a>
          <span class="post-summary">
            {% if post.summary %}
              {{ post.summary }}
            {% else %}
              {{ post.excerpt }}
            {% endif %}
          </span>
        </div>
      {% endfor %}
    </div>

    {% include pagination.html %}
  {% else %}
    <h1 class='center'>{{ site.text.index.coming_soon }}</h1>
  {% endif %}
</div>

The homepage for my blog is here bgigurtsis.com

The repistory for the blog is here bgigurtsis/blog

Pagination links the button “Older” to my homepage instead of the first page of my blog. It seems like pagination dosen’t know that bgigurtsis dot com/blog is the first page of blog posts but i’m not sure how to fix this. Any ideas?

Thank you!

bgigurtsis bgigurtsis · Accepted Answer · 2021-02-19T14:49:11

In ./_includes/pagination.html it tells pagination where to navigate when going to newer posts. By default this is set to / which works when your blog posts usually are. I simply changed this to /blog.

The full change can be seen here: https://github.com/bgigurtsis/blog/commit/72f6210518551b8983a27ef2bf44bf67028b6b4f

Jekyll pagination navigates to wrong page

1 Answers