WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I have a couple of custom post types registered. I would like to display all "posts" from each custom post type on its own page, and these pages must be visible in the nav menu.

It would be great to only have one page-custom.php template as to a page template for each custom post type. Is it possible to create something like this?

share|improve this question
up vote 3 down vote accepted

REVISIT: Feb. 2nd 2016

The original code had many issues

  • Data wasn't sanitized and validated which can lead to serious security issues

  • Some parts were repetitive

  • Bit messy and sometimes hard to read

  • Some sections was only partly working

  • Used globals which is really evil

That is why I revisited this answer and updated the code in order to solve the issues above. The code is now cleaner, safer and easier to read and debug. Make sure to check it out in the ORIGINAL ANSWER section

Before I go to the original ORIGINAL ANSWER section, I want to add an alternative which I think is a bit better to use

ALTERNATIVE WAY

This is a straight forward alternative solution which does not involve custom templates (except maybe a content.php) or modifying any templates. All you need to do is

  • create a new page with any page template you wish

  • create a content.php template part of any such template part if your theme does not have these available by default

  • add the following code and your done

    $query = new PreGetPostsForPages(
        251,       // Page ID we will target
        'content', //Template part which will be used to display posts, name should be without .php extension 
        true,      // Should get_template_part support post formats
        false,     // Should the page object be excluded from the loop
        [          // Array of valid arguments that will be passed to WP_Query/pre_get_posts
            'post_type'      => 'post', 
            'posts_per_page' => 2
        ] 
    );
    $query->init(); 
    

The PreGetPostsForPages class can be found in my answer here and also a detailed explanation on how to use it

ORIGINAL ANSWER

If you have a look at the template hierarchy, custom post types are usually displayed on archive templates. Normal template hierarchy does not make provision for page.php type templates to be used to display custom post types by default.

The problem with archive templates is that they don't automatically get added to the default nav menu, and creating a custom menu to create links is not always the most convenient way to go.

The way to go here is to use WP_Query to create a custom query for the loop to include custom post types. WP_Query have a post_type type parameter which is used to call post types.

So, the following needs to be modified to make this work:

Firstly, create a custom page.php template

To create the custom page.php you need to copy your theme's page.php and rename it something like page-cpt.php. Now open it and change the loop. For the sake of this answer, I've used the default twentyfourteen theme. Delete everything inside the template and replace it with this code

EDIT I have came back to change the code. The previous code used the following in the custom query

global $post;
$tmp_post = $post;
$wp_query= null;
$wp_query = new WP_Query();
$wp_query->query( $args );

which also translate to query_posts, which should never be used. So I changes the code accordingly to execute a proper instance of WP_Query. Here is the edited code

<?php
/**
 * Template Name: Custom Post Type Page
 */
get_header(); ?>

<?php
    //See if we have any values
    $post_meta   = get_post_meta( $post->ID,false );

    $posttype    = isset( $post_meta['_cpt_post_type'] )   ? $post_meta['_cpt_post_type'][0]   : 1;
    $page_title  = isset( $post_meta['_cpt_page_title'] )  ? $post_meta['_cpt_page_title'][0]  : '';
    $posts_title = isset( $post_meta['_cpt_posts_title'] ) ? $post_meta['_cpt_posts_title'][0] : '';
    $orderby     = isset( $post_meta['_cpt_order_by'] )    ? $post_meta['_cpt_order_by'][0]    : 'date';
    $asc         = isset( $post_meta['_cpt_asc'] )         ? $post_meta['_cpt_asc'][0]         : 'DESC';
    $post_count  = isset( $post_meta['_cpt_post_count'] )  ? $post_meta['_cpt_post_count'][0]  : get_option('posts_per_page');

?>  
<div id="main-content" class="main-content">

    <div id="primary" class="content-area">
        <div id="content" class="site-content" role="main">

    <!-- Page Title -->
    <?php if( $page_title ) { ?>
        <article id="posts-title">
            <header class="entry-header">
                <h2 class="entry-title"><?php echo $page_title; ?></h2>
            </header><!-- .entry-header -->
        </article><!-- #posts-title -->
    <?php } ?>

        <?php the_post(); ?>
        <?php global $post;
        if( $post->post_content || $page_title ) : ?>
        <div class="entry-content">
            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                <?php if( $posts_title ) : ?>
                    <header class="entry-header">
                        <h1 class="entry-title"><?php echo $posts_title; ?></h1>
                    </header><!-- .entry-header -->

                <?php endif; ?>
            <?php if( $post->post_content ) : ?>    
                <div class="entry-content">
                    <?php the_content(); ?>
                    <?php wp_link_pages( ['before' => '<div class="page-link"><span>' . __( 'Pages:' ) . '</span>', 'after' => '</div>'] ); ?>
                </div><!-- .entry-content -->
                <footer class="entry-meta">

                </footer><!-- .entry-meta -->
            <?php endif; ?>
            </article><!-- #post-<?php the_ID(); ?> -->
        </div>  
        <?php endif; ?>

<?php 
/**-----------------------------------------------------------------------------
 *
 *  Start our custom query to display custom post type posts
 *
*------------------------------------------------------------------------------*/

        $args = [
            'post_type'           => $posttype,
            'posts_per_page'      => $post_count,
            'paged'               => $paged,
            'order'               => $asc,
            'ignore_sticky_posts' => 1,
        ];
        $cpt_query = new WP_Query($args);

        // Output
        if ( $cpt_query->have_posts() ) :

            // Start the Loop.
            while ( $cpt_query->have_posts() ) {
                $cpt_query->the_post(); 

                    get_template_part( 'content', get_post_format() );

            }

            if ( function_exists( 'pietergoosen_pagination' ) )
                pietergoosen_pagination();  

                wp_reset_postdata();

        } else {

                get_template_part( 'content', 'none' );

        } ?>


    </div><!-- #content -->
    </div><!-- #primary -->

    <?php get_sidebar( 'content' ); ?>

</div><!-- #main-content -->

<?php
get_footer();

The first piece of code is used to call the settings from the db. This will be set via a metabox in the back end when creating a new page in the page editor screen. The important code here is the arguments for WP_Query.

$args = [
    'post_type'           => $posttype,
    'posts_per_page'      => $post_count,
    'paged'               => $paged,
    'order'               => $asc,
    'ignore_sticky_posts' => 1,
];

This will decide which custom post types will be displayed, posts per page and the order of posts. All these settings are called from the db, and is set in the custom meta box in the back end

Secondly, create a custom meta box

This metabox will be diplayed in the "Page" screen when a new page is created and "Custom Post Type Page" is selected in the "Page Attributes" meta box.

Add the following in your functions.php or custom functions file

<?php
add_action( 'admin_init', function ()
{   
    $post_id = filter_input( INPUT_GET, 'post', FILTER_VALIDATE_INT );
    if ( $post_id ) {
        // Get the current page template
        $post_meta = get_post_meta( $post_id );

        // Make sure that we only target our desired template
        if (    isset ( $post_meta['_wp_page_template'][0] )
             && 'page-cpt.php' === $post_meta['_wp_page_template'][0] 
        ) {
            add_meta_box(
                'cpt_meta_box', 
                __( 'Page of post from a given custom post type' ), 
                'cpt_metabox_options', 
                'page', 
                'side', 
                'core'
            );
        } else {
            if( isset( $meta['_cpt_post_type'][0] ) ) {
                $meta_value_array = [
                    '_cpt_post_type',
                    '_cpt_page_title',
                    '_cpt_posts_title',
                    '_cpt_order_by',
                    '_cpt_asc',
                    '_cpt_post_count'
                ];
                foreach ( $meta_value_array as $value ) 
                    cpt_helper_update_post_meta( $post_id, $value, '' );

                remove_meta_box( 'cpt_meta_box', 'page', 'side' );
            }
        }
    }
    add_action( 'save_post',  'cpt_update_post_meta_box' );
});

function get_cpt_order_by_list()
{   
    // Set the sort order
    $sort = [
        [
            'DESC' => [
                    'value' => 'DESC',
                    'label' => 'Descending'
                ],
            'ASC'  => [
                    'value' => 'ASC',
                    'label' => 'Ascending'
                ],
        ]
    ];      

    // Create an array of values to order the posts by
    $order_list = [
        [
            'none'          => [
                    'value' => 'none',
                    'label' => 'None'
                ],
            'id'            => [
                    'value' => 'ID',
                    'label' => 'Post ID'
                ],
            'author'        => [
                    'value' => 'author',
                    'label' => 'Author'
                ],
            'title'         => [
                    'value' => 'title',
                    'label' => 'Post Title'
                ],
            'date'          => [
                    'value' => 'date', 
                    'label' => 'Post Date'
                ],
            'modified'      => [
                    'value' => 'modified',
                    'label' => 'Modified Date'
                ],
            'parent'        => [
                    'value' => 'parent',
                    'label' => 'Parent Post'
                ],
            'rand'          => [
                    'value' => 'rand',
                    'label' => 'Random'
                ],
            'comment_count' => [
                    'value' => 'comment_count',
                    'label' => 'Comment Count'
                ],
            'menu_order'    => [
                    'value' => 'menu_order',
                    'label' => 'Menu Order'
                ],
        ]
    ];

    return $list = array_merge( $sort, $order_list );
}

function cpt_metabox_options()
{
    $post_id = filter_input( INPUT_GET, 'post', FILTER_VALIDATE_INT );
    if ( !$post_id )
        return;

    // Make sure the current user have the edit_page ability
    if ( !current_user_can( 'edit_post', $post_id ) )
        return;

    // Get the current page template
    $template_file = get_post_meta( $post_id, '_wp_page_template', true );

    // Make sure that we only target our desired template
    if ( 'page-cpt.php' !== $template_file ) 
        return;

    // Get all the post meta values and sanitize/validate them
    $post_meta = get_post_meta( $post_id );

    $filters = [
        '_cpt_post_type'   => [
            'filter'       => FILTER_SANITIZE_STRING,
            'default'      => ''
        ],
        '_cpt_page_title'  => [
            'filter'       => FILTER_SANITIZE_STRING,
            'default'      => ''
        ],
        '_cpt_posts_title' => [
            'filter'       => FILTER_SANITIZE_STRING,
            'default'      => ''
        ],
        '_cpt_order_by'    => [
            'filter'       => FILTER_SANITIZE_STRING,
            'default'      => 'ID'
        ],
        '_cpt_asc'         => [
            'filter'       => FILTER_SANITIZE_STRING,
            'default'      => 'DESC'
        ],
        '_cpt_post_count'  =>  [
            'filter'       => FILTER_VALIDATE_INT,
            'default'      => get_option( 'posts_per_page' )
        ],
    ];  

    foreach ( $filters as $key=>$value ) {
        if ( !array_key_exists( $key, $post_meta  ) ) {
            $post_meta[$key][0] = $value['default'];
        } else {
            $post_meta[$key][0] = filter_var( $post_meta[$key][0], $value['filter'], $value['default'] );
        }
    }
    ?>

    <!-- Sart the meta boxes -->
    <div class="inside">

        <p>
            <label>
                <strong><?php _e( 'Page Title' ); ?></strong>
            </label>
        </p>    
        <input id="_cpt_page_title" name="_cpt_page_title" type="text" style="width: 98%;" value="<?php echo $post_meta['_cpt_page_title'][0]; ?>"/>    

        <p>
            <label>
                <strong><?php _e( 'Post Title' ); ?></strong>
            </label>
        </p>    
        <input id="_cpt_posts_title" name="_cpt_posts_title" type="text" style="width: 98%;" value="<?php echo $post_meta['_cpt_posts_title'][0]; ?>"/>

        <p>
            <label>
                <strong><?php _e( 'Custom Post Type' ); ?></strong>
            </label>
        </p>
        <select id="_cpt_post_type" name="_cpt_post_type">
            <?php 
                //Custom Post Type List
            $args = [
                'public'   => true,
                '_builtin' => false
            ];

            $output = 'names'; // names or objects, note names is the default
            $operator = 'and'; // 'and' or 'or'

            $post_types = get_post_types( $args, $output, $operator ); 

            foreach ( $post_types  as $post_type ) {
                $selected = ( $post_type == $post_meta['_cpt_post_type'][0] ) ? ' selected = "selected" ' : '';

                $option = '<option '.$selected .'value="'. $post_type;
                $option = $option .'">';
                $option = $option .$post_type;
                $option = $option .'</option>';
                echo $option;
            } //endforeach;
            ?>
        </select>

        <?php 
        if ( function_exists( 'get_pop_order_by_list' ) ) {
            $list = get_pop_order_by_list();
            ?>
            <p>
                <label>
                    <strong><?php _e( 'Sort by' )?></strong>
                </label>
            </p>
            <select id="_cpt_order_by" name="_cpt_order_by">
                <?php 
                foreach ( $list[0] as $output ) {
                    $selected = ( $output['value'] == $post_meta['_cpt_order_by'][0] ) ? ' selected = "selected" ' : '';

                    $option = '<option '.$selected .'value="' . $output['value'];
                    $option = $option .'">';
                    $option = $option .$output['label'];
                    $option = $option .'</option>';
                    echo $option;
                } //endforeach;
                ?>
            </select>   

            <p>
                <label>
                    <strong><?php _e( 'Order' )?><strong>
                </label>
            </p>
            <select id="_cpt_asc" name="_cpt_asc">
                <?php 
                foreach ( $list[1] as $output ) {
                    $selected = ( $output['value'] == $post_meta['_cpt_asc'][0] ) ? ' selected = "selected" ' : '';

                    $option = '<option '.$selected .'value="' . $output['value'];
                    $option = $option .'">';
                    $option = $option .$output['label'];
                    $option = $option .'</option>';
                    echo $option;
                } //endforeach;
                ?>
            </select>

            <?php
        }
        ?>
        <p>
            <label>
                <strong><?php _e( 'Posts per Page' ); ?><strong>
            </label>
        </p>
        <input id="_cpt_post_count" name="_cpt_post_count" type="text" value="<?php echo $post_meta['_cpt_post_count'][0]; ?>" size="3" />

    </div>
    <!-- End page of posts meta box -->
    <?php
}

function cpt_update_post_meta_box( $post_id )
{
    // Make sure we have a valid $_POST method
    if ( !$_POST )
        return;

    // Make sure the current user have the edit_page ability
    if ( !current_user_can( 'edit_page', $post_id ) )
        return;

    // Get the current page template
    $template_file = get_post_meta( $post_id, '_wp_page_template', true );

    // Make sure that we only target our desired template
    if ( 'page-cpt.php' !== $template_file ) 
        return;

    // Do nothing on auto save, just bail
    if (    defined( 'DOING_AUTOSAVE' ) 
         && DOING_AUTOSAVE 
    )
        return;

    $args = [
        '_cpt_post_type'    => [
                               'filter' => FILTER_SANITIZE_STRING,
                               'default' => ''
                           ],   
        '_cpt_page_title'   => [
                               'filter' => FILTER_SANITIZE_STRING,
                               'default' => ''
                           ],
        '_cpt_posts_title'  => [
                               'filter' => FILTER_SANITIZE_STRING,
                               'default' => ''
                           ],
        '_cpt_order_by'     => [
                               'filter'  => FILTER_SANITIZE_STRING,
                               'default' => 'date'
                           ],
        '_cpt_asc'          => [
                               'filter'  => FILTER_SANITIZE_STRING,
                               'default' => 'DESC'
                           ],
        '_cpt_post_count'   => [
                               'filter'  => FILTER_VALIDATE_INT,
                               'default' => get_option( 'posts_per_page' )
                           ],  
    ];  

    $meta = filter_input_array( INPUT_POST, $args );

    if ( !$meta )
        return;

    // Loop throught the array and update meta values
    foreach ( $meta as $k=>$v ) 
        cpt_helper_update_post_meta( $post_id, $k, $v );
}   

function cpt_helper_update_post_meta( $post_id = '', $key = '', $data = '' ) 
{
    // Make sure we have valid values, if not, return false
    if ( !$post_id
         || !$key
    )
        return false;

    // Sanitize and validate values
    $post_id = filter_var( $post_id, FILTER_VALIDATE_INT    );
    $key     = filter_var( $key,     FILTER_SANITIZE_STRING );
    $data    = filter_var( $data,    FILTER_SANITIZE_STRING );

    // Get the  post meta values
    $post_meta = get_post_meta( $post_id, $key, true );

    if(    $data
        && $post_meta != $data
    ) {
        update_post_meta( $post_id, $key, $data );
    } 

    if (    $post_meta 
         && !$data
    ) {
        delete_post_meta( $post_id, $key );
    }
}

Metabox

What this code do is to register and display the meta box, add the options to the metabox and storing the options to the db for use in the page-cpt.php template.

You can now go and create a new page, and call the page whatever you like. In the "Page Attributes", select "Custom Post Type Page" and "Publish" your page. The metabox for the custom post types options will now appear above the "Publish" metabox, and will display all the current available custom post types. Select and set the options you need to display and click "Update". Your page will now show posts from the custom post type you have selected, and your page will be visible in the nav bar.

You can add more functionality to this, or change the code to display categories or taxonomies in the same way. Hope this help

share|improve this answer
2  
Arguably it's easier and way more robust to make menus support archives than hack pages into pseudo-archives. – Rarst Apr 3 '14 at 20:25
    
I won't argue that. I think this will depend on person to person. I know this might be over inflated, but it works for me. It is always nice to hear what others think of a solution and how they will do things. Thanks for your comment. Really appreciated – Pieter Goosen Apr 3 '14 at 20:34
2  
@Rarst you should add that as an alternate answer. I'll upvote it, too, along with this one. – Chip Bennett Apr 4 '14 at 12:48
    
@ChipBennett there are already answers on that on site and since I'm lazy it would be "search around or use plugin" so I don't feel like it's good answer material :) – Rarst Apr 4 '14 at 12:50

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.