Anatomy of a Magazine Style Premium WordPress Theme – Part 1 “The Loop”

In this example, this loop generates a post from the chosen category “Featured” and only one post is displayed, you can change this setting in line 3 (’category_name=Featured&showposts=1′) by changing the showposts=1 to the number of posts you want displayed. In line 10, the first loop terminates with the endwhile; tag.

The second loop starts in line 11 and ends in line 18, this loop generates regular posts in chronological order (with the exception of the featured post displayed earlier). We have now defined everything needed to create the loops for the home page (page 1), but we are only half way through.

At this point, most themes have the option for pagination or other functions built-in to navigate to previous posts. To define how those posts will be presented in paged pages (2, 3,.. and so on) we’ll add an “else” tag to close the “if” < 2 page tag (in line 19) and start our third and final loop code in line 20. Essentially the rest of the code is standard flair.

Also note that only the featured category will display full posts (line 07), the regular posts will only display excerpts (lines 15 and 24).

My content is best served chronologically. However I need to be able to make a subtle distinction between regular posts and featured posts. How can I do that?

The alternative to the aforementioned technique is to add some conditional tags and styling within the loop to separate posts based on its importance. An example of one such loop can be seen on this very site, note how the featured posts are presented in full length while the regular posts are shown as excerpts although the flow of posts are still chronological. The loop code (as included in the index.php) is as follows:

1. <?php get_header(); ?>
2. <?php while(have_posts()) : the_post(); ?>
3. <div class=”post” id=”post-<?php the_ID(); ?>”>
4. <h1><a href=”<?php the_permalink(); ?>” title=”<?php the_title(); ?>” rel=”bookmark”><?php the_title(); ?></a></h1>
5. <div class=”meta”>Posted on <?php the_time(’F jS, Y’) ?> under <?php the_category(’, ‘) ?> <?php if (function_exists(’the_tags’)) { ?><?php the_tags(”, ‘, ‘, ”); ?><?php } ?></div>
6. <?php if (in_category(#)) : ?>
7. <?php the_content(’Read the rest of this entry »’); ?>
8. <?php else : ?>
9. <?php the_excerpt (’Read the rest of this entry »’); ?>
10. <?php endif; ?>
11. <div class=”meta”>Published by <?php the_author() ?> // <?php comments_popup_link(’Comment now »’, ‘1 Comment »’, ‘% Comments »’, ‘commentslink’); ?></div>
12. <?php endwhile; ?>
13. <?php get_sidebar(); ?>
14. <?php get_footer(); ?>

Again, you could download a copy of this file in text format or view the demo. Note in line 6, the # sign in (in_category(#)) must be replaced by the category number of the post you want to make the “featured” category.

01.11.2008 - 1:31 pm - Design, How to, Resources, Techniques, Tips - 1,532 views -