Slimming Down the Front Page

Earlier Posts

I’ve tweaked the Mystique WordPress Theme created by Digital Nature (v2.4.2) quite a bit since I started playing around with it in March 2010. The most obvious difference (other than replacing the menu bar with icons) was the way posts were presented on the front page.

I mucked around with the query_posts functionality until I coaxed it into displaying the most recent post from each category and then the next four most recent posts in a list below that.

However I’m now going to swap over to just the first post and I figured I’d preserve the code here in case I wanted to use it again… or if anyone else wanted to give it a spin.

The base for this code modification is Mystique WordPress Theme created by Digital Nature version 2.4.2.

Always make a copy of the file before you start editing so that you can replace it if something goes wrong!

Although the code would be cleaner if I stepped through the categories, it’s not horrible. Just really slow. (And I don’t know why! Arg.)

Here’s the full thing with a line-by-line explanation of coding after:

      < ?php query_posts('no_found_rows=1&category_name=unquiet-bones&posts_per_page=5'); 

       $first_post_toggle = 1;

       if (have_posts()) {
         while (have_posts()) {
           if ($first_post_toggle == 1) {      
	     the_post();
             mystique_post();
             $first_post_toggle = $first_post_toggle + 1;
           } else {
             if ($first_post_toggle == 2) { ?>
             
Earlier Posts in < ?php $category = get_the_category(); echo $category[0]->cat_name; ?>
    < ?php } $first_post_toggle = $first_post_toggle + 1; the_post(); $title_url = get_post_meta($post->ID, 'title_url', true); ?>
  • < ?php the_title(); ?>
  • < ?php } } ?>
< ?php } ?>

Alrighty, so let’s get into the guts of the code.

First off we pull the most recent 5 posts from the given category using query_posts.

no_found_rows=1 tells it not to try and figure out how many posts there are, which was a suggestion I got from Flavio Tordini’s post on speeding up WordPress get_posts and query_posts functions. Whether it works or not, I’m not sure– since I didn’t see a change in response time. The slow speeds may be more BlueHost than WordPress, but I’m still trying to clean up my code as much as possible.

category_name=unquiet-bones filters the results to the category given. (This is the slug name from the Categories settings page).

posts_per_page=5 this tells it to return 5 posts.

      < ?php query_posts('no_found_rows=1&category_name=unquiet-bones&posts_per_page=5'); 

Now that we have our five most recent posts, it's time to format the output. First we set a variable that will keep track of where we are in the loop:

       $first_post_toggle = 1;

We’re going to be looking for two values here, 1 will mean it’s the first post and should be displayed completely and ‘2’ means it’s the second post and it’s time to start the BLOCKQUOTE and UL list.

I could just assume that there are five posts and start the BLOCKQUOTE as soon as the first post is done, but I’m playing it safe. Right now there’s just a chance of ending up with an extra close for each, which won’t hurt anything.

So, the next two lines a) check to see if there are any posts in the category and b) start looping through the posts.

       if (have_posts()) {
         while (have_posts()) {

The first thing we check is to see if this is the first post, if it is we pull the post information using the_post() and display it using mystique_post() which is in core.php. Once the first post is done, we add one to $first_post_toggle and then go back to the top of the WHILE loop.

           if ($first_post_toggle == 1) {      
	     the_post();
             mystique_post();
             $first_post_toggle = $first_post_toggle + 1;

If it’s not the first post, then we check to see if it’s the second post. If so, we start the BLOCKQUOTE and create the UL header using get_the_category to grab the full category name.

           } else {
             if ($first_post_toggle == 2) { ?>
             
Earlier Posts in < ?php $category = get_the_category(); echo $category[0]->cat_name; ?>
    < ?php }

This next part happens for the second through fifth posts. We add one to $first_post_toggle, then pull the post information using the_post(), but instead of displaying it we just grab the information we need for the list.

             $first_post_toggle = $first_post_toggle + 1;
             the_post();

get_post_meta lets us pull out some of the details about the most. Here we're looking for the title_url which is the URL for the post.

If there is no title_url, we use the the_permalink to get the URL.

The _e function returns the phrase "Permanent Link:" in the local language. I'm not sure if this is really needed or not, nothing I find on Google seems to say if anyone/anyone uses it.

We use the_title to get the post title.

             $title_url = get_post_meta($post->ID, 'title_url', true); ?>
             
  • < ?php the_title(); ?>
  • Once that's done, we just need to close the if ($first_post_toggle == 1), and then close the while (have_posts()) loop, end out the UL and the BLOCKQUOTE and then close the if (have_posts()).

               < ?php }
             } ?>
             

    < ?php } ?>

    Easy as pie, right? 😉

    And for those of you who are interested, I’m swapping to this little bit of code to pop out the most recent post for each catagory:

          < ?php query_posts('no_found_rows=1&category_name=unquiet-bones&posts_per_page=1'); 
    
           if (have_posts()) {
             the_post();
             mystique_post();