Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.
Start a free Basic trial
to watch this video
In this video we look at how to control category archive pages in WordPress using the category.php file.
-
0:00
Now we're going to take a look at a Category archive.
-
0:04
Unlike Date archive, Category archives can be a little bit more specific.
-
0:09
We have the Generic Category archive and then we have the ability, like, with pages
-
0:15
to create a specific template based on an ID or a slug of a given category.
-
0:23
First we have to make sure that we have our Categories set up properly.
-
0:27
So, let's come under Posts, Categories and
-
0:30
then see that we have a couple different categories available.
-
0:35
I'm going to Delete, Update and Edit my uncategorized and call this Updates.
-
0:47
So, I now have a few categories.
-
0:49
I have my Special category.
-
0:50
I have my Travel category, and I have my Updates category.
-
0:56
And I can see that I have two posts in this.
-
0:58
And I wanna spread these out so that they're all covered.
-
1:03
So I'll come under my Posts.
-
1:05
Quick Edit.
-
1:07
Update that one that way.
-
1:09
And Update this one this way.
-
1:12
So now when I come on to my site, and on my blog I have Categories listed here, I
-
1:18
could then begin to click through each of these and see these templates in action.
-
1:27
So, let's take a look at the first one.
-
1:28
When I click on Updates, I see this is a category archive, Updates at the top,
-
1:34
and then the blog listings below it.
-
1:37
So if we come into the category.php file we could see that this is
-
1:42
whats controlling this archive page.
-
1:45
However, we can get more specific here.
-
1:48
For example, let's click into Travel.
-
1:50
And you'll notice that we now have a customized header that
-
1:54
appears across the top.
-
1:56
Again, if we click on Updates, we see this.
-
1:59
Click on Travel, and we see this.
-
2:02
Notice we have different styling here.
-
2:04
Different content here and
-
2:06
then down below we even have a different loop with different data displaying there.
-
2:12
How are we doing this one?
-
2:14
Well. [BLANK_AUDIO]
-
2:18
If we come back into our categories,
-
2:21
we can see that our Travel category is tagged with the ID of four.
-
2:26
And one of the easiest ways to find that out is to go into Categories, click on it,
-
2:31
and then see Tag ID equal to four in the URL.
-
2:36
What this allows us to do is create a category-4 template and
-
2:41
then customize that to appear a certain way.
-
2:45
For example, if you look at the category notice that we have this line here,
-
2:49
as well as the extra metadata.
-
2:52
However, in this one we don't, and we don't have any metadata here, as well.
-
2:57
So, the category four is going to be whatever ID is set to four.
-
3:02
And this is a useful way to do it if the category names may change slightly
-
3:08
because if the category names are going to change, we want to use the ID number.
-
3:12
The ID number does not change.
-
3:16
However, we also have the ability to create an ID, or
-
3:20
create a category template based on the slug.
-
3:24
So if we come back to our Categories and
-
3:26
we look at Special, our slug here is Special.
-
3:31
So, we also have a category-special template that's a little bit different.
-
3:38
What this one is doing, is displaying a completely customized template.
-
3:45
That as we notice, isn't even hooked up to the rest of WordPress.
-
3:49
It's just putting some custom HTML and then a fun picture in.
-
3:54
This may or may not be what you want to have on your site, or
-
3:57
the archive of articles that are special.
-
4:00
Chances are you'll want something a little more classic looking,
-
4:04
but the point here being that you can do quite a wide range of
-
4:08
customizations based on what category it is.
-
4:13
Now, the other thing that I have going on,
-
4:15
is to do this styling, it's relying on the body class link.
-
4:21
So remember how we added the body class link.
-
4:23
And that tells us archive category category-travel.
-
4:27
So I know, based on a class on my body tag that I'm on a category travel page.
-
4:36
So what I can then do is, if I highlight this nav bar.
-
4:42
We could see that category Travel, nav bar default, was set as background yellow.
-
4:49
So in my CSS I have a special tag that just styles this page,
-
4:55
but it's not applying the styles based on the PHP.
-
4:58
It's actually the output that's being put into the head tag, or
-
5:03
I'm sorry, the body tag, and then we can use that within our CSS.
-
5:06
But this should give you the full range of working with some different options for
-
5:12
creating Category archives.
You need to sign up for Treehouse in order to download course files.
Sign up