How to add gadget blogger header above and below

By this tutorial you teach that How to add gadget blogger header above and below. Visitors and other friends have complaint that some blogger templates have not any page element widget above or below of the header. I think Page element gadget is very helpful when you are feeling difficulties to place banners and other ads above or below of your blogger header. Really you can use your blogger header for banners or  ads and other important links from your blogger blog. I have already discussed that blogger header is very useful and important place in blogger blog. Every visitor comes to your blog it is essentially that they see first your blogger header. If your blogger header is attractive you have a good chance of clicking on your ads or banners. Now you can also add more like add gadget to blog, add gadgets desktop, add gadget its url,how to add gadgets to sidebar, add gadgets windows vista, add gadgets to desktop vista.

Now I tell you that how you add page element gadget above or below of the blogger header. I have prepared two small codes about this now how you place it in your blogger template, I guide you step by step suggestions and tips see the following instructions.

1. Go to www.blogger.com then Design, Edit HTML and check mark on "Expand Widget Templates" and find the following code line by using Ctrl+F command.
]]></b:skin>


2. Now paste the following code below of the above code line with carefully.
#gadget_header{
margin:10px 0;
padding:1%;
width:100%;}
3. Now I want to introduce that search the following one more code in your blogger template press (Ctr+F) command. 
<div id='header-wrapper'>

4. Now paste the following code before the above code line with carefully
<div id="gadget_header">
<b:section class='header' id='gadgetheader' preferred='yes'/>
</div>

5. Now see the Page Element gadget above for below of the blogger header and if you want to show gadget above or below of the blogger header show the following pictures with fully.
 

 

6.   In view of the above pictures see the green color arrow pointing out to HTML/Javascript, it is the place of code of banners or other things which you have kept below or above of the blogger header, it is very simple that move the above HTML/Javsscript when you want to place above or bottom of the blogger header.

If you like above article please leave your comments.