See Latest Post

Adding Gadgets below or above the header at Blogger sites.

Google's Blogger is great blogging platform for a new blogger as it is completely free. And it's Google's properties. So everybody loves and likes Blogger as their first choices. Besides, it has many default templates that you can select it without having programming knowledge. But has some limitations. If you want to uplift that limitations, you must have minimum coding knowledge. Suppose you want to add to many gadgets above or bellow header. In default template, it is not possible to add more than One gadget, moreover the gadget will be visible only bellow the header image. How will you resolve the issue so that you can add multiple functions above or below header to make your blog user friendly and SEO optimized? Yes, dear visitors I'll tell you the secret of adding multiple gadgets above or bellow the header image. Don't worry, you don't need to have programming knowledge on it. Just follow me and
do as I say and describe. Remember at first, as we will make an experiment over Blogger default template, So keep backup of your whole template so that you can restore it if any disturbance happens. To do it.... follow the instructions.

  • Go to http://www.blogger.com with your Gmail and password.
  • Click on Template
  • Now Click on Backup/Restore button at the right upper corner.
  • A popup will be visible, now click on Download full template and last of all close it.
  • Now click on Edit HTML button to enter into the HTML or Code editor box.
  • Press Ctrl+F to find out specific part of coding.
  • Copy the following part and paste it into search box to find out it.
 
<div id="header-wrapper"> 

  • If you could not find the above code find this part of the code
 
<b:section class='header' id='header'

  • You can see the following complete code
 
<b:section class="header" id="header" maxwidgets="1" showaddelement="no">
<b:widget id="Header1" locked="true" title="Sample Blog (Header)" type="Header">
</b:widget>
</b:section></div> 

Now change maxwidget value '1' to '5'
<b:section class="header" id="header" maxwidgets="5" showaddelement="no">
<b:widget id="Header1" locked="true" title="Sample Blog (Header)" type="Header">
</b:widget>
</b:section></div>

Done! you have successfully added gadgets bellow or above header. Now you can display At least five items bellow or above header. For example see, I have added a multiple drop down menu above header and a random post highlighter bellow the header. If you want to do it, just go to Layout opton now. Click on Add a gadget. Now I think it's not necessary tell everything. If you have any obscurity, please me informed through comments. I shall try my best to help you. Take care, bye..!

No comments