LATEST: We are offering PENTESTING and WEB DEVELOPMENT service with low price Learn More

6/17/2013

Add an Ad Space or Gadget Area Beside Blogger Header

But today we gonna learn how to add an ad space or gadget area below blogger header. We can use it for displayind ads and earn some money, we can also use it for displaying or adding any gadget.

Affter adding you will see a new GADGET space like below image:









LETS START! Be carefull wile performing the below steps.
  • Go to Design => Edit HTML [in new blogger interface go to Template => Edit HTML].
  • Then Find the following codes or similar codes. [Press Ctrl+F; then search for it]
#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

  • Now replace the above codes with the code given below. 
#header {
          margin-top:-15px;
          width:370px;
          float:left;
          height: 90px;}
#top-ad {
         width: 470px;
         float: right;
         margin-top: 5px;
         padding: 0;
}

  • Again find the code below. 
<div id='header-wrapper'>
<b:section class='header' id="header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='NAME OF YOUR BLOG (Header)' type='Header'>
</b:widget>
</b:section></div>
 Note: You can only find the <div id='header-wrapper'>  code and the rest will be below that code. 

  • Finally replace it with the code below. 
<div id='header-wrapper'>
<div id='header'>
<b:section class='header' id='blog-title' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='NAME OF YOUR BLOG (Header)' type='Header'/>
</b:section>
</div>

<div id='top-ad'>
<b:section class='top-ad' id='top-ad' showaddelement='yes'>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
</b:section>
</div>
</div>
  • Now save your template
You're all done with adding a gadget area or an ad space beside your blogger header.
Enjoy!!!

About Author:

Hi, Its me Aamir Khan, Owner of HACKING ARTICLES. I am an Ethical Hacker, Pro Blogger, addicted Web Developer and Security Researcher with experience in various aspects of Information Security. I am from Pakistan.Hacking is my passion and i wanna myself to be called as a LEGEND in this field.

Follow him @ Twitter | Facebook


1 comment:

  1. I enjoy most of your articles,the articles are so nice for readers.

    Nersha
    www.gofastek.com

    ReplyDelete

Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.
Note:
1. Make sure to click the "Subscribe By Email" link below the comment to be notified of follow up comments and replies.
2. Please "Do Not Spam" - Spam comments will be deleted immediately upon our review.
3. Please "Do Not Add Links" to the body of your comment as they will not be published.
4. Only "English" comments shall be approved.
5. If you have a problem check first the comments, maybe you will find the solution there.