Add thumbnail to post

Using Ghost
1

New to Ghost (in my trial period). I’m using the free WAVE theme and posts that appear on the home page have a large icon by them, but it’s essentially blank. How do I customize this thumbnail? Thanks!

image
image1136×555 28.2 KB

2

In most themes, that’s the ‘featured image’, which you set in the post editor at the top of the post editor page (above the title). Do you have an image loaded there when you view the post in the editor?

Wave is intended primarily for podcasts, so if you are planning to use it for podcasts, you’ll want to read this: About this theme - it requires some ‘quirky’ setup.

1 Like
3

yup that did it. I really was hoping for a solution where I could control the thumbnail WITHOUT adding an image to my post but I’ll make this work for now. Thanks!

4

My use case is a lot of different media. 2-3 catagories of video, a podcast, articles, etc. Not sure if there’s a better theme for that but right now I’m ok with how WAVE looks.

5

If you’re able to edit the theme, you could make a template that doesn’t show the featured image. Another option would be to use code injection to hide the featured image. Here’s a tutorial that walks you through figuring out what selectors to use:

And then hiding something would be “display: none”

2 Likes
6

Hmmm for some reason it’s not working. When I go to code injector, it offers header and footer injecting but not body? Is that normal. Using the inspector, I was able to determine the name of the object I want to hide and I’ve followed that tutorial but this command seems to have no effect:

<style>
.gh-article-image {
  display: none;
}
</style>

Any thoughts on how I could trouble shoot?

7

Put that in the code injection header.

1 Like
9

Yup that did it! ty!

1 Like
10

To add some extra context for you, the ‘header’ and ‘footer’ options for code injection are for where on the page you want the code to appear. For example, you usually want styles in the header so that they’ll load before the page (which prevents the browser from loading unstyled content and then restyling it), and you often want javascript in the footer, if you’re using it to modify a component on the page (that hasn’t yet been created when the head part runs). Either head or foot code injection /can/ apply to any part of the page, it’s just a question of where on the page source code it gets injected.

1 Like
11

ty for the context, that’s very helpful

1 Like