Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
FREELessons:11Length:1.2 hours

Next lesson playing in 5 seconds

  • Overview
  • Transcript

2.1 The Loop in Action

In this lesson, I’ll give you an overview of the ways in which The Loop is used and examples of it in different page templates.

Related Links

2.1 The Loop in Action

Hello, and welcome back to this tuts+ course on working with the WordPress Loop. In this part of the course, I'm gonna show you the loop in action, and I'm gonna what does in WordPress to display your content. So here is the site that I'll be using to demonstrate all the techniques through this course. And here we have the home page, which is a static page in the site. Now, the template file that, that uses is defined by the WordPress template hierarchy. And for every type of content, you can work through this and identify which template in your theme the page will be using. Now, in my case, my homepage is a static page. So here's the site frontpage. If I've got a frontpage.php, it will use that. I don't have one, so then it goes to either a page being shown on the front or posts being shown on the front. And I've got a page, so it goes up to the page template. We'll use a custom template if there is one. If not, the default template. Page with a slug or an ID for this particular page, or the template file I'll be using in this course, which is page.php. Now, if there isn't a page.php, it then falls back to singular.php which can be used for pages or posts. And then finally, as along with every content type, to index.php. And that's why every WordPress theme has to have an index.php file even if it has no other template files. But you'll find that you generally need more than just the one. So let's take a look at my page.php file. Here I've got two loops which I'll be developing during this course. The main one is here. And that's called in using an include file. So I'm including the main loop in a separate file, and the reason I do that is to make things more efficient. Let's take a look at that file. So this is my loop for single files, and that includes posts and pages. And I'll go through the code in there in detail with you in the next part of the course. But as you can see from my page, I'm including that loop. If it defaulted to the index file, it would include the generic loop file, loop.php. And that looks quite similar, but again I'll be adding some custom content during this course, and I'll show you how that works in the next part of the course. So let's take a look at an archive page. So if I scroll down, I can see my tags and I've got the child themes archive. So these are all the posts I've written on this website with the tag of child themes. And this is an archive page. So using the WordPress template hierarchy, we're on an archive page for tags, it'll use a slug or an ID if there is one for that particular tab, which it isn't. Then it'll use tag.php if there is one, in my theme there isn't. It'll fall back then to archive.php or index.php. Now, in my theme, I've got an archive.php file, and that has some custom code here with the heading, and then again uses this get_template_part function. And you'll see get_template_part function a lot in theme template files calling that loop file. So you can see it's calling the generic loop file. So the get_template_part file is very useful because you can use it to call one or one of a variety of loop include files that you created in your theme. So you'll see I've got three loops in my theme. I've got the main loop, I've got loop-single and I've got loop-project. And that loop-project is for the project post type that I'll be using later on in this course. loop-single is for single posts and pages. And the way we call that loop-single is, again, by using get_template_part('includesloop', and then adding a second parameter of single. And the reason we use that second parameter is that if that loop-single file doesn't exist, WordPress will fall back to the loop.php file. It will fall back to this. So that's better than just doing includes/loop-single, which would work, but wouldn't be as thorough. So in most well-coded themes, you will keep the loop in a separate include file, or in more than one separate include files, and then you'll code those in all your template files. And the template file being used will depend on the theme template hierarchy, which we've just gone through. And the loop being used will depend on that template file and which loop file it's going. If you wanted to, you could not create these include files at all, and you could code the loop directly into your template file. So for example here in index.php, I could replace this with an actual loop. Now, the disadvantage of that is that I have to code the loop every single time I create a new template file if I do that. Instead of creating it just once or twice, or in this case three times. So I've got five template files in this theme. Archive, index, page, single-tutsplus_project and single. But I've only got three loops files, and I could create more templates files if I wanted to, just using those loop files. So I might, for example, create a tag.php file just for displaying tag archives. And I could then get that to just go to loop.php because that's being used by my main archive.php file. Or I could create a custom page template file that I can select in the admin screens and just use loop-single.php for it. So creating these include files makes you more efficient as a coder. And it also makes it easier to go into your code and edit it in the future because you only need to do it once for each of these three loops, instead of once for each of these five or more template files. So going back to my page, the loop works slightly differently on an archive page and on a single page or post. So in an archive you can see, here we're showing two tags. On my blog we're showing up to ten on each page. And the loop loops through them again, and again, and again, until it gets to a point where there are no posts left. So that's how it can display multiple posts. On a single post or page, again, it will keep looping through again, and again, and again. But because the main query relating to that post or page, which WordPress runs automatically depending on what content you're looking at, and it returns one post or page, it'll only display that one post or page. So WordPress has something called the main query which automatically goes off and finds the right content for you depending on what page on your site you're looking at. And then it uses the template files to populate that content. Most of it goes on behind the scenes and is part of what I love about WordPress. So that's an introduction to how the loop works on your site, and how it outputs content. In the next part of the course I'll walk you through the code in the loop, and show you what each bit of it does. See you next time, and thanks for watching.

Back to the top