Widgets

How to Add Adsense, Search Box Or Any Gadget Beside Header

Do you want to put  adsense code, search box, banner or any gadget beside your header image? Do you experience difficulty in landing this page?Here is a tutorial of  the steps on how to make it. Having a gadget beside your header adds professionally to your blog and has a huge impact on your blog traffic as well. So, let us now jump to the tutorial.


 Adding Adsense, Search Box or any Gadget Beside Header 

Step 1. Go to Blogger Dashboard
Step 2. Click Template
Step 3. Hit the Edit HTML button
Step 4. Look for the code below

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='YOUR OWN HEADER TITLE/IMAGE' type='Header'/>
</b:section>

 Step 5. Add the following code below right after the code above

<b:section id='header-right' showaddelement='yes'/>
<div style='clear: both;'/>

So, your final code will be: 
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='YOUR OWN HEADER TITLE/IMAGE' type='Header'/>
</b:section>
<b:section id='header-right' showaddelement='yes'/>
<div style='clear: both;'/>
Step 6. We will add css to your existing header  and to the new section that you had just add recently. Copy the code below and paste it above ]]></b:skin>
Step 7. Save your Template.


                                                         Installing the Widget


It is now time to add the widget beside your header (it may be in form of banner, adsense code or any gadgets). Do it as you normally do in putting gadget or widget in your blogger lay -out.




Step 1. Go to Blogger Dashboard
Step 2. Click Lay -out
Step 3. Hit the Add a Gadget button and paste inside it your widget codes.

Note: Drag or place your new gadget below your blog header-title in order to appear it beside the image header by the time you save it.

Step 4.  And finally, click the Save Arrangement button. 


Take Care Friends!



No comments:

Post a Comment

Recent Posts

Related Posts Plugin for WordPress, Blogger...

Definition List