Adventskalender Day 13 – Ghost – How-To Build a Most Basic Theme

marketpress-adventskalender-13

Today we’re going over the process of creating the most basic theme for the ghost blogging platform.

The only files that are actually required for a ghost theme are index.hbs and post.hbs. The hbs stands for handlebars, a standalone JavaScript templating engine that ghost uses for its theming capabilities.

It provides some built-in helpers but more important, the ability to register your own helper that gives you the power to define abstractions for data modeling. This makes handlebars a valid candidate for a full templating system within simple and complex software.

Settings

To start off, go to your ghost directory, head into /content/themes and create a folder called Basic Theme. Create two files: index.hbs and post.hbs within your newly created folder. To get your theme working, all you have to do is restart ghost. After you did that, head over to http://yourblog.com/ghost/settings/general/ and select Basic Theme.

ghost-settings-middle-sized

index.hbs

index

The index.hbs acts as your front page. It gets handed a list of posts and therefore decides on how they are presented. For this matter you use the foreach helper, which acts as a loop for posts. Every post has a url helper which points to its respective single post.

post.hbs

post

The post.hbs is the template for a single post. To access the data of a single post you have to switch the context with a block expressions called {{#post}}. Within this block, you have the post information you’ll need to create a single post page.

Conclusion

And there you have it. The most basic ghost theme using nothing more than handlebars and vanilla html. Of course you’re not limited to the files and notations provided here. Head over to the ghost docs and have a look at what you can do with the ghost blogging platform.

References:

Ghost theme guide
Theme helper

Post Sharing

Author Avatar

Crafts new MarketPress Products with his colleagues at Inpsyde, he's a JavaScript fanboy and he hates onions!

Also Interesting

muenchen-blog-1000

New: WooCommerce Shop Theme München

by Michael Firnkes

A WordPress and WooCommerce theme that not only looks great, but also excels in functionality? Welcome to München. The template is an addition to our WooC ...

Read more
xtreme

Work with Us on Xtreme One - Framework and Themes Now Free

by Michael Firnkes

We are now offering the theme framework Xtreme One free of charge for collaborations in the community. Here is an overview of some of the most important qu ...

Read more
ffretinaallnews@2x

New: WooCommerce Shop Theme Frankfurt

by Michael Firnkes

Our city tour continues with a particularly attractive design for online shops and blogs: Frankfurt is the latest addition to our WooCommerce and WordPress ...

Read more
WordPress Theme Kiel

New WordPress shop and blog theme: Welcome to Kiel!

by Michael Firnkes

Let's continue on our dynamic city theme tour: After visiting Hamburg and Düsseldorf, we have now made our way to Kiel. In addition to its still th ...

Read more

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">