The Ghost theme layer has been engineered to give developers and designers the flexibility to build custom publications that are powered by the Ghost platform.
Theme development
Ghost themes use the Handlebars templating language which creates a strong separation between templates (the HTML) and any JavaScript logic with the use of helpers. This allows themes to be super fast, with a dynamic client side app, and server side publication content that is sent to the browser as static HTML.
Ghost also makes use of an additional library called express-hbs which adds some additional features to Handlebars, such as layouts and partials.
If you’ve previously built themes for other popular platforms, working with the Ghost theme layer is extremely accessible. This documentation gives you the tools required to create static HTML and CSS for a theme, using Handlebars expressions when you need to render dynamic data.
Our tutorial on the essential concepts to known when building a Ghost theme, provides a fantastic introduction to everything you need to know to start building beautiful themes.
Handlebars
The Handlebars templating language provides the power to build semantic templates effectively.
Installation of Handlebars is already done for you in Ghost ✨
Custom settings
Offering customization options to theme users can be done using custom settings. This allows theme developers to empower non-developers to make controlled changes.
Head to the Custom settings documentation to learn more.
GScan
Validating your Ghost theme is handled efficiently with the GScan tool. GScan will check your theme for errors, deprecations and compatibility issues.
The GScan site is your first port of call to test any themes that you’re building to get a full validation report
When a theme is uploaded in Ghost admin, it will automatically be checked with
gscanand any fatal errors will prevent the theme from being usedgscanis also used as a command line tool
Command line
To use GScan as a command line tool, globally install the gscan npm package:
# Install the npm package
npm install -g gscan
# Use gscan <file path> anywhere to run gscan against a folder
gscan /path/to/ghost/content/themes/casper
# Run gscan on a zip file
gscan -z /path/to/download/theme.zip
What’s next?
That’s all of the background context required to get started. From here, take a look at the structure of Ghost themes and templates, and learn everything you need to know about the package.json file.
For community led support about theme development, visit the forum.
