Jekyll paginate blog as subdirectory

Question

I'm using Jekyll for a static site and I'm trying to generate the blog as a subdirectory/subfolder:

http://example.com/blog

In the directory structure before running jekyll, this is blog/index.html.

I tried adding pagination by adding "paginate: 5" to _config.yml, but the generated url's were of the form:

http://example.com/page2/

i.e. no "/blog". This is fixed by:

paginate_path: /blog/page/:num

in _config.yml.

But the resulting generated pages at:

http://example.com/blog/page/2/

don't use blog/index.html as their layout. They use the root index.html. What's the point in even having the paginate_path option, then?

How do I get my blog at example.com/blog, with pagination, using Jekyll?

Answer 1

Use the destination key in your _config.yml file to set the base path where you want the output to be published to. For example,

paginate: 5
destination: _site/blog

Note that assuming your site is setup to server its root (e.g. "http://example.com/") from "_site" jekyll won't produce and "index.html" page at that location. Everything that jekyll builds will be under the "blog" directory, but that sounds like what you are after.

Answer 2

I found a fix via this page Basically it involves a bit of a hack to figure out if you are on the nth page of the blog and then includes a file that pulls in you blog section.

Create a file in _includes/custom/ called pagination. In that have your pagination code

<!-- This loops through the paginated posts -->
{% for post in paginator.posts %}
  <h1><a href="{{ post.url }}">{{ post.title }}</a></h1>
  <p class="author">
    <span class="date">{{ post.date }}</span>
  </p>
  <div class="content">
    {{ post.content }}
  </div>
{% endfor %}

<!-- Pagination links -->
<div class="pagination">
  {% if paginator.previous_page %}
    <a href="/page{{ paginator.previous_page }}" class="previous">Previous</a>
  {% else %}
    <span class="previous">Previous</span>
  {% endif %}
  <span class="page_number ">Page: {{ paginator.page }} of {{ paginator.total_pages     }}</span>
  {% if paginator.next_page %}
    <a href="/page{{ paginator.next_page }}" class="next">Next</a>
  {% else %}
    <span class="next ">Next</span>
  {% endif %}
</div>

Now in your _layout/index.html add

{% if paginator.page != 1 %}
{% include custom/pagination %}
{% else %}
The original content of index
{% endif %}