How To Make a Custom Ghost Theme - Part 1

Firstly you need to figure out the Theme Structure

File Structure

  • assets folder contain the CSS Folder,JS Folder,Font Folder and image folder.
  • the default.hbs file
  • the index.hbs file
  • the post.hbs file
  • the package.json file
Other optional file
  • home.hbs
  • error.hbs
  • author.hbs
  • page-{{slug}}.hbs
  • tag-{{slug}}.hbs

It's highly recommended that you use a default.hbs file as a base layout for your theme,in order to be consistent with other themes,If you have sighificantly different layout for different pages,you can have multiple layout,build a hierarchy or use partials to encapsulate common parts of your theme.


This is the default layout,or base template which contain all the boring bits of HTML that have to appear on every page.
The default template contains the handlebars expression {{{body}}} to denote where the content from templates which extend the default template goes.
Page templates then have{{!< default}} as the very first line to specify that they extend the default template,and their content should be placed into place in default.hbs where {{{body}}} is defined.