How to: Move the header widget down in Graphene to place your Ads closer to the post

How to: Move the header widget down in Graphene to place your Ads closer to the post

If you’ve visited our site before you might remember how our Google Add for the header was all the way up overlapping the good old banner. If not then you are like most users; Advertising that is not close to the content gets lost, specially if it is above the header. This is why Google has recommended to: Move your ad unit below the header.

What’s the issue with ads at the very top of the page?

Ads placed above the header are often hidden, and accordingly have lower CTRs than ads further down the page. Move ads at the top of your page down and you could earn more.

So keeping that in mind and to please Google (who after all just cares the site getting more clicks so they make more money) I looked into improving the Graphene Theme for WordPress. The problem is that Graphene’s point of view is that the header widget should be place… at the header obviously. But if you are trying to place advertising on the top of your post via widgets this presents a challenge. Regardless of how you look at it, editing the code behind is necessary (and if it is not please correct me!) The options include:

1. Create a new Widget Area for your advertising
2. Find a plugin that could insert that advertising in for you
3. Move the header widget to a more friendly area.

On this post we will focus on option number 3: Moving the existing widget area to another location that should work better than the current one. For this you need to edit the header.php file of the theme. You could do this via a number of ways: Your WordPress admin site, FTP into your web host, or if you have a VPN just log in and edit the file. The key here is to move the Header Widget Area code which is shown below:

<?php /* Header widget area */
if ( $graphene_settings[‘enable_header_widget’] && is_active_sidebar( ‘header-widget-area’ ) ) {
echo ‘<div>’;
dynamic_sidebar( ‘header-widget-area’ );
echo ‘</div>’;
}
?>

Once you find this section of the code, you are going to cut and paste it so go ahead and cut the text. Now you need to find the area were you need to paste this code. Below are the two lines you need to find were you will paste this code inbetween them as shown here:

<div id=”content-main” <?php graphene_grid( ‘clearfix’, 16, 11, 8 ); ?>>

<?php /* Header widget area */
if ( $graphene_settings[‘enable_header_widget’] && is_active_sidebar( ‘header-widget-area’ ) ) {
echo ‘<div class=”header-widget”>’;
dynamic_sidebar( ‘header-widget-area’ );
echo ‘</div>’;
}
?>

<?php do_action( ‘graphene_top_content’ ); ?>

Once you have done this, you will notice that your widget area no longer resides at the header but now below it somewhere between your navigation and your posts. This makes it so that your ad doesn’t get lost as easily. Also, if you were as lazy as I was your ad was overlapping your banner making it look hideous and out of place… much better now!

NOTE:

Every time there is a new update to the theme you are going to have to make this change. With that regards the simplest solution might just be to find a plugin to insert that advertising unit above the post. I haven’t found a great one so I am sticking to making this change every update.