How to add Custom featured Image in Blogger? [Step-by-Step]

Have you ever thought, you (Blogspot users) can set a specific featured image on your blog posts? Well, the answer is Yes & today I am gonna share a complete guide on the same, i.e. how to add custom featured image in Blogger?

After reading this easy to follow, guide you will be able to set specific featured image/ post thumbnails in all your blog posts.

What is Featured Image (Post Thumbnail) in Blogger?

Featured image is the primary image appears along with the content while sharing on Social media channels. A featured image can also be seen at the top of blog posts in some blogs. Below image is the best example of a featured image.

Add Custom featured Image in Blogger : Step-by-step Guide

Benefits of Adding a Featured Image:

  • Adding a featured image makes your blog look more attractive.
  • A catchy featured image increase CTR (Click Through Rate),
  • Blog posts with post thumbnails are appealing.
  • Adding a featured image indirectly improve SEO.
  • Featured Image helps boost Social engagement.

Let us know, how you can add featured image in Blogger.

How to add Custom Featured Image in Blogger?

Adding featured image in Blogger is easy. Follow the below step-by-step guide and implement as well.

Step 1: Get the Image Address

First, you need to have the address of the image, you want to display as a featured image. In order to get the image address, you need to upload the desired image in Blogger post editor.

  • In order to upload an image, you have to click on the Insert image icon & then upload the image. You can upload images from your computer, an image URL or from Google Drive.

Add Custom featured Image in Blogger : Step-by-step Guide

  • Once you upload the image into the Blogger post editor, next you have to right click on your image and Copy Image address as shown in the below image.

Add Custom featured Image in Blogger : Step-by-step Guide

  • In this way, you will get the image address. Next, follow step 2!

Step 2: Paste Image Address in the below code

Now you have to just add your image address in the below HTML code:

<img src="image-URL" style="display:none;">

In the above code replace the image-URL with the Image address you have copied in Step 1. After you add the image address in the above code, it looks like this:

<img src="https://1.bp.blogspot.com/-AJmCVc_KPU8/XExwsEfaQuI/AAAAAAAAAY8/2zJtRIk683k6xMKnJoJuf6O-2xs3T9JgQCEwYBhgL/s400/Screenshot%2B%25281408%2529.png" style="display:none;">

The red link in the above code is image address. Follow the last step & let’s finish.

Step 3: Add HTML Code to Blogger Post

In the last step, you have to copy the above HTML code (you have made in Step 2) in the HTML section of Blogger post editor. Follow the below sub-steps:

  • Visit Blogger >> Posts >> Edit any post >> Click on HTML

Add Custom featured Image in Blogger : Step-by-step Guide

  • After you click on HTML, you will get a large HTML code. You just have to paste the above HTML code (the code you have made in Step 2) at the top of this code.

Add Custom featured Image in Blogger : Step-by-step Guide

Conclusion:

As we have seen you can easily add custom featured image in Blogger by following 3 simple steps. I hope you love this Step-by-step guide.

If you have really learned something new, leave a comment to let me know. Appreciate my efforts by sharing this post.

See you soon with a new post!

P.S. I’m using KWFinder for finding long tail keywords with low SEO difficulty.

[ctt template=”10″ link=”pR1fY” via=”yes” nofollow=”yes”]Add Custom Featured Image in Blogger: Step-by-step Guide[/ctt]

5 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

Get a Free Consultation Today!

Need a professional website and better visibility? I can help! Contact me now to see how I can improve your online presence.

Hi, I’m Harish Joshi — a digital marketer and web developer by profession. I help small businesses enhance their online presence through my digital marketing and development services. Connect with me at [email protected] for a free consultation.

© 2024 Harish Joshi – All Rights Reserved