Problems with creating a custom theme

Hello! I’m using Ghost 5.87.2 locally and I was about to make a custom theme. For the base theme I chose Attila (v3.7.1). I scanned it with gscan and it was compatible. I imported it and activated it via the ghost admin dashboard and now I’m editing it in VS Code (the path is {ghost_dir}/content/themes/attila-master).

My problems are the following:

  • Even after making changes on the theme, nothing reflected on the application (I noticed attila uses grunt instead of gulp, maybe that’s the reason)
  • There presents a floating Subscribe button (probably from Casper theme), even thougt in attila there is no such .hbs file. I don’t want it to appear in my modified theme.
  • I can’t find enough material to track down how the ghost engine renders it’s frontend. I see handle bars such as {{ghost_head}} and {{ghost_foot}}, but there are not any .hbs for them. Can I customise them?

I really want to customize my theme to look as I want. If you can, please provide me a link to a tutorial where the details are covered.

1 Like

Hey @sm-samax , welcome to Ghost!

Most themes require a build step that compiles the CSS (and sometimes JS). If you aren’t doing that, that’s probably your problem. There are directions here: GitHub - zutrinken/attila: Ghost Theme

You need to run (after following the setup directions above) grunt build before reloading the page, or grunt to watch for changes and rebuild automatically.

You may still need to restart Ghost to see new handlebars files, but changes to .hbs files should be immediately visible if you’re developing locally.

  1. That floating button is ‘Portal’, which is loaded by {{ghost_head}} and is not accessible at the theme layer. If you don’t want it visible, you can change that in /ghost > settings (gear icon) > portal

  2. This is probably the documentation page you’re missing: https://ghost.org/docs/themes/helpers/

Unfortunately, {{ghost_head}} and foot cannot be customized without building a custom version of Ghost. (Not just the theme, but the core itself.) You can read more about it here:

It /can/ be replaced, but it’s a big job. I’ve done it once (but for 4.x). [Sorry, this post is not a full set of details – it took a tremendous amount of snarly handlebars, some of it specific to 4.x. One of these days I’m going to clean up a 5.x version…

2 Likes

Thank you so much for the detailed answer! You just saved me a lot of time. :)

2 Likes