Display Adsense Ads Below Nav Bar in TechMaish WordPress Theme


Displaying adsense ads below navigation bar in TechMaish Theme or any other wordpress theme is very simple. You need to edit 2 files, No.1 Header.php and Style.css and add a code to accomplish it.

As a example just look at to the screen shot, so that you can know that how the adsense 728×15 link unit will look on TechMaish theme.

Previous article: Insert Adsense inside Post

techmaish nav bar ads Display Adsense Ads Below Nav Bar in TechMaish WordPress Theme

How to Display Adsense Ad Below Nav Bar?

1st Step

1. Go to Dashboard>Appearance>Editor

2. Click on Header.php file and scroll down to the bottom of the code.

Paste the below code in the middle of “<div><!–end of #header–>” and <div id=”main”> code. Copy this code but make sure to replace the adsense code with your own adsense code.

Don’t copy the Red portion, copy only the blue portion and replace the adsense code with your own code.

</div> <!– end of #header –>
<div id=”adsenseads”>
<script type=”text/javascript”><!–
google_ad_client = “pub-xxxxxxxxxxxxx”;
/* 728×15, created 6/21/10 */
google_ad_slot = “xxxxxxxxx”;
google_ad_width = 728;
google_ad_height = 15;
//–>
</script>
<script type=”text/javascript”
src=”http://pagead2.googlesyndication.com/pagead/show_ads.js”>
</script>

</div>

<div id=”main”>

Save the file.

2nd Step

Now Open style.css file and paste the below code at the bottom of the page.

#adsenseads {
background:none repeat scroll 0 0 #555555;
height:20px;
margin:0 auto;
padding:5px 0 0 0;
width:968px;
}

Save the file and visit your blog, you will see the 728×15 link unit added just below the Nav Bar.

If you have any question about TechMaish theme, or need any feature then feel free to post in comment. Soon i will be launching another version of TechMaish Theme, where lots of features will be added. So keep visiting for the next update or Subscribe to our RSS Feed to get updates in mail box.


22 comments… add one

  • sanjeev

    Hello Bilal, Thanks such wonderful theme. I want your help in some customize task.
    1. How to make style like your POPULAR POSTS widget i.e background color of link?
    2. How to change fonts of allover body of theme?
    3. How to change the color of Sidebar title Background?

    Please Sir, Response these.

    • Sanjeev@ I will try to include all the features in the Next Version of TechMaish. Thank you for liking the theme.

    • Go to your style.css or corresponding file ,you will see a body {} tag.
      whatever is inside the body tag is “attribute of the body”, meaning it will be assigned to everything that falls under the section in your theme. you can change font color,font size and the font itself here, you can also change the hover color.
      If you further study your CSS file you will find attributes for links and separate sidebar.php file depending on your theme structure, you can very much edit everything from there. Find a good color to hex converter on the web and assign it as attribtes, it will do the trick.

  • sanjeev

    Bilal, When u launching new version?
    I want to launch my new blog with features very soon.

  • @bilal – nice post, you can also accomplish this by using the inherent WP shortcodes. just have to make a new function in the function.php file and then add this line to the code (functio name, shortcode name);
    then whenever you use [shortcode name] in your theme it will give a call to the php function which is ,in this case our adsense ads.

  • Bibin

    How to increase height in the Third section .I add the code and adsense shows fine. But i want to increase the height header navigation section which includes adsense

    • Bibn@ The Height and Length code is highlighted in the Style.css file code. Just increase its size. For example height:40px; and width:1200px;

  • Rohan@ Yes this method can also be used. Thanks for sharing this one.

  • Bibin

    Will u please specify the correct line. Iam using Tech Maish worrdpress. Plz specify the line, because iam a new man in wordpress

  • how to add adsense link units 728×15 in header navigation bar in blogger.com

  • Hi, it was a great help! I could use this code on my “FreshLife” theme also and it works perfectly
    Thanks mate

  • Good stuff bro. Could you provide the tut for all wordpress theme?

  • Hi. Good info. I did follow it but ran in to a problem. To the right of the link ad, it was white – how do I change that.

    I tried it with the leader board ad and adjusted the height but i that case, the navigational bar showed and it looked weird.

    Thanks for any help

  • Thanks Bilal but i want to ask that my ad is displaying/alligned on the left side of the screen/theme . how to get it into the centre/middle….Please help….

  • Bro your theme is supereb!
    i just downloaded it!
    thanks

  • Thanks for the tutorial Bilal!! Very simple but accurate!

  • hello sir when i put this code in style css
    #adsenseads {
    background:none repeat scroll 0 0 #555555;
    height:20px;
    margin:0 auto;
    padding:5px 0 0 0;
    width:968px;
    }

    i get error in padding: 5px 0 0;
    Using Height with padding can some time make elements larger that you expect plz help me

  • how can i make posts to slide on my home page?Please tell me.

  • Hello,, I want to know about how to place an ads just below the header or menu and above all the posts

  • Bilal, Thanks for your help to bloggers community. Please inform how can I ad 468×60 Ad code on home page (between the summary posts)

Leave a Comment