I think Ghost is a great platform to build and publish your own website. This website is powered by Ghost, actually.
For another website that I'm building, I wanted to set a custom home page with the content that I want, rather than just a list of the blog posts.
On Wordpress, I could easily just set a static page as a home page with a few clicks. But unfortunately, that functionality is not available in Ghost.
Why a workaround is needed
For a bit of context, Ghost was/is intended to be a blog only. To quote what one of Ghost the developers said on an old Github ticket:
Ghost is a blog - if you're not putting your blog on your homepage then you're building a website, not a blog?
Fair enough, Ghost has their own philosophy of what their product does.
As an end user though... I like Ghost, a lot - it is easy to use, visually appealing, and not bloated like Wordpress (the main reason why I'm using Ghost), so I really want that functionality in Ghost.
Thankfully, they have now added in the ability to add a custom home page (off of the ticket above), which we can use to build our own static home page. The caveat is that it cannot be done through the UI...
How to create a static home page in Ghost
Ghost has a fairly detailed tutorial on doing this, so I won't repeat everything here, but will expand with the customisation that I did.
The work flow is this:
- Download the theme you're currently using from Settings --> Theme
- Extract the theme, then create a file called
home.hbsalongside the other
- Zip up the theme folder and upload it back into Ghost.
- Next, go to Settings --> Labs and download the route YAML file.
- Modify the routes section of the file as per below.
This will point the home page of your website to show the content of the page "home" (which we will create later), using the template
home.hbs (the file we created earlier).
- If you still want your visitors to see a list of blog posts, you can move the blog URL to
/blogby making this modification to your routes.yaml file:
- Now upload the routes.yaml file back into Ghost
- On the blog itself, create a page with page URL of
home- this is where you can edit the content for your custom / static home page.
Voila! Your home page will now be a page that you control, and the blog has been moved to www.yourdomain.com/blog.
To take it one step further, you can modify the home.hbs template so that it shows both the page content AND dynamically shows the latest blog posts. That's outside of the scope of this little post though.