Main Menu

How to Display Adsense Ads in the WordPress Index Pages for Fresh News by WooThemes – Part 2

This tutorial is continued from Part 1.

Summary of Code Changes to index.php

The index.php file is the theme template that displays the Featured Posts and Post Summaries (Excerpts) to paint the body of the Front Page and Index Pages. Source code logic is added to index.php to display the Google Adsense Ads at the appropriate position in the summaries and only once per page to stay within the maximum of 3 ads per web page.

First, a new variable is created to ensure the Adsense Ads are display only once per page at line 27:

<?php $BannerAdsDisplayed = FALSE; ?> <!-- Boolean to show featured banner ads only once. -->

The main code for the Featured Banner Ads – this is how I described the new feature in the php comments – is on lines 61 to 99:

           <!-- Featured Banner Ads 250px x 250px -->
           <?php if (($BannerAdsDisplayed == FALSE &amp;&amp; !$is_paged) || /* show on main page after featured posts */
                     ($is_paged &amp;&amp; $postcount == 3)) /* show after the 3rd post on index pages 2 and greater */
           { ?>
           <?php   $BannerAdsDisplayed = TRUE; ?>
              <div class=&quot;box&quot;>
                 <div id=&quot;featured_ads&quot;>
                    <div id=&quot;banner_ad_left&quot;>
                       <script type=&quot;text/javascript&quot;><!--
                           google_ad_client = &quot;pub-2484226848394294&quot;;
                           /* 250x250, created 6/10/08 */
                           google_ad_slot = &quot;8646292631&quot;;
                           google_ad_width = 250;
                           google_ad_height = 250;
                           //-->
                       </script>
                       <script type=&quot;text/javascript&quot;
                           src=&quot;http://pagead2.googlesyndication.com/pagead/show_ads.js&quot;>
                       </script>
                    </div>
                    <div id=&quot;banner_ad_right&quot;>
                       <script type=&quot;text/javascript&quot;><!--
                           google_ad_client = &quot;pub-2484226848394294&quot;;
                           /* 250x250, created 6/10/08 */
                           google_ad_slot = &quot;8646292631&quot;;
                           google_ad_width = 250;
                           google_ad_height = 250;
                           //-->
                       </script>
                       <script type=&quot;text/javascript&quot;
                           src=&quot;http://pagead2.googlesyndication.com/pagead/show_ads.js&quot;>
                       </script>
                    </div>
                 </div> <!-- featured ads -->
              </div> <!--/box -->
           <?php
           } ?>	<!-- if($BannerAdsDisplayed...) -->

           <!-- Featured Banner Ads Ends -->

Disable the Post Date Display

I’ve disabled the post date display on all my posts purely as a matter of personal preference - see lines 38 to 42 and 106 to 110. If you want the post date to be shown as usual, simply uncomment these lines. Either way, this change is unrelated to the Google Adsense enhancements and has no impact on the Ad display logic.

<?php
/************* suppress the date display on posts
<p class=&quot;fl&quot;><?php the_time('j. F Y'); ?></p>
*/
?>

and

<?php
/************* suppress the date display on posts
<p class=&quot;fl&quot;><?php the_time('j. F Y'); ?></p>
*/
?>

Now let’s make the changes to index.php.

Edit index.php

If you haven’t already made a backup of your WordPress database, please do so now. If you make an error in the edits to index.php it can possibly make your blog unreadable.

The following instructions assumes you’ve not made any customizations to index.php and you’re using Fresh News v2.0.7. If you’re using a different version or have made other customizations, you’ll need to “stare and compare” and merge the Adsense code enhancements using your judgment.

  • Log in to your WordPress Admin Panel.
  • Open the Theme Editor at AppearanceEditor in the left navigation menu.
  • Open the Main Index Template file index.php by clicking on it in the right menu.
  • Right click in the editor and choose Select All.
  • Right click and choose Cut. The content of the Theme Editor is now empty.
  • Open Notepad or your favorite text editor and paste the contents of index.php into notepad. Now save this original copy of index.php to your local computer just in case you need to recover the original version (this will be quicker than restoring the site backup.) Alternately, use File Manager in cPanel and/or save a copy using FTP.
Theme Editor - Main Index Template: index.php

Theme Editor - Main Index Template: index.php

  • The full source code for the Adsense enhancements is here: index.php
  • Paste the upgraded index.php code into the Theme Editor.
  • Replace my Adsense 250×250 code unit with your Adsense code on lines 69 to 79 and 82 to 92 as highlighted:
           <?php   $BannerAdsDisplayed = TRUE; ?>
              <div class=&quot;box&quot;>
                 <div id=&quot;featured_ads&quot;>
                    <div id=&quot;banner_ad_left&quot;>
                       <script type=&quot;text/javascript&quot;><!--
                           google_ad_client = &quot;pub-2484226848394294&quot;;
                           /* 250x250, created 6/10/08 */
                           google_ad_slot = &quot;8646292631&quot;;
                           google_ad_width = 250;
                           google_ad_height = 250;
                           //-->
                       </script>
                       <script type=&quot;text/javascript&quot;
                           src=&quot;http://pagead2.googlesyndication.com/pagead/show_ads.js&quot;>
                       </script>
                    </div>
                    <div id=&quot;banner_ad_right&quot;>
                       <script type=&quot;text/javascript&quot;><!--
                           google_ad_client = &quot;pub-2484226848394294&quot;;
                           /* 250x250, created 6/10/08 */
                           google_ad_slot = &quot;8646292631&quot;;
                           google_ad_width = 250;
                           google_ad_height = 250;
                           //-->
                       </script>
                       <script type=&quot;text/javascript&quot;
                           src=&quot;http://pagead2.googlesyndication.com/pagead/show_ads.js&quot;>
                       </script>
                    </div>
                 </div> <!-- featured ads -->
              </div> <!--/box -->
  • Click “Update File” to save.

Test the Adsense Upgrade to Front Page and Index Pages

In a new web browser window, open your web site and confirm the two Google Adsense Ads are displayed after the Featured Posts on the Front Page, and after the 2nd post summary on the following Index Pages.

If something doesn’t look right, just paste the original source code back into index.php and save to restore the original look and feel.

Track the Performance of the new 250×250 Page Ads

If you’re interested to know how well the new Adsense Ads are performing, log in to your Adsense Account and create a custom channel to track the performance of the new ad units.

Hope this helps,

Bob Jackson

[ad#468x15 Link Unit Post End]

Be Sociable, Share!

Copyright © 2013 HandymanHowTo.com   Reproduction strictly prohibited.

, , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ,

Trackbacks/Pingbacks

  1. How to Display Adsense Ads in the Wordpress Index Pages for Fresh News by WooThemes - Part 1 | HandymanHowto.com - September 20, 2009

    [...] This tutorial is continued in Part 2. [...]

Leave a Reply