This tutorial guides you through the process of developing a custom Ghost theme for your Ghoststead site. The steady-cli utility makes this easy by creating a local development environment with a base theme that allows you to quickly get started. When your theme is ready to deploy, the steady allows you to publish your theme to your site automatically without having to click through the admin UI.
Getting started consists of the following steps:
1. Install NodeJS using nvm
2. Install steady-cli using the Node Package Manager (npm)
3. Run steady setup from an empty project directory.
4. Start a local development version of Ghost using steady start.
5. Run the livereload development server vi steady develop.
While steady-cli run from the command-line, it's still very easily to use. The steady application provides commands for everything you need to develop a theme. No more need to cobble together a bunch of different tools.
If you've done any web development before, this step will be familiar - or even already done. You need to install a version of NodeJS - node is what runs steady.
By far the best way to install NodeJS is to use nvm - it allows you to manage different versions and switch back and forth between them. The one drawback to nvm is that it doesn't work for Windows. If possible install nvm and then run:
nvm install lts/erbium
If you can't - or don't want to - use nvm then just install the LTS release of NodeJS directory for the site: https://nodejs.org/en/download/.
There are installers for every major platform - just follow the instructions for your system.
Once you have NodeJS installed, installing steady-cli is simple. NodeJS comes with its own installer for node-based packages named the 'Node Package Manager' (npm). Using npm you can install steady-cli via the single command:
npm install -g steady-cli ghost-cli yarn
Don't worry about the other two packages, steady-cli uses them internally - you'll never have to call them directly.
Validate it whether installed correctly by printing the help:
Run steady setup
The setup command creates a directory structure including a local development instance of Ghost and a basic theme.
The theme is located in
content/themes/ghoststead. If you are checking your theme into source control, that directory should be your repository.
Run ghost start
A local development version of Ghost is setup through previous steps. You need to start it using via:
The start command runs Ghost in the background with progress logs stored in content/logs.
You can setup your Ghost instance as usual at: http://localhost:2368/ghost/.
In order to stop Ghost, run:
Run the development server
The final step is to run a development server that watches for changes and rebuilds the theme:
The develop commands runs a process in the foreground that watches the theme source files - in content/themes/ghoststead - and rebuilds everything when something changes. If you make any change to one of the source files - Handlebars, Sass, etc - then that change will be available when you reload your browser page. No need to restart Ghost.