Now to the last section in Part 2 (WordPress Theming Basics) of Jesse Friedman’s book (affiliate link).

The next part will be about advanced WordPress theming, but that’s for another day. Right now we need to look at the main engine that allows us to put up many blog posts without having to make huge files – the loop.

Adding Content

Looking at our index.php, file, we see the following in the static HTML:

<section>
<div>
<article>
<h2><a href=””>This is an Article Title</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nulla nisi, adipiscing eu laoreet vitae, venenatis vitae velit. Phasellus euismod dapibus velit in laoreet. Vivamus ornare justo vehicula felis scelerisque non aliquam nisl semper. Curabitur nisl mauris, posuere sed imperdiet vel, cursus id dolor. Suspendisse varius consequat lorem ac luctus. Maecenas consectetur neque at turpis elementum vitae eleifend sem blandit. Nullam auctor, risus nec porta lacinia, ante sapien bibendum massa, a semper tortor odio in nunc. </p>
</article>
<article>
<h2><a href=””>This is an Article Title</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nulla nisi, adipiscing eu laoreet vitae, venenatis vitae velit. Phasellus euismod dapibus velit in laoreet. Vivamus ornare justo vehicula felis scelerisque non aliquam nisl semper. Curabitur nisl mauris, posuere sed imperdiet vel, cursus id dolor. Suspendisse varius consequat lorem ac luctus. Maecenas consectetur neque at turpis elementum vitae eleifend sem blandit. Nullam auctor, risus nec porta lacinia, ante sapien bibendum massa, a semper tortor odio in nunc. </p>
</article>

And so on and so forth. In the days before PHP, every article would have to be painfully coded in like that. They would be in separate files, not in one huge one like this, but it would still be large and unwieldy to make changes. Every time we added a new blog post, we would need to go in and include it in our file. Not good. Hence – enter The Loop.

The Loop

I’m not going to go into deep detail about how the loop works. In brief, it checks to see if there are any blog posts to display, displays them, and repeats until there are no more left. This is what we call a while loop – do something while the control variable is true.

You’ll notice that the HTML tags for the two articles above (and any others) are the same:

<article>
<h2><a href=” ” title=” “><!–title –></a><h2>
<p><!– content –></p>
</article>

For those not versed in HTML, the above fragment encloses an article, with a second-level (not enormous) header and the anchor (a href=””) for the URL of the article, the title of the article and then the content between two tags that tells us that the content is in paragraph form. Of course the article probably contains images, videos, links and all sorts of things. Just a quick erratum: in the book we have the <h2> tags, in the actual downloaded file it’s <h1>.

Turning Static HTML into a PHP Loop

I’ll put it in first (following Jesse’s example), then explain. Don’t panic.

<?php if  ( have_posts() ) : while ( have_posts() ): the_post(); ?>
<article>
<h2><a href=”<?php the_permalink(); ?>” title=””>This is an Article Title</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nulla nisi, adipiscing eu laoreet vitae, venenatis vitae velit. Phasellus euismod dapibus velit in laoreet. Vivamus ornare justo vehicula felis scelerisque non aliquam nisl semper. Curabitur nisl mauris, posuere sed imperdiet vel, cursus id dolor. Suspendisse varius consequat lorem ac luctus. Maecenas consectetur neque at turpis elementum vitae eleifend sem blandit. Nullam auctor, risus nec porta lacinia, ante sapien bibendum massa, a semper tortor odio in nunc. </p>
</article>
<?php endwhile; else: ?>
<p><?php_e(‘Sorry, no posts matched your criteria.’ ); ?></p>
<?php endif; ?>

Let’s dissect that first line, which contains most of The Loop. It says in plain English:

IF there are posts to show (the function have_posts() returns a non-zero value),

THEN, show the content of the posts (what’s returned by the function the_post()) as long as the function have_posts() is non-zero. Note that instead of coding in the actual URL of the blog post we use a function that finds the permalink instead – that’s the URL that WordPress assigns to your post when it is finished.

ELSE  (if there are no posts to show), inform the reader of that fact and exit. (The php_e() function just echoes whatever is put into it).

In other words, if there are 10 posts to show, the function have_posts() will return the number 10 as its value, and the loop will run 10 times.

The book explains how to use PHP calls to replace the static content as well. I’m not going to repeat that here as you can find it in the book and he explains it better in the next section.

Remember that there is no such thing as a stupid question, only bad explanations that need expanding! Stay with me!