I hope my lovely, intelligent readers do not mind the two new ad panels (at the bottom of individual posts and in the sidebar); RSS readers should not notice any changes. This was a fun technical project that may make me a dollar over about twenty years :)

Here’s how I added ads to the sidebar and the end of single posts in my WordPress blog. You may be able to do it easily with a plugin, such as one of the ten featured in this article, but I chose to do it manually to learn more.

For ease, I used two tabs. In one tab I generated ads and another tab was used to edit pages.

Generating Ads. Google makes it easy with AdSense. You can see your options for ads here. First, sign up for AdSense then enter the AdSense Setup page, the Get Ads tab. Both my units are AdSense for Content; one Ad Unit and one Link Unit. After choosing the options I wanted, I was given sample code. I copied this code and switched to the other tab.

Editing Pages. First, get to the Theme Editor:

  • Log into the administrative panel.
  • Click the Design tab
  • Click the Theme Editor

I put the banner ad at the bottom of the single post. To do so I copied the generated code then performed these steps:

  • Selected Single Post (single.php)
  • Pasted the following code above the line “<?php get_footer(); ?>”:
<!--- Ad support. Added by Seth Holloway on Jan 9, 2009 ---> <div id="ads"> <script type="text/javascript"><!-- google_ad_client = "pub-2003017988956692"; /* 728x90, created 1/8/09 */ google_ad_slot = "5798236936"; google_ad_width = 728; google_ad_height = 90; //--> </script> <script type="text/javascript" src="https://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> </div>

For the sake of looks, I then needed to edit the stylesheet in the following manner:

  • Selected the Stylesheet (style.css)
  • Added this to the code:
/* Ad support. Added by Seth Holloway on Jan 9, 2009 */ #ads { text-align: center; }

I then generated the sidebar link unit, copied the code, and followed these steps:

  • Selected the Sidebar (sidebar.php)
  • Pasted the generated ad unit to the code above the final “</ul>”:
<!--- Ad support. Added by Seth Holloway on Jan 9, 2009 ---> <li> <script type="text/javascript"><!-- google_ad_client = "pub-2003017988956692"; /* 120x90, created 1/8/09 */ google_ad_slot = "2887058896"; google_ad_width = 120; google_ad_height = 90; //--> </script> <script type="text/javascript" src="https://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> </li>

And voila! We now have two unobtrusive ads on sethholloway.com.

Later, I would like improve the relevance of the ads and to add Digg, Reddit, and Sharethis buttons.

Any tips for items missing from the blog? Did you notice the ads? Do you hate them?