X

Complete Guide to WordPress Custom Post Type Templates

As a WordPress lover I want to see endless possibilities for WordPress as the entrance of the craze of Web Development. WordPress has passed a long time to retain it’s position. REST API made WordPress more flexible for native Application Developers.

Custom Page Template supports on WordPress over 12 years. Personally I was feeling from last couple of years, if I could get control over Post Templates also…

We’re really Lucky, WordPress built for it’s architecture and flexible structure which allow users or Developers to change anything they want. Now a days, WordPress isn’t just for Blogging platform, WordPress is a CMS that you can do any type of Websites you want. For Example – Facebook Newsroom, Google VentureTED, Linkedin, CNN etc.

On recent WordPress Updates 4.7 released with Custom Post Type Template Supports. Which will give extensive facilities for Theme Developers.

We’ve developed our recent VideoStories Theme with support of WordPress Custom Post Templates. For Single Post Type Layouts usually Theme Developers gives “select layout” on Theme Options. Which is OLD way now.

Old way to show Single Post Type Template Layout

Now, you don’t have to give attention on Theme Options. No headache for Single Post Type layouts. Simply follow the process below.

Understanding Template Files in WordPress

You may familiar with Page Template functionalities, now this time for all Post Types Templates. Which improves template hierarchy.

In short: when we’re speaking about templates in context of WordPress. Those are files which tells WordPress the way to display specific type of contents on different way.

On Descriptive way: while a visitor sends request to view your contents, WordPress CMS is automatically detects from the Specific URL and find the way what users wants to see and display the portion of contents.

WordPress detects the most appropriate file from your Theme. For better understanding, WordPress Template hierarchy decided the way how Template files are working. You can also familiar yourself interact with this diagram.

 

(View Large Version)

WordPress is very much familiar with the ranked of template hierarchy which is a list of files, prioritize ranking one after another.

WordPress uses the above image like a decision tree. Be familiar yourself with this template architecture. WordPress itself and decides to display the requested page, continuously searching one after another template hierarchy until it finds suitable template. Example: someone is attempted request to visit this Page , WordPress will work like the order of Template Architecture like below:

  1. Single Post Page
  2. Blog Post
  3.  single-post.php
  4. Single.php
  5. index.php

If any content doesn’t exists then last WordPress template hierarchy is index.php. It means index.php file will decide if showing a “404 not found” page or do something else like showing a custom message to users. If requested URL founds on single-post.php, then it will show the Posts according to the layout of Single.php file.

Where to Use POST Type Templates

Post Type Archives: the standard Post Type Template is archive-{posttype}.php . If you’ve a Post Type “Portfolio” then your Post Type Archive Template will be archive-portfolio.php. Another way you can do just portfolio.php file. Copy your Theme Archive/Category file and rename it archive-portfolio.php.

If you want to show Post Type Archive Header then follow this snippet.

<?php if ( is_post_type_archive() ) { ?>
    <h2><?php post_type_archive_title(); ?></h2>
<?php } ?>

Single Post Type: Likewise archive-{post_type}.php do a copy of single.php file and rename it like single-{post_type}.php. If your Post Type is “Portfolio” then your Single Post Type Template will be single-portfolio.php . Do some stuffs whatever you like to do on your Single Portfolio Page. It may be showing Custom Meta Fields, Gallery, Title, Descriptions, Related Portfolio’s and many more things you can do.

Single Post Type Template: This is completely new feature on WordPress Theme Development. As like Page Templates “Template Name:”, on page file header is same. New term added “Template Post Type” specified using of Supported Post Types from above Template hierarchy.  Example Snippet:

<?php
/*
Template Name: Full-width layout
Template Post Type: post, page, product
*/ 
// … your code here

snippet borrowed from wordpress.org

You’re able to declare same template file for many post types like – posts, pages, products, portfolio’s etc. The above snippets done the same. Or, you can separate them on many ways like – with sidebar, without sidebar, full width etc.

 

Difference between Page Template and Post Templates

In core functionality there’s no difference between Page and Post Type Templates. The extra facilities you’re getting to declare the Template file for Post Types, which wasn’t available before WordPress v4.7. Let’s see

Page Attributes

 

Post Attributes

Both are working same the difference is only on Title “Post Attributes” and “Page Attributes”.

 

Now, come to the point of real scenario.  We’ll do some real projects what we’ve done on our VideoStories Theme. We’ve three layouts for Video Styles.

We’ve created a folder named it “post-templates’, and file structure is like –

We’ve Used Code Snippets for every layout of post type templates-

<?php
/*
Template Name: Full Video & Sidebar
Template Post Type: video
*/
get_header();
// post Query loop

We’ve created different looks for each file. Users have to just select

Just select the Layout of Post Type Templates and you’re done.

 

Backward Compatibility

If you’re Developing WordPress themes for WordPress.org Repository or ThemeForest then you’ve to think about your Clients end WordPress Versions also. If Post Type Template feature isn’t available, means if their WordPress version is before 4.7 then this feature will not work for them. If you’ve no other Options like select Single Post Type Layouts from Theme Options then you’ll be on real problem. Better give backward compatibility on your Themes.

function jeweltheme_exclude_page_templates( $post_templates ) {
    if ( version_compare( $GLOBALS['wp_version'], '4.7', '<' ) ) {
        unset( $post_templates['templates/full-width-post-template.php'] );
    } 
    return $post_templates;
} 
add_filter( 'theme_page_templates', 'jeweltheme_exclude_page_templates' );

 

We’ve found this new feature is more useful than other industry standard systems.

If you like this post then Please do shares to let’s know your WordPress friends and feel free to comments and shares.

 

Complete Guide to WordPress Custom Post Type Templates
4 (80%) 2 votes
Complete Guide to WordPress Custom Post Type Templates was last modified: July 25th, 2017 by Liton Arefin
Complete Guide to WordPress Custom Post Type Templates was last modified: July 25th, 2017 by Liton Arefin

This post was last modified on July 25, 2017, 12:19 am

Categories: Web DevelopmentWordPress Theme
Tags: custo post typespost type templateswp post type templates
Liton Arefin: C.T.O and mastermind behind Jewel Theme. He is Leading a core WordPress Development Team. Extremely Passionate about WordPress. professional experience over 7 years. Cricket lover, Traveler and Movie freak...