Different hero image to feature image?

Developer help
1

Hi,
I use feature images for my post index, but don’t want to always use the feature image as my hero image on top of the post.

I know I can

  1. Use custom post templates for slugs
  2. Modify the post.hbs template to remove the feature image (and always put in my own hero image)

But I’d like to make it an option. e.g. Change the {{if}} code.

Right now the code in post.hbs says “If there’s a feature image, stick it on top of the post!”

Any suggestions for how to make this hbs code say “if there’s a feature image and no hero image, which I checked by looking for various classes or HTML elements, then put it on top! Otherwise do nothing.”

That way I’d do something like put " in the header, just for times I want to do this.

AFAIK I can’t use handlebars to check for the presence of DOM elements, right?

Thanks!

2

Hey @dana!

You can use tags for this - specifically “internal tags” (they start with a “#”) - here’s the docs on them Organising Content in Ghost - FAQ

Once you add the #my-custom-hero-tag to your posts, in post.hbs you can do smth like:

{{#has tag="#my-custom-hero-tag"}}
  <!-- do some cool stuff here -->
{{else}}
  <!-- do some equally cool - but different - stuff here -->
{{/has}}

Does this help you achieve what you need?

P.S. Here is a not so trivial real life implementation: https://github.com/TryGhost/Blog/blob/master/post.hbs

3

Brilliant! I thought of tags but missed the memo on internal tags. Thanks for bringing my attention to this @egg, I was poring over the docs but missed it!

1 Like
4

Hijacking this thread. How can I disable the feature image from the post page completely but it will still show as a feature/preview image otherwise at homepage?

EDIT: found the solution