How To Add A Banner In Your WordPress Header

Banner Ads is one of the most popular format for advertisers and publishers alike. That’s because banner ads often occupies the best piece of a blog’s real estate, that is the blog header or on the top of the contents. These areas are the most visible to anyone visiting the blog and those who have a huge readership base charges the most for any banners placed in these places.

Adsense gurus have stated many times that banner ads in the header is not as good a click converter as the large rectangle Ads inside the top portion of the blog post. It is something I agree to, but if you sell ad space, that is the golden area. People who buys Advertisement wants the most visible part of a blog and hence banner ads in the header will fetch a higher price.

To place a banner in your header, you will need to have a header wide enough to accommodate the banner. So if you intend to place a 728 X 90 pixel banner, make sure your header is wide and big enough for that. Also you must take into consideration your header logo and make provisions for that to be displayed fully with the banner.

As always we start with adding a new selector or a div as I like to call it because it is less confusing for noobs. You just need to set the attributes to float the banner and set the margins to align the banner properly. You can omit declaring the width and height as this would allow you to add banners of any size. A simple example will look like this.

.ads {float: right; margin-top: 40px; margin-right: 10px; }

You can of course set your own preferences like floating to the left or have different margins.

Next, go to your header php file and look for the div id of your header image. It will normally looks something similar to this. <div id="header">. If you cannot decide which is which, then go back to your stylesheet and look for the css codes that has your header’s image or logo set as background. That particular selector will be the div id that you are looking for.

Now that you have found it, you MUST insert the banner codes within that id, which means it should be before the closing div tag. If you place it outside the closing tag, you banner will either not appear or if it do, it will not be inside your header. Like for example if your div id is ‘header’, you will have something like this.

<div id="header"> Your header id
<div class="ads">Your new div class that you have created just now must be within this id.
All your banner ad codes here
</div> Closes the div id
</div> Closes the div class

Of course there will be many more lines inside your header php, that’s just a rough guide. As long as you do not delete anything and remember to close your class tags, everything should be okay. In cases where you see the banner not siting properly, you can always go back to your style sheet to re-write the margin spacings. It is a trial and error thing.