What is Handlebars


Handlebars is a templating language that Ghost uses to make the ability to go grab content from the database very easy. Since the content of a blog is constantly updating, the ability to grab recent updates is obviously important.

Handlebars can seem complicated at first, but it is actually pretty simple. Handlebars is really just information that you are putting inside your html. You still create all the html for your site just like you would normally, but instead of typing in the content yourself, you use a handlebar shortcut and have the content be able to update dynamically. For example, instead of having a header for a page look like this:

<h1>My Awesome Blog</h1>

You can use the Handlebars shortcut for the blog title, so, if you update the title in the Ghost backend, it updates on the front end as well.

<h1>{{@blog.title}}</h1>

Handlebars is characterized by curly braces ex. {{content}}. When you are creating or editing a theme, you will find that these Handlebars templates can save you, or the user of your theme a lot of time.

With Handlebars, you also have the ability to use some logic. You can use foreach loops, or if statements to help show certain code for specific requirements. For example, if you want to loop through each post and display the post title with a link to the page, you can do something like the following:

{{#foreach posts}}
    <div>
        <a href={{url}}>{{title}}</a>
    </div>
{{/foreach}}

This code loops through each post, and then fills in the post title with the link to that post. Obviously this is super basic, but should get the point across.

For information on all of the hanldebars helpers, check out Ghost's theme documentation. They do a great job with how to use each helper, and there is a lot of great information there