Chapter 2
45
How it works
Again, the semantic markup output by the wp_list_pages function is the real star here.
The Supersh JavaScript takes the nested lists generated by WordPress and transforms them
into easy-to-use and efcient drop-down menus. The internals of the Supersh JavaScript
is beyond the scope of this recipe, but the basic idea is that it uses hover events on the
hierarchical list items to make the drop-downs work appropriately.
See also
Creating a category drop-down menu
3
The Loop
In this chapter, we will cover:
Creating a basic Loop
Displaying ads after every third post
Removing posts in a particular category
Removing posts with a particular tag
Highlighting sticky posts
Creating multiple loops in a single template
Displaying only posts in a particular category
Styling every other post differently
Styling posts in a particular category differently
Showing every post in a category on a category archive page
Introduction
The Loop is the basic building block of WordPress template les. You'll use The Loop when
displaying posts and pages, both when you're showing multiple items or a single one. Inside
of The Loop you use WordPress' template tags to render information in whatever manner your
design requires.
WordPress provides the data required for a default Loop on every single page load. In addition,
you're able to create your own custom Loops that display post and page information that you
<?php
}
}
?>
Using the WordPress theme test data with the above Loop construct, you end up with
something that looks similar to the example shown in following screenshot:
Chapter 3
49
Depending on your theme's styles, this output could obviously look very different. However,
the important thing to note is that you've used The Loop to iterate over available data from the
system and then display pieces of that data to the user in the way that you want to. From here,
you can use a wide variety of template tags in order to display different information depending
on the specic requirements of your theme.
How it works
A deep understanding of The Loop is paramount to becoming a great WordPress designer and
developer, so you should understand each of the items in the above code snippet fairly well.
First, you should recognize that this is just a standard while loop with a surrounding if
conditional. There are some special WordPress functions that are used in these two items, but
if you've done any PHP programming at all, you should be intimately familiar with the syntax
here. If you haven't experienced programming in PHP, then you might want to check out the
syntax rules for if and while constructs at and />while
, respectively.
The next thing to understand about this generic loop is that it depends directly on the global
$wp_query object. $wp_query is created when the request is parsed, request variables are
found, and WordPress gures out the posts that should be displayed for the URL that a visitor
has arrived from. $wp_query is an instance of the WP_Query object, and the have_posts
and the_post functions delegate to methods on that object.
The $wp_query object holds information about the posts to be displayed and the type of
page being displayed (normal listing, category archive, date archive, and so on). When
have_posts is called in the if conditional above, the $wp_query object determines
while( have_posts() ) {
$ad_counter++;
the_post();
?>
<h2><?php the_title(); ?></h2>
<?php
// Display ads
$ad_counter = $ad_counter % $after_every;
if( 0 == $ad_counter ) {
echo '<h2 style="color:red;">Advertisement</h2>';
}
}
}
?>
Chapter 3
51
If you've done everything correctly, and are using the WordPress theme test data, you should
see something similar to the example shown in the following screenshot:
Obviously, the power here comes when you mix in paying ads or images that link to products
that you're promoting. Instead of a simple heading element for the Advertisement text, you
could dynamically insert JavaScript or Flash elements that pull in advertisements for you.
How it works
As with the basic Loop, this code snippet iterates over all available posts. In this recipe, however,
a counter variable is declared that counts the number of posts that have been iterated over.
Every time that a post is about to be displayed, the counter is incremented to track that another
post has been rendered. After every third post, the advertisement code is displayed because the
value of the $ad_counter variable is equal to 0.
It is very important to put the conditional check and display code after the post has been
displayed. Also, notice that the $ad_counter variable will never be greater than 3
}
How it works
In the above code snippet, you are excluding the category with the name Category Name. To
exclude a different category, change the Category Name string to the name of the category
you wish to remove from loops.
Chapter 3
53
You are ltering the WP_Query object that drives every Loop. Before any posts are fetched
from the database, you dynamically change the value of the category__not_in variable in
the WP_Query object. You append an additional category ID to the existing array of excluded
category IDs to ensure that you're not undoing work of some other developer. Alternatively,
if the category__not_in variable is not an array, you assign it an array with a single item.
Every category ID in the category__not_in array will be excluded from The Loop, because
when the WP_Query object eventually makes a request to the database, it structures
the query such that no posts contained in any of the categories identied in the
category__not_in variable are fetched.
Please note that the denoted category will be excluded by default from all Loops that you
create in your theme. If you want to display posts from the category that you've marked to
exclude, then you need to set the
suppress_filters parameter to true when querying
for posts, as follows:
query_posts(
array(
'cat'=>get_cat_ID('Category Name'),
'suppress_filters'=>true
)
);
Removing posts with a particular tag
Similar to categories, it could be desirable to remove posts with a certain tag from The Loop.
You may wish to do this if you are tagging certain posts as asides, or if you are saving posts
be excluded from WordPress Loops.
Please note that the chosen tag will be excluded, by default, from all Loops that you create in
your theme. If you want to display posts from the tag that you've marked to exclude, then you
need to set the suppress_filters parameter to true when querying for posts, as follows:
query_posts(
array(
'tag'=>get_term_by('name','tag1','post_tag')->term_id,
'suppress_filters'=>true
)
);
Highlighting sticky posts
Sticky posts are a feature added in version 2.7 of WordPress and can be used for a variety of
purposes. The most frequent use is to mark posts that should be "featured" for an extended
period of time. These posts often contain important information or highlight things (like a
product announcement) that the blog author wants to display in a prominent position for a
long period of time.
How to do it
First, place your cursor inside of a Loop where you're displaying posts and want to single out
your sticky content. Inside The Loop, after a call to the_post, insert the following code:
<?php
if(is_sticky()) {
?>