Header AdSense

If you want to add an adSense block to your header with just a few lines of code then you may find this tutorial is for you, in this tutorial we will insert an adSense block into the header section on all pages except the main page.

Layout Stylesheet

/* Header Ad set the float and margins here */
#cms-header-ad {
display: block;
float:right;
height:60px;
margin-top:30px;
margin-left:0px;
margin-right:20px;
width:468px;
overflow:hidden;
}

There are only four settings we need to change here, float will place the adblock left or right, then you need to set the left or right margin and zero the other one, last is the top margin, header height – 60 and divided by two for ours 125-60 = 65,  65 / 2 =32.50 so we set ours at 30px

The paste this at the end of your style.css file remember to add start and end comments like this /* Start added by cms header  adSense block */

The Header Ad php code

<?php
/* update your ad here between ' ' */
$cmsmyadtext = 'replace with your adSense code here';
$cmsadtext = get_option('cms_banner_ad_text');
if ($cmsadtext != $cmsmyadtext) update_option('cms_banner_ad_text',$cmsmyadtext);
if(get_option('cms_banner_ad_text')){ ?>
<div id="cms-header-ad">
<?php echo stripslashes(get_option('cms_banner_ad_text')); ?>
</div>
<?php } ?>

This code will create and store the adsense code you enter between the single quotes on line 3 in a WordPress option, it will then compare this to what it gets back from the database, if it has been altered it will reset it to what you have in this file, to disable it just blank the text between the single quotes.

The Themes Header File

We now need to call this new file in the themes header file, you will need to know the structure of the header to place the code inside the correct tag, in our header we have placed the code in the art-header-jpg <div>.

<!-- Start CMS-Lite header ad  -->
<?php if (file_exists(TEMPLATEPATH . '/cms_inc/addons/cms-header-ad/cms-header-ad.php')){
    include_once(TEMPLATEPATH . '/cms_inc/addons/cms-header-ad/cms-header-ad.php');
} ?>
<!-- End CMS-Lite header ad  -->

Lets look at this code, the first line is our comment, the next line checks to see if our new file exists, if it exists the third line includes the code in the header, then we end with another comment.

Here is a screenshot with the Artisteer adSense block, I am sure i have seen that website before somewhere, please leave some feedback!

Notice

Code disclaimer information
This document contains programming examples therefore, www.DigitalRaindrops.net grants you a nonexclusive copyright license to use all programming code examples from which you can generate similar function tailored to your own specific needs.

All sample code is provided by www.DigitalRaindrops.net for learning illustrative purposes only.

These examples have not been thoroughly tested under all conditions. www.DigitalRaindrops.net, therefore, cannot guarantee or imply reliability, serviceability, or function of these examples.

All programs contained herein are provided to you “AS IS” without any warranties of any kind. The implied warranties of non-infringement, merchantability and fitness for a particular purpose are expressly disclaimed.

Membership

We hope you will benefit from our tutorials Membership to this website is not required, however the downloading of any themes or files is restricted to site supporters.

You can register for a 10 year ‘Free Account’ from the members page which will give you access to the source files and free themes, as we introduce premium themes and content these will only be downloadable with a subscription, any revenue from subscriptions is used to support the site costs.

this website is a tool to support and promote WordPress and Artisteer, please support, share and give credit for any benefits you gain from the tutorials on this website.

4 thoughts on “Header AdSense

  1. Hi, would you mind putting and image of the end result, or maybe a test siete..

    That way user who quite know what they want can see what the tutorial is about, before going at it blindly.

    Thanks1

  2. Hi, would you mind putting and image of the end result, or maybe a test siete..

    That way user who quite know what they want can see what the tutorial is about, before going at it blindly.

    Thanks1

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Connections

Connect with Us
Follow Digital Raindrops on Twitter Join Digital Raindrops on Facebook
Share

Related Posts

Posted in Tips

colorizer-1_thumb.png

We thought we would use the WordPress Twenty Eleven theme and the the Farbtastic color picker to colorize our theme from the website front page instead of the admin area. We have been looking at the $_SESSION variable, so we thought … Continue reading

Read More