Having trouble creating a custom Home Page

Developer help
1

I’m trying to get a custom home page to render in Ghost and I’m a little confused at how it pulls (or doesn’t pull) changes in.

I was able to customize the header and footer easily enough, but for some reason, the theme isn’t picking up my custom home.hbs page. Here’s my route configuration:

routes:
/:
data: page.home
template: home

For the time being, I only want the home page to be a static coming soon page. It’s currently showing a 404 error https://www.vigilforamerica.com/

I don’t know if it’s because I’m trying to render normal HTML in an .hbs file, or what the issue is.

2

It is probably not finding the template. So either in your hbs you need to reference it {{home template}} (different for each theme)

Then you have to also make sure in your routes.yaml that you are pointing to the right template and data. I got my homepage to show a Page from my admin, as well as html and blog posts which was a feat on its own. So I understand your pain.

3

Things to make sure are correct:

Routes

routes:
  /:
    data: page.home
    template: home

Page URL

From the page settings, the Page URL should be home

Template file

Should be home.hbs with the following helpers as a base to show the right content.

{{!< default}}

{{#page}}

{{ content }}

{{/page}}

Also, regarding the 404 error, activate another theme, and then activate your theme again. This helped me before.

4

So I have my routing correct as you shared, but I have these helpers but am I only supposed to have the helpers? The content I have isn’t rendering on the home page at all, so I’m just wondering what the content tag is supposed to show.

Here’s a sample of what comes after the {{content}} tag:

<div class="stars"></div>
<div class="twinkling"></div>
<div class="clouds"></div>

<div>
    <h1>We're getting a little restless waiting for people to wake up.</h1>
        <img src="/Users/Bre/Desktop/Important Logos/Color logo - no background copy.png" alt="Vigil for America logo">
</div>

Yet nothing shows on the page?

5

So, what is inside your home.hbs file?

No, they are the essentials, responsible for showing the content, you can then add other theme code around. Try to copy and past the theme into your home file and see how it goes…

6

Hey all, just wanted to say I finally got this figured out. Being a WordPress head, I didn’t realize that you had to publish the page in order to see the changes for custom pages, rather than use the preview feature. All my changes showed up once I published it, but I did have to go back and make modifications constantly.

I don’t know if this is a matter of the nature of Ghost or if I’m missing something, but I appreciate the assistance!

1 Like