How do I tell blogger which image is the thumbnail to use in data:post.thumbnailUrl?

In fact, you can, but in a little hack way.

As blogger considers the first image in a post as a thumbnail, and you want to add some other image as a thumbnail which should be not included in a post or something like that....follow these steps.

  1. Add the thumbnail image at the top of the post.
  2. Go in 'HTML'(you're in customise tab right now) and locate the image tag.
  3. Add style attribute to it and add display property to none: <img style="display:none;">
  4. Come back to customise tab and publish the post.
  5. You'll notice that on the home screen, you can see the thumbnail but after opening the post you'll not see it.
  6. That's it!

If anyone didn't understood this, then I've wrote a blog post based on this.


You can't control this, Blogger decides for itself which image to use.

I did some reasearch a while back (documented here), and concluded that it's most probably the first picture in the post which is both

  1. over a certain size, and
  2. hosted in your own Google Photos albums.

From memory, I think that testing showed that the size was 17k. But I'm not 100% sure if that rule is universal - it may depend on the picture dimensions, too, since I cannot see that a very tall or wide thumbnail would be overly useful.


Blogger doesn't pick images by magic. Blogger will automatically choose the first image as a thumbnail. So if you need to keep your own image as thumbnail, please make sure that the desired image is kept first while you write the post.