WordPress Tip: Offsetting Posts

  • Posted On: July 25th, 2006
  • Filed Under: WordPress
  • Tagged As:

Visual Quickstart Guide to WordPress 2 at Amazon.comWhen I first started doing my own WordPress themes, and specifically started including AdSense code, I wanted to offset my posts to mix things up a bit. Here on bill2me.com's frontpage you can see an example in the Flickr code included between the two posts on the page.

While offsetting posts can provide some interesting options for inserting special elements, entrepreneurial bloggers will also note that the space between posts can be good for placing ads. Of course the problem here is that you can't JUST place the code into the WordPress loop - because it'll force the code to repeat every time the loop iterates. (This can result in too many occurrences of your AdSense code on a single page and be problematic when considering the AdSense TOS.)

With a little modification though you can get things working.

Understanding the Loop

One nice thing about the WordPress loop is that you can put your own PHP code inside it to achieve some neat effects. For the purposes of setting up special events in the loop sequence (like inserting AdSense code or other elements) we can use this to our advantage.

To start, note how many posts are appearing on the page you want to add special code to. Here we're looking at the "index.php" file in the theme. Unless you've got special code controlling the loop - you can adjust this in the WordPress Admin section under "Options -> Reading -> Show at Most." This is important because we need to know between which posts we want to insert the code.

Here - we're putting it between the first and second.

The Concept and Execution

The easiest way I've found to do this is just to count the posts out and add the code when needed. This is accomplished by setting up a small codeblock which increments with each post iteration. I recommend putting it directly under the opening lines of the loop. The codeblock looks something like this.

Ex. 1
<?php if ($count == null) {
$count = 0;
$count++; //increments the variable by 1
} ?>

The above code is the first part - it sets a variable that increments over the course of the loop. Next we need a test to see where in the loop we are. Because we're going between the first and second iteration - we want to insert the code BEFORE the second post. This is best accomplished after the second loop iteration starts but before the post is displayed. Under the above code we'll add the following:

Ex. 2
<?php if (count == 2) { ?>
//AdSense Code Goes Here
<?php } ?>

If you want - you can repeat this code block testing for any places you'd like to add the code.

Other Uses

As I noted, I used to use this on my "index.php" file to insert the flickr badge, I'll be adding it to the category page to include AdSense code though. There are however plenty of other options - if you want you can place AdSense Referral banners between posts or even Amazon links. Just get creative and adapt the above code as you'd like.


Leave a Reply