Soho Theme - Add Newer (Next), Home and Older (Prev) Links in Blog Posts

By default for the new responsive Blogger themes ie Soho, Contempo, Notable & Emporio do not provide a Newer or Home or Older links to navigate in Post pages.

In this article we will show you how to add Newer/Next , Home and Older/Previous navigation links in post pages for Soho responsive Blogger Theme.

Earlier we have discussed on how to add post snippet or your entire blog post text for homepage or index pages for Soho theme. The full working tutorial to add Soho theme post snippets is available here.

Before proceeding, Backup your current theme to your computer using the Backup/Restore button.

• Go to Theme > Edit HTML
• Click Jump to Widget
• Select Blog1 widget
• Expand <b:includable id='main'>...</b:includable> by clicking the small black triangle
• Find below..

    .... {{ codes }} ...
    <b:include name='super.main'/>
  </b:with>
</b:with>

• Add highlighted green like so..

    .... {{ codes }} ...
    <b:include name='super.main'/>
  </b:with>
</b:with>
<b:if cond='data:view.isPost'>
  <b:include name='postPagination'/>
</b:if>

• click Save Theme

Add the CSS to style your Newer, Home and Older post navigation links.

• Go to Theme > Customize
• Select Advanced
• Find & select Add CSS
• Add below...

.blog-pager .blog-pager-newer-link,
.blog-pager .blog-pager-older-link, 
.blog-pager .home-link {
  display: inline-block;
}

.blog-pager .blog-pager-newer-link {
  float: left;
}

.blog-pager .blog-pager-older-link {
  float:right;
}

.blog-pager {
  text-align:center;
  overflow:hidden;
}

• click Apply to Blog.
• Refresh your post pages to view the changes.

The above tutorials was tested and working and can be viewed here.

Hope it helps!