Implemented pagination of posts.

README.md

@@ -18,6 +18,7 @@ This is a plug-and-play Jekyll theme best suited to use on [GitHub Pages](https:
 - Fully responsive and mobile optimized base theme
 - Sass/Coffeescript support using Jekyll 2.0
 - Free hosting on your GitHub Pages user site
+- All the SEO goodies comes in-built
 - Markdown blogging
 - Elegant typography
   - Futura PT fonts (The same fonts which has been used on <https://pixar.com>)
@@ -26,6 +27,7 @@ This is a plug-and-play Jekyll theme best suited to use on [GitHub Pages](https:
 - Disqus commenting
 - Google Analytics integration
 - Fuzzy search across blog posts
+- Pagination of posts works out-of-the-box.
 - Categorize posts out-of-the box
 - A home widget to show recent GitHub commit
 - RSS Feed
@@ -71,6 +73,14 @@ categories: [PHP, Laravel]
 
 The contegorized content can be shown over this URL: <https://yourgithubusername.github.io/categories/>
 
+## Pagination
+
+Pagination of posts in Reverie works out-of-the-box. You only need to speficy number of posts you want on a single page in `_config.yml` and reverie will take care of the rest.
+
+```yml
+paginate: 6
+```
+
 ## RSS
 
 The generated [RSS feed](https://en.wikipedia.org/wiki/RSS) of your blog can be found at <https://yourgithubusername.github.io/feed>. You can see the example RSS feed over [here](https://www.amitmerchant.com/feed).

_config.yml

@@ -82,9 +82,13 @@ plugins:
   - jekyll-sitemap # Create a sitemap using the official Jekyll sitemap gem
   - jekyll-feed # Create an Atom feed using the official Jekyll feed gem
   - jekyll-seo-tag
+  - jekyll-paginate
 
 include: ['_pages']
 
+paginate: 6
+paginate_path: /page:num/
+
 # Exclude these files from your production _site
 exclude:
   - Gemfile

_posts/2019-02-13-introducing-reverie-jekyll-theme.md

@@ -13,9 +13,10 @@ This is a plug-and-play Jekyll theme which you can use on GitHub Pages without e
 ## Features overview
 
 - Command-line free fork-first workflow, using GitHub.com to create, customize and post to your blog
-- Fully responsive and mobile optimized base theme (Theme Demo)
+- Fully responsive and mobile optimized base theme
 - Sass/Coffeescript support using Jekyll 2.0
 - Free hosting on your GitHub Pages user site
+- All the SEO goodies comes in-built
 - Markdown blogging
 - Elegant typography
   - Futura PT fonts (The same fonts which has been used on <https://pixar.com>)
@@ -24,6 +25,7 @@ This is a plug-and-play Jekyll theme which you can use on GitHub Pages without e
 - Disqus commenting
 - Google Analytics integration
 - Fuzzy search across blog posts
+- Pagination of posts works out-of-the-box.
 - Categorize posts out-of-the box
 - A home widget to show recent GitHub commit
 - RSS Feed

index.html

@@ -2,9 +2,8 @@
 layout: default
 ---
 
-<!--<div id="gh-latest"></div>-->
 <div class="posts">
-  {% for post in site.posts %}
+  {% for post in paginator.posts %}
     <article class="post">
 
       <h1><a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a></h1>
@@ -20,4 +19,31 @@ layout: default
       <a href="{{ site.baseurl }}{{ post.url }}" class="read-more">Read More</a>
     </article>
   {% endfor %}
+
+  <!-- pagination -->
+  {% if paginator.total_pages > 1 %}
+  <div class="pagination">
+    {% if paginator.previous_page %}
+      <a href="{{ paginator.previous_page_path | prepend: site.baseurl | replace: '//', '/' }}">&laquo; Prev</a>
+    {% else %}
+      <span>&laquo; Prev</span>
+    {% endif %}
+
+    {% for page in (1..paginator.total_pages) %}
+      {% if page == paginator.page %}
+        <span class="webjeda">{{ page }}</span>
+      {% elsif page == 1 %}
+        <a href="/">{{ page }}</a>
+      {% else %}
+        <a href="{{ site.paginate_path | prepend: site.baseurl | replace: '//', '/' | replace: ':num', page }}">{{ page }}</a>
+      {% endif %}
+    {% endfor %}
+
+    {% if paginator.next_page %}
+      <a href="{{ paginator.next_page_path | prepend: site.baseurl | replace: '//', '/' }}">Next &raquo;</a>
+    {% else %}
+      <span>Next &raquo;</span>
+    {% endif %}
+  </div>
+  {% endif %}
 </div>

style.scss

@@ -690,6 +690,26 @@ Modules - reusable parts of our design
   color: #fff;
 }
 
+.pagination a, .pagination span {
+  padding: 7px 18px;
+  border: 1px solid #eee;
+  margin-left: -2px;
+  margin-right: -2px;
+  background-color: #ffffff;
+  display: inline-block;
+}
+
+.pagination a {    
+  &:hover {
+      background-color: #f1f1f1;
+      color: #333;
+  }
+}
+
+.pagination {
+  text-align: center;
+}
+
 @media only screen and (min-width: 320px) and (max-width: 759px) {
   #carbonads {
     float: none;