Subscribe!
RSS
  • Moshu
  • Prairie
  • WordPress
  • The combined blog: about WordPress, the Canadian Prairies and myself
    The Journey to full time blogging


Pages and Categories

Thanks for visiting! If you're new here, you may want to subscribe to my RSS feed. My blog posts useful tips, ideas, tutorials and guides for WordPress bloggers - and articles about the life on the Canadian Prairies. If you are familiar with RSS readers, just add my feeds to your reader! You can also receive updates by email if you submit your email address in the box on the right.

If you didn’t have a chance to read my previous post about creating top horizontal menus with Pages - please, have a look at it.
Consider this post an update to it. The basic concept of creating horizontal top menu on WP blogs became widely known and many bloggers start modifying their existing theme to get it. It is all well and simple until the need to have one or more categories also included in that top level menu arises. From here things go wrong almost in every case.

For some unknown reason almost every user starts thinking about this in the wrong direction. Instead of modifying the menu to include there a category - they go the other way around and insist on forcing WordPress to display the posts in a Page. Now, Pages were “invented” and introduced in WP for a completely different reason: to show quasi-static content, i.e. entries that are not part of the chronological stream of the posts. Everybody seem to miss this basic definition of the Pages (notice, in WP documents they are mentioned with capital P). Especially, those already familiar with the concept of the Page Templates (which gives you a great flexibility in customization) - will instantly jump on this… asking endless questions in the forum about “how to display X category on a Page”?

When I respond simply stating this is the wrong approach - it is very difficult to convince them. However, I firmly believe, it is much easier to modify a little bit the code that displays the top menu than to go through all the hassle trying to come up with a custom Loop to get your posts in a Page.

So, let’s get back to our initial code, the template tag that is used to display the list of your static Pages - wp_list_pages. As you remember it displays the list of Pages as list items (sorrounded by li and /li items, so it needs an opening and closing ul and /ul:

<ul>
<?php
wp_list_pages('depth=1&sort_column=menu_order&title_li='); ?>
</ul>

Keeping in mind this is a list with as many list items as many Pages we have - we can simply add some additonal items manually. For example, we can add a Home link to the beginning of the list:

<ul>
<li><a href="<?php bloginfo('home'); ?>">Home</a></li>
<?php
wp_list_pages('depth=1&sort_column=menu_order&title_li='); ?>
</ul>

The Demo site mentioned in the previous post also has this item included.

And now back to our categories. In any basic WordPress blog when you click a category name in the sidebar or in a post (the link that says “posted/filed in…”) - it will take you to a page (with lower case p - meaning a general web page) or view which displays only posts in those category in the usual chronological order: newest on the top.
The WordPress engine can use several different template files to do this. There is a very useful article in the Codex, titled Template Hierarchy, it is worth reading if you want to understand the logic of having different template files. In regards with the category listing or category archives here is the hierarchy of the templates:

  1. category-xx.php
  2. category.php
  3. archive.php
  4. index.php

[The -xx is the category's ID number]. When attempting to display your posts from XX category, the WordPress engine will look first for the #1, then for #2… and so on. The #2 template in the hierarchy will be used for all categories; and this applies to #3 and #4, too.
On the other hand, category-3.php, for example, is a perfect solution for the Page-obsessed users. It offers exactly the same level of customization as a Page template and you don’t have to touch anything in the Loop to make it work. Just save your index.php or archive.php as category-3.php - and you are done. If you need customization, you can call for a different header, for a different sidebar or footer; and, ultimately, you can have different div IDs and calsses in it to be able to style them differently than the rest of your template files.

And, finally, returning to the menu issue. As we added the Home link, we can also add a link to our preferred category:

<ul>
<li><a href="<?php bloginfo('home'); ?>">Home</a></li>
<?php
wp_list_pages('depth=1&sort_column=menu_order&title_li='); ?>
<li><a href="<?php bloginfo('url'); ?>/?cat=3">Preferred</a></li>
</ul>

Note. If using the nice permalinks, replace the ?cat=3 with your category slug.
Go to the Demo blog and look for the “Hidden” item in the top level horizontal menu. It is the category among the Pages.

Update, July 31, 2008.
Otto suggested to add something about using the wp_list_categories template tag. Actually, he is right, because instead of adding manual links for each category you want to display - you could simply use the wp_list_categories tag with the proper parameters, to add a list of categories to your top nav menu. For example, if you take the code from above, it would look like this, if you add the categoires:

<ul>
   <li><a href="<?php bloginfo('home'); ?>">Home</a></li>
       <?php wp_list_pages('depth=1&sort_column=menu_order&title_li='); ?>
   <li><a href="<?php bloginfo('url'); ?>/?cat=3">Preferred</a></li>
   <?php wp_list_categories('depth=1&exclude=3,7&title_li='); ?>
</ul>

This would add only the parent cats (depth=1) and would exclude the categories with ID 3 and 7; the last parameter is preventing the code to add the usual “Categories” heading. Here you go!


44 Responses

  • nic ·

    This was a great article.

  • Richard ·

    Very useful information to digest. Thanks greatly.

  • greg nicolas ·

    I really appreciate, this was a great article.

  • Moshu ·

    greg nicolas, I almost believed you… until I looked at the URI linked to your name. Unfortunately, it was just a shameless “get-rich-quick” scheme, so I deleted it. And for fun I linked your name to a place called Worlds Worst Web. You belong there!

  • Pam ·

    I really appreciate your article, look forward to more in the future.

  • Israel Mirsky ·

    Hi,
    Thanks so much for the tutorial above. I really appreciate the time and effort it takes to make these.

    One question - how do I make a specific category the default index page?

  • Moshu ·

    Israel Mirsky,
    Your question seems to be beyond this article. And I guess you need a different approach: you cannot make anything else to be the “default index page” (except the static Page solution introduced in 2.2). In your case I’d go by using a plugin (like Category Visibility) to exclude everything else from my main/home page - except the desired category.

    The WP forum might be a better place to get more detailed answers.

    Thanks for stopping by and for your comment :)

  • tony ·

    Good job. I will check it out even though I’m new to blogs.

  • Mercedes ·

    Hi Moshu !
    I am imposed by people with the creative approach in all and today It is a greater rarity. I think, You are included into their number and I trust you

  • Dustin Vik ·

    Awsome Article!

    Vik

  • Kyle ·

    I used this method on my blog to improve my navigation. It worked wonderfully. Great job with the tutorial and codes.

  • Frank ·

    wow! absolutely great article! i’ve been trying to do this for over a year and i was just installing mu… this saved me sooo much time. thanks

    is there a way to keep the categories in the header menu from showing up on the “home” page?

    thanks again

  • fala ·

    http://www.freemacblog.com/mac-server-series-install-wordpress-on-your-mac-using-mamp/#comment-29972

  • Joe ·

    This was a great help for someone who is new to blogs.

  • Jason Glover ·

    Wow.. don’t I feel like a dumbass. Sure wish I had read this before I started fooling around like a retarted newb.

    Thank you! I now understand exactly how to do what I want.

  • Moshu ·

    Jason, don’t be too hard on yourself :)
    It took me over 3 years spent in the WP forum to figure out a lot of stuff like this. Just use it (and you may want to look at the other guides, too) and enjoy blogging!

  • Rene Visco ·

    I can see why there is confusion between pages and category pages. The problem lies in the URL address. I am confused myself, too.

    I want to have a category page of job listings that is excluded from the main blog.

    But I don’t want it to be appearing like this:

    http://www.domainname.com/?cat=18

    I prefer

    http://www.domainname.com/jobs (including the specific category)

    How do I get WP to work like that?

    Second question:

    Can I create a different sidebar to go with category-3 page? I just copy index.php and make it category-3.php including a different sidebar (using include sidebar2.php)? That’s all?

  • Moshu ·

    I don’t really see why should there be confusion about Pages (always with capital P) and category archives, which is a listing of posts in one certain category. Actually, they have nothing in common. So, stop using “category page” - the correct WP terminology is category listing or category archive.

    1. As for the URLs - maybe reading the Codex, regarding Using Permalinks should help. And just for the record: you can NOT have example.com/jobs - only example.com/category/jobs. This isssue is also discussed at the link above.

    2. Yes. The copy > save as steps are OK. If you have a file ’sidebar2.php’ call it with
    < ?php include(TEMPLATEPATH . "/sidebar2.php");?>

  • Rene Visco ·

    Moshu,

    Thanks for the tip. I can live with domainname.com/category/jobs

    Cheers,

    Rene V.

  • Tony ·

    Great article, and it might help with what I am trying to achieve.

    I bought a Wordpress based site from a developer, it’s theme being a Gift Store.

    They have a widget (CSBAY) that you can code on Pages to pull in items for sale on eBay.

    What I want to do is to have a Category Called SPECIAL OFFERS that I can Post to, visitors clicking on SPECIAL OFFERS will see the latest posts.

    Well, I would like to have SPECIAL OFFERS as a Page, but for now it’s a Category. Problem is that when I view the Category, I see the 2 Posts in that Category, with lots of eBay listings in between them. The eBay listings are not Posts, and are not in that Category.

    I don’t have a clue what I am doing wrong, and have tried everything. I ended up here since the WordPress Forums don’t answer my question, nobody seems to answer questions on the forums there, I can’t find a good forum on Usenet either…

    Help me Obi-Wan-Kenobi, you are my onyl hope :)

    I know this isn’t the place to post a plea for help - but anything you can do will be appreciated. I can give you reviews happily.

    Tony

  • Moshu ·

    Hi Tony,

    Since I cannot see the backend of your site and the files in the theme… I can only guess: probably, you will need different custom Page templates and/or Category Templates.

    That’s all I can say without having access to it. If you want further custom help, use the Contact form to hire me.

  • Oli ·

    Hi Moshu,

    First off, thanks for a great site - it’s really helped me out! However…

    I’ve read through the info above and have changed my header.php to include the code above, but when I click to the Page that relates to the category (cat-3) I get a 404 error. I have left the category name as per your post but still nothing.

    Would the way my permalinks are set out make a difference? They are currently a custom structure of /%postname%/.

    Any ideas would be most appreciated!

  • Moshu ·

    First of all - there should NOT be any Page that “relates” to any category. You link directly to the category archive!

    Next, it is there, after the code:
    Note. If using the nice permalinks, replace the ?cat=3 with your category slug.

  • Billy Sticker ·

    Great post. Did what you said and presto…just what I wanted. However, it looks like somewhere in the process a problem has occurred. In the dashboard when I go to write or manage/edit a post or Page… most of my options(?) down below are gone! I only have:(for post) Title, Post, Tags, Categories, All in One SEO Pack; (for Page) Title, Page, All in One SEO Pack.

    Any ideas?

  • Moshu ·

    I don’t see how those things might be related to this. Start with deactivating all the plugins.

  • Joy ·

    Hi,

    great article- I was going round in circles trying to get posts from a specific category in a page. Maybe one of the reasons we all want to to this, is because we want a static link to posts of a particular category on our sidebar, but don’t want to use the categories widget to do this. If you will look at my site, I am using the FlexiPages widget to display Home, Review, and Sitemap pages. Now I want the Review link to recall all posts under the category review. How do I do this? I can’t find any documentation on creating a permanent link to the category_page function. I am sure there is a way, just can’t locate it. Thanks again!

  • Joy ·

    Hi again,

    follow up question to that one: and I want to supress that category from displaying on the front page or anywhere else on the blog. Basically, what I am looking to do is have all Review posts just be accessible through the review link, so that users know they just have to hit that one button to call up the latest book and article reviews. Is this possible in Wordpress? I just started blogging 2 weeks back, so not that advanced with code as I could be.

  • Moshu ·

    Joy wrote:
    trying to get posts from a specific category in a page

    You need to improve your reading skills. This whole article is about how BAD IDEA is thinking of putting posts on a Page. You do not need any “Reviews” Page to display posts from that category. Read the article above as many times as needed until you get it. If you are new to WP and coding - hire a pro.

  • Iain ·

    Hi Moshu, this is indeed one solution to the problem of showing a Category Listing alongside a set of Pages in a website navigation.

    However, given that it depends on an absolute reference to the Category in the template, it’s not a solution that can be managed by the content manager without web developer input.

    Perhaps this is why other developers try to include a Category Listing in a Page.

    Are you aware of any plugins that allow one to create a list of Pages/Categories in the CMS interface, which is then included in the template via a template tag like wp_list_page-cat-mix() ?

    Best wishes

  • Valentin ·

    I just wont to say big THANK YOU!

    I’ve spend several days to find solution in order to combine Page with categories.

    You give me enlightenment. It’s very easy to do it with simple code that is in front of the ayes.

    It’s so simple. I will do it.

  • Daniel ·

    This article is all good, and this is nifty information if you are new to editing wordpress blogs, like me.. :o)

    Now what if I want to exclude the header menu from certain pages, say I have 2 pages and only want to show it on one page that is index, and this is a static page, while wordpress posts the blogposts to another page..?

    I guess a php if or boolean function could do it somehow!?

  • Moshu ·

    @Daniel,
    Don’t overcomplicate it, man!
    Start reading the documentation, aka Codex. Search for the Conditional Tags section.

  • Kuba ·

    Hey Moshu,

    I too have figured this out (without using Pages)
    But i have a question for you that i can’t figure out myself. Is there any way of making the link show the full post and not just the link/title?

    I’m trying to make a photo gallery with all my photo posts but people would have to click on each separate post to get to the images. Is there any way to show the full posts using this method?

  • Moshu ·

    I am not sure I understand your question, Kuba.

    To display full posts where? In the menu?

  • Kuba ·

    So on my site, we have a photo gallery.
    I excluded the photo gallery category off the main page, but had them appear on another link, using the method you showed us. The link however only takes you to a list of the gallery posts. my question is, is there a way of making the link show full posts? here is my website so you get a better understanding of what exactly i mean.

    http://www.zephyrmag.ca/wordpress/

    Where sites and sounds is the link i am talking about.

  • Moshu ·

    I see. That has nothing to do with my article. You should learn about the Template Hierarchy. In your case it means creating a category-13.php template file and editing it to display what you want. (While being at the Codex site, read about Template Tags, too…)

  • daweb ·

    [ITA] -> Sorry ’bout my english…

    I think I understand the simply method. But…

    How to style my ‘new’ menu with the correct (and needed for me) ‘current_page_custom_style’?

    Regards

  • Moshu ·

    Just read your source code… No need of English for that :)

    What about the code like this?
    li class=”cat-item cat-item-27 current-cat-parent
    or
    li class=”cat-item cat-item-32 current-cat

    The above classes are generated by WP, so it is even better than the Pages list!

  • Amy Beeton ·

    hey great article, really clear and precise! thanks

  • Struggling Readers ·

    thanks for the tips they helped me out a ton holy cow

  • dav ·

    Hello,
    I came upon your site while trying to research how I can have unique categories to a particular page in Wordpress. For example ‘Food’ ‘Politics’ are pages and when I click on Politics I want categories related only to politics. I am sorry if this has been answered above, but am very new to wordpress and still have to digest a lot of things. Will the solution provided above do it?

    Thanks for your help

  • Moshu ·

    Sorry, dav, it won’t.
    My post starts with the explanation what a stupid idea is to try to put categories on Pages.

    You DO NOT use Pages to display categories. Period. You should NOT create Pages that have the same titles as your categories. Please, read again and again the post above (or as many times as you need to understand it). Your approach is completely wrong, sorry. This is a quote from the second paragraph:

    For some unknown reason almost every user starts thinking about this in the wrong direction. Instead of modifying the menu to include there a category - they go the other way around and insist on forcing WordPress to display the posts in a Page.

    I gave you everything in the post what you need to get rid of this obsession of using Pages for categories…

  • triibutu ·

    Hi Moshu, with all due respect I honestly do not buy it. You have given exactly *one* reason why one should not try to use pages to display posts:

    However, I firmly believe, it is much easier to modify a little bit the code that displays the top menu than to go through all the hassle trying to come up with a custom Loop to get your posts in a Page.

    In my view it is *much harder* to find a php developer each time you need to change something in your category templates or create new category templates or add new links to your top menu etc etc, than it is to come up with a configurable loop once (it’s not rocket science) and leave the rest to the content producers.

  • Davis ·

    Can someone please tell me how to do the following:

    I have a “guest blogger” who posts to the category “guest”.

    I want to make a PAGE (so I can edit the info dynamically) and at the bottom of the “Guest Blogger” PAGE, I want to include posts from the category “guest”.

    Help me please.

4 Trackbacks/Pingbacks

  1. Mark Thomas Gazels websted » Blog Archive » links for 2007-08-09
  2. Playing with WordPress » Creating a two level menu with Pages - part 2
  3. Calendar Plugin and Pages
  4. eBooks Just Published » eBooks Just Published Has a Blog

RSS feed for comments on this post.   TrackBack URI

Leave a Reply


or read more about The Pension Report!