How to Create A Tags List Page in Your Ghost Theme

Ahmad Ajmi
Mar 19, 2018 · 3 min read

Adding a page to list all the tags in your Ghost theme will give your readers the opportunity to discover and browser your content.

In this post, I will share with you how to add a custom tags page to your Ghost theme. I will use the default Casper theme as an example, but all the steps and code will apply to any theme with a little customization as required.

Enable the Ghost Public API

Create the Tags Static Page

  • Click the Turn this post into a static page checkbox.
  • Publish the page.

Create the Tags Page Theme File

{{!< default}}<header class="site-header outer">
<div class="inner">
{{> "site-nav"}}
{{#post}}<main id="site-main" class="site-main outer" role="main">
<div class="inner">
<header class="post-full-header">
<h1 class="post-full-title">{{title}}</h1>
{{#get 'tags' limit='all' include='count.posts' order='count.posts desc'}}
{{#foreach tags}}
<a href='{{ url }}'>
<h2>{{ name }} <small>({{ count.posts }})</small></h2>

In this code, the get helper used to get the blog tags. The include attribute used to get the posts count. The order attribute used to order the tag list based on the posts attached to them.

Next, the foreach helper used to loop through each tag and render the list with the tag URL, title, and the posts count.

This is an initial example of what you can do to the tags page. You can take the code further and show the tag image with custom design. As an example, you can create something like what I have done with the Nubia and Sinai themes. You can also add the tag page link to the blog navigation.

Nubia Theme Tags Page
Sinai Theme Tags Page

I would recommend checking the official Ghost tags documentation for more information about the list of available attributes.

If you are looking for fast, elegant and premium Ghost themes, make sure to visit Aspire Themes 👌

Aspire Themes

Elegant WordPress, Ghost & Jekyll Themes

Ahmad Ajmi

Written by

I Create Themes @aspirethemes :: @envato Author

Aspire Themes

Elegant WordPress, Ghost & Jekyll Themes