Home » Welcome » Page Template: List Posts by Category
Home » Welcome » Page Template: List Posts by Category

Page Template: List Posts by Category

Author:

Lauren Gray

Published:

This site runs ads and generates income from affiliate links. Read my disclosure policy.

Creator Theme Feature Fest starts January 22nd

Let’s Build Together!

Today I’m sharing a WordPress custom page template that will allow you to list all your posts by category.

While I’m usually focusing on creating highly visual indices for my clients, that isn’t always the case. While this page template can be altered to display additional information, it currently has a very simplified output: category name followed by linked post titles to all content in that category.

This will create an automatic index by all of your categories – additional edits will need to be made in order to exclude any categories.

Page Template: List Posts by Category
This page template will list posts by category to help your readers find the content they are looking for. Here’s an example of what the output looks like, with my theme’s styling.

Indices set up in this manner are great for highly informative blogs, where the viewers are coming with specific questions in mind: making it easy for them to find this information is goal number one.

I’m a firm believer in “work smarter, not harder” and try to re-use code… provided it’s the best answer I can find. In this case, what kept coming up for me was plugins (I avoid these when possible) or code snippets that I knew were not recommended (altering the main query). The best-fitting solution, for me, was to create a custom page template.

Grab the code below, paste into a new file called ‘page_category_index.php’ and upload it into your theme files. Now create a new page and choose “category index” for the template. Your information will, from now on, automatically populate, leaving you worry free!

https://gist.github.com/graylaurenm/aa9dade36cf61de24fd2

pssst.. Check out our sister brands!

Small Plugins: optimized custom blocks
Creator Theme: DIY version (coming soon)

Leave a Reply

Your email address will not be published. Required fields are marked *

19 responses

  1. Jessica

    This is so perfect! You saved me tons of time.

    Is there a quick way to have all the categories listed at the top of the page, that link down to the actual post list of that category? Instead of having to scroll through the entire page.

    Reply
    1. Lauren Gray

      Hey Jessica,

      It is possible, and you’d use a lot of the same functions.

      First, you want to copy the loop at the comment “List each category” since we’ll be doing that twice. What we need to do is “Output the category” and while we want it to be a link, we need it to be an anchor link within the same page. Remove the part that will “List the post in said category” and then “Close everything up”, noting that some of the HTML will have changed.

      You’ll then need to edit the second loop in order to make sure the categories have a tag identifying them for the anchor links we created above. Let me know if you need something more specific and I’ll work it up for you!

      Reply
  2. Douglas Barnes

    Hi Lauren,

    I’m using the Genesis Sample theme and this works nicely for importing the categories. The problem I’m having is that it does not seem to pop in a container for the text. In other words, the text lays on the background, making it unreadable. How would I go about giving it a text box like posts in the Genesis Sample Theme template?

    Cheers

    Reply
    1. Lauren Gray

      Hey Doug, can you send me a link to the page you’re working on?

      Reply
      1. Douglas Barnes

        Unfortunately, it’s not live. I’m developing on my localhost. I take it that it’s misbehaving then.

        Reply
        1. Lauren Gray

          I think it’s a problem specific to that theme. I’ll set up my own copy and see what it needs.

          Reply
        2. Douglas Barnes

          The genesis(); function should be pulling in the formatting but isn’t?

          Reply
        3. Lauren Gray

          Well, for this theme, the area that is being styled on pages is .content .entry, so we either need to create new styles for this page, or add that structure back into the page. I would probably do this. (Just the PHP, not the CSS.)

          Reply
          1. Douglas Barnes

            And that did the trick. I’ll need to sort out the CSS to get the colours I want, but it now has a text box.

            Many thanks!

          2. Lauren Gray

            Absolutely!

  3. Martin Forgenie

    Thank you for your code! This works well, except that I’m getting a maximum of 5 topics per category displayed. I don’t know what is limiting the display to just 5 posts.

    Reply
    1. Martin Forgenie

      Ok, I’ve fixed it!! Now, I’ll need to remove some categories!

      Reply
      1. Lauren Gray

        Great to hear!

        Reply
    2. Lauren Gray

      The following line is telling our query that we want all posts, not just whatever our site is set to. It looks like the code has a line break within it. Remove the space between the ‘ and the p, and it may be recognized again. I’ll update my code, too.
      ‘
      posts_per_page’ => -1,

      Reply
      1. Dexter Forgenie

        Oh yes, that worked! Now I just need to figure out how to exclude some categories…

        Reply
        1. Lauren Gray

          Do this.

          Reply
          1. Martin Forgenie

            Lovely! This works great!!

  4. Chris

    Thank you, thank you, thank you! I’ve been trying to do exactly this without a plugin without success. Your code works perfectly – my search is over 😉

    Reply
  5. bmwmarine.net

    In the example here, any content that you enter in your Page will show first, and then your categories and posts lists will show underneath. If you don t want ANY of your Page content to show (i.e. the Page is simply the vessel for displaying your template), then you ll want to remove the default Loop before adding our custom loop.

    Reply

Hey, we’re Once Coupled!  We empower publishers to create great content without tech headaches.