How to Hide Posts by Tag in Ghost: A Beginner’s Guide

If you’re using Ghost as your blogging platform and want to hide specific posts based on tags, you can do so by modifying your theme files.

I use Ghost.org managed ghost platform with doks theme for one of my blogs and I had to hide few posts from the blog listing page.

This guide will walk you through the simple steps to achieve this using the {{#has}} helper which I used in my setup to hide the posts.

Why Hide Posts by Tag?

There can be many reasons to hide a post on a specific page. For example, I had a use case where I needed to hide a few posts that were off-topic for my audience, while still keeping them accessible on my Ghost blog.

Also, for example, if you have posts tagged as “#deals” or “#promos” that you don’t want visible to all visitors, you can filter these out with a small code tweak.

The need to hide posts varies depending on user requirements

Steps to Modify Your Theme Files

To implement this, you need to modify your theme files because Ghost does not have built-in functionality for this.

Note: If you dont know how to modify your theme files, I would suggest you to get help from developers.

Step 1: Locate Your Theme File

First you need to locate you theme file where it contains the code for the homepage, blog page or the section where you display posts.

For example, for me the blog page code was located in blog-grid.hbs.

If you have doubts, you can contact the theme owner to understand the file that has the post display logic.

Step 2: Find the {{#foreach posts}} Block

Once you locate the file, look for the {{#foreach posts}} block, which is responsible for looping through and displaying your posts.

You can use a code editor to search effectively.

Step 3: Modify the Code

Add the {{^has}} helper to check for specific tags and hide posts that match.

Lets say your origial code block looks like the following.

{{#foreach posts}}
    <div data-pagination-post class="{{post_class}}">
        <!-- Post content -->
    </div>
{{/foreach}}

Now lets say you want to hide posts with multiple tags. For example, #tag1, #tag2, #tag3 etc.

You need to modify the code as given below by adding the {{^has}} helper.

{{#foreach posts}}
    {{^has tag="#tag1, #tag2, #tag3, #tag4, #tag5, #tag6, #tag7" }}
        <div data-pagination-post class="{{post_class}}">
            <!-- Post content -->
        </div>
    {{/has}}
{{/foreach}}

The {{^has}} helper checks if a post does not have any of the specified tags in a single list. This ensures that posts with any of the listed tags are excluded from rendering.

The ^ symbol is used for negation, meaning “not” in this context.

Applying This to Other Templates

If you need to hide posts with certain tags on other pages, like author or tag pages, you can apply the same method to author.hbs and tag.hbs templates.

Final Steps

After updating your code, save the file.

Ensure you have the backup of your website.

Now, Zip your theme folder and upload it back to Ghost via Settings > Theme.

Refresh your homepage and check to ensure that posts with the specified tags are hidden. If you have enabled caching, ensure you clear the cache.

Conclusion

Using the {{^has}} helper in Ghost makes it easy to control which posts appear on your site based on tags.

This simple customization can help tailor the visibility of your content and create a more refined user experience.

If you need any help or facing any issues, drop a comment and we will help you out.