Loop Archives - Untame

WordPress Loop Part 2: Dig Deeper into the Loop With Template Tags

Posted by | Tutorial, WordPress | No Comments

So, you have worked your way through the first part of our series on the WordPress loop! By now, you should have a good understanding of the basic functionality it provides. Let’s dig a bit deeper and find out what we can do to make our custom loop sing.

The Basic Layout:


So, we have the basic loop in place. This loop simply opens the door to new posts using the “if have posts” expression, and closes the door using the “endwhile endif” expressions.

Handy Tags (Bookmark This One):


Template tags are what you can use to alter the way that the loop displays your content. After all, in our original loop, we only tell WordPress that we would like some ice cream (or posts) however, we have yet to say anything about the flavor. That’s where template tags come in. These tags sit within your Wordpress loop markup and serve as custom content calls for anything that WordPress is able to display.

The tags shown above are simplistic in nature, and there are many more of them to understand. However, let’s analyze the tags that we have here. Our “the_title();” tag when set between perhaps a pair of “<h2></h2>” html tags would render out an appropriately sized title for your theme.  Likewise, if you were to place the “the_content” or “excerpt” tags in an area that you had a desire to see post content or a summary respectively, they would fetch that content and place them in your loop.

Note: The majority of template tags do not work outside of the loop.

Tags in action: A Working Loop


Now that we understand how tags work, I would encourage you to start experimenting with the possible combinations. There are tags to fetch just about any post or page related data that you can think of. Let’s take a look at what a full WordPress loop looks like in action.

This loop would fit very well on a “single.php” or even an “index.php” if you wanted to show full length posts. As you can see at the beginning of this block of code, we initiate the loop. Then define an area for our post details, think of it as your meta information section for the post. Within this section we declare the post title, then follow up with a list of meta information including categories, the date on which the post was written and the author. After our meta area, we follow up by displaying our post content.  At the end of the code we clean up shop by ending our while statement, then ending our if statement to complete the loop.


I hope that this article will encourage you to dive into your theme files and play around with the loop. I promise, it is not nearly as scary as you would think. Next we will dive into grabbing posts from a specific category or author. Thank you for reading. If you would like to download our demo code file, click the button below.

Demo Files

What is the WordPress Loop?

Posted by | WordPress | No Comments

The WordPress loop is an essential building block when a web designer or developer begins to better understand how WordPress works and moreover, how they might manipulate a theme to fit the needs of a web site. The loop is a very simple concept to grasp once you understand its necessity. The loop tells WordPress to go get the content that you need. It is that simple, but lets take a stroll through some code to see exactly how it works in practice.

Relax: It’s easier than you think!

In order to get the loop going, we just need to accomplish a few simple tasks.

  • Begin The Loop
  • Do something to display the content we want
  • Close the loop (simple right?)

In order to perform these actions we will need to ask WordPress to play fetch! This is called the “Query”. So in order for us to get the correct content on the correct page the incredible guys and gals at WP ask that we just tell them what we are looking for. So without further ado, lets take a look at some code.

Begin the loop:


[crayon lang=”php”][/crayon]

ask WordPress to play fetch! …

So, in this simple line of PHP we are up to a few things, and it might be easiest to understand if we just look at it like a sentence. This statement first checks if posts exist on our website. Once we have found that there are posts, then we tell WordPress that as long as posts exist, we would like to display those posts.

Do Something About It!

Next, we would tell WordPress exactly what content we would like to be displayed from those posts. For instance, we could include items like our post title <?php the_title(); ?> or maybe our post content <?php the_content(); ?>.

After we have displayed all of our desired information we just need to close up shop (and tidy up a bit). It is always best practice, if not now entirely essential to close the WordPress loop in a clean manner, in case we want to fire up another content loop anywhere else in the page.

So to clean up, we will use the following code to stop our query.


[crayon lang=”php”]

[/crayon]

This snippet of code will essentially end our loop. Lets walk through this code step by step. <?php endwhile;else: ?> allows for us to tell WordPress to stop repeating the content loop of the queried posts. In the middle of that snippet you will find a helpful PHP bit that provides a helpful error message for users, just in case we didn’t have any posts related to our query. This type of message is a huge help in places such as search pages. After close out our cash register by ending our while statement, we simply turn out the lights by ending our “if” statement.

So our full beginners loop might look a lot like this.


[crayon lang=”php”]

Sorry, no posts matched your criteria.


[/crayon]

There! Wasn’t that easy? I hope that this post will make you a little more familiar with how the WordPress loop works. Admittedly, this is an enormously simplistic look at what can be a very involved function. But Hey! We need to start somewhere. Next we will start to take a look at how to eek out some neat loop functionality and eventually code up our own custom blog page.

Helpful Links:

Start planning your project today. Get Started