Starting Ghost: Custom homepage

How to use a page as your landing page in Ghost, instead of your blog index.

Starting Ghost: Custom homepage
Photo by Markus Winkler / Unsplash

If you want a blog/newsletter archive on your site, but don't want it to BE your site, you need a routes.yaml file.  Here's an example:

    template: page
    data: page.home

    permalink: /writing/{slug}/
    template: index
    filter: tag:blog
    permalink: /newsletter/{slug}/
    template: index
    filter: tag:newsletter

This example serves a page with the slug 'home' at  (You can set up your page's slug by pulling out the side editing menu.  Or feel free to change it (second line).

This example has two collections - one for blog posts, that have a tag "blog" and another for newsletter posts, that have a tag "newsletter".  You can change the URLs (permalink lines) or the tags (filter lines) easily.  For this setup, posts need to be tagged either newsletter or blog or they won't show up either place.  (Or both, in which case they'll show up in both places!)

Since visitors are going to land on your homepage, you'll probably want to go to Settings > Navigation and add entries for /newsletter and /writing so that they can find your content.

After you edit your routes.yaml file to make it exactly how you want it, go to Settings > Labs to upload it.  (Scroll down for routes.)  Note that spaces matter in routes.yaml - everything indented is indented exactly two or four spaces. No tabs.

I earn affiliate payments from Ghost Pro if you sign up with them for a new hosting account using one of my links. I was recommending them before I became an affiliate, and my opinion hasn't changed. They're pretty awesome.

This site's own front page is set up with this method.  The content lives in a page (named 'home' - I wasn't feeling very inspired that day), and the routes.yaml file causes that content to appear at /.  Add in the new header cards, and you're well on your way to a landing page!