Well as you can see on our blog the adsense ad live beside the HU logo we have uploaded, so actually you can add anything at that place instead of just implementing the ad, you can even ad some nice navigation that you could easily use to allow your readers to view some of your awesome posts, well whatever you wanted to add you can do that by just adding an option to add additional gadgets in your header.
So today we are going to see how exactly you can add additional widget in your blogger blog header. So it includes you to manipulate and add some of your Edit HTML codes, so make sure to backup your template before attempting.
Important Backup your template before attempting any of the steps below, as in some case if you ace problem, you would be able to restore your template.
- Open Blogger > Template > Edit HTML.
- Now search for
]]></b:skin>tag & paste below code above it..header-left{display:inline-block;float:left;height:35px;width:350px}.header-right{display:inline-block;float:right;width:600px}
- Again search for
<b:section class='header' id='header' maxwidgets='1'>& replace it with the below code.<b:section class='header-left crosscol' id='header' maxwidgets='2' showaddelement='yes'>
- Now search for
</header>& paste below code above it.<b:section class='header-right crosscol' id='header-right' maxwidgets='1' showaddelement='yes'>
<div style='clear:both;'/> - Now just change the bolded numbers in the above CSS code for obtaining the best possible size for your blog.
- Now navigate to Blogger > Layout and you will additional header widget, just press Add Gadget and choose HTML/JavaScript Gadget.
That's it now your additional header is added, now either you can add the adsense code, to display the advertisement or you can add any other HTML based navigation it will work pretty fine. So hope this tutorial helps you in getting the most out of your blogger template, face any problem do comment.