How to Add and Create Header Image in Blogger

How to add or insert custom header image in blogger is a very first thought of newbie bloggers and when they select any custom theme and ...

How to add or insert custom header image in blogger is a very first thought of newbie bloggers and when they select any custom theme and upload it in blogger, so they start searching and finding some new custom widgets and tutorials that how they can make his/her blog more pretty or awesome if you are a newbie so you should know that every blog has unique logo and header image because it makes the unique sign and identity of blog just like you can also make your header image cool and implement easily in blogger blog for this you would have to read this post with meditation and interest.

Design Your Own Blog Header

Yes, it is necessary that you should have a unique header image you can’t add images from any search engine like Google Image Search because the image present in Google has already used if you grab any simple image from any website or blog and implement it inside your blog header so it would be a bad effect for your blog SEO. 

I know you would be heard this famous quote. “Prevent is better than cure” so don’t take a risk and create your own header image from very professional online web Canva it is very cool for banner creating it has easily done by drag and drop and you can also upload and implement your own images in the banner image. After making the banner image go for image compression from TinyPNG which only decrease your image loading speed and made him more SEO friendly with your blog. Now do some math calculation between your image and header, for fitting and re sizing the image with the blog header use Picresize it helps you a lot to increase or decrease image size.

How to Add Custom Image in Header for Blogger

Visit your blog dashboard>> Template>> Edit HTML>> Click inside the HTML box and tap CTRL+F.

Find or search the below code in the given search box.

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

Change 1 to 4 and no to yes in show-add-element.

Other Alternative: if you want to remove the header image widget, so change true to false in, locked which would be present in the above code, it will display the remove button in the header image widget so go to layout and remove that widget.

Now click on Add a Gadget and select HTML/script.

Add the below code in HTML/script and replace the given information with your blog info then click on Save and your work completed.

<a href="YOUR-BLOG-URL"><img src="YOUR-HEADER-IMAGE-URL" alt="YOUR-HEADER-IMAGE-NAME"/></a>

Connected Article: jQuery Sliding Panel with Expanding Box for Blogger.

After this check your blog unique header image and don’t forget to cheer this informative article with your other friends who are new in blogging.