Overview:
In this tutorial I’ll explain how you can list posts under a category on a WordPress page with the same name as that of the category. We will use Custom Page Templates to achieve this.
There may be times when you do not want to display a blog or have the post based layout, and only use Pages. Yet, you would and should harness the power and flexibility of posts.
For example, all posts under a category Workshops will show up on a WordPress page created with the same slug/name Workshops
The page is basically a container to show a filtered view of all the posts but only of a specific category. The advantage here is that the end user only needs to create a category and a Page with the same name. They can keep adding content using Posts, and also have the flexibility to add content in their page before the posts start flowing in.
Step 1 – Create a Custom Page Template
We will achieve this using a Custom Page Template. You can read up more about Page Templates here. Page Templates will allow the user to conditionally tell WordPress to execute special code only for that page.
<?php /** * This file adds the List Posts in Page template to the theme. * * @author Karan Gupta */ /* Template Name: Lists Posts in Page */
Step 2 – Adding the action Hook
I am using the Genesis framework. To allow the user to add Page content, and then load posts in the page I will need to hook after the default Genesis Loop finishes.
<?php /** * This file adds the List Posts in Page template to the theme. * * @author Karan Gupta */ /* Template Name: Lists Posts in Page */ //hook after the loop add_action( 'genesis_after_loop', 'nds_get_posts_for_page' ); function nds_get_posts_for_page() { //logic to list Posts under a Category with the same name as that of the Page name }
Step 3 – Logic to list Posts under a category in the Page
The main logic lies in retrieving the Page name, and then create a new WordPress query with the argument for category as the Page name. This is how it’s done.
$category_Name = get_the_title(); $category_Id = get_cat_ID( $category_Name ); $args= array( 'cat' => $category_Id, 'posts_per_page' => 30, 'paged' => $paged );
Here is the complete code for the Custom Page Template
<?php /** * This file adds the List Posts in Page template to the theme. * * @author Karan Gupta */ /* Template Name: Lists Posts in Page */ //hook after the loop add_action( 'genesis_after_loop', 'nds_get_posts_for_page' ); function nds_get_posts_for_page() { $paged = (get_query_var('paged')) ? get_query_var('paged') : 1; $category_Name = get_the_title(); $category_Id = get_cat_ID( $category_Name ); $args= array( 'cat' => $category_Id, 'posts_per_page' => 30, 'paged' => $paged ); $custom_query = new WP_Query($args); if ($custom_query->have_posts()) { while ($custom_query->have_posts()) { $custom_query->the_post(); ?> <article class="post-<?php the_ID(); ?> entry"<?php post_class(); ?>> <header class="entry-header"> <h2 class="entry-title"> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> </h2> <p class="entry-meta"><?php the_time('F j, Y') ?></p> </header> <div class="pageentry"> <?php the_content(); ?> </div> <?php wp_link_pages(); ?> <div class="postmetadata"> <?php edit_post_link('Edit'); ?> </div> </article> <?php $ids_done[] = $current_post_id; }?> <div class="alignleft"> <?php next_posts_link('« Older Entries', $custom_query->max_num_pages) ?> </div> <div class="alignright"> <?php previous_posts_link('Newer Entries »') ?> </div> <?php } wp_reset_postdata(); } genesis();
Step 4 – Put it to use
Let’s assume you already have a Post Category – Workshops (or use your own category). Create a new Page Workshop or with the same name as your Category. Apply the Page Template List Posts in Page to it. After you publish it you will see all Posts under Workshops or your category also listed on this page.
Leave a Reply