What is a WordPress custom post type template?
To answer that, let’s first start with the two post types built into WordPress: posts and pages. Posts are for blog posts and usually display on the front end along with a publication date, an author, comment count, and tags and categories. Pages on the other hand, display without any of that extra information. How post and pages display on the front end is the post type template. A custom post type template then is similar to posts and pages in that it displays content in the front end, but you as the creator of the custom post type can define what information the post editor collects and how it’s displayed on the front end for your visitors. This will make more sense as you go through this tutorial.
Creating custom post types templates is a two-step process.
- Create the custom post type in WordPress (with or without a plugin)
- Create the page template that displays the custom post type content to visitors
This tutorial will show you step 2, how to assign a template to the custom post type that displays when that post type is viewed by a visitor.
You will need to complete step 1 before you can do this tutorial. If you need to do step 1, here’s a video tutorial for creating a custom post type without a plugin. For those of you who prefer plugins, here’s a video tutorial for creating a custom post type by using a plugin.
When you’ve completed one of those two tutorials come back to this tutorial and learn how to assign a specific WordPress custom post type template to the custom post type.
Find The Custom Post Type Name
The process starts in the dashboard.
We need to find the name of our custom post type. For instance, I have a custom post type named Products in the left-side admin menu.
When I click on the Products custom post type and the URL will change to this:
Yours will look similar.
The post_type is a URL parameter and wpll_product is the value of that parameter. The value is what we need for creating our WordPress custom post type template.
Here are some visual examples for clarity. The value for this example is wpll_product.
The value for this example is music.
Once you know the name of the custom post type, go to your hosting cPanel and open the file manager.
Inside the file manager navigate to wp-content > themes > find your active theme, and open it.
In my example, I’m using a child theme. In the child theme folder I don’t have the template files for pages or posts. The default WordPress template file for pages is always pages.php and for posts is always single.php.
Because I don’t want to work with a blank canvas, I’m going to the parent theme folder and copy the single.php file into my child theme (YouTube tutorial).
To do that go into the parent theme folder, find the single.php file and right click on it. In the context menu that appears click on copy.
In the dialog box that opens enter the path to the child theme folder and click copy file(s).
Now, go back to the child theme folder.
Find the single.php that you just copied there and right-click on it. From the context menu that appears click rename.
The name of the single.php has to be single-*name of your custom post type*.php. In the first case, the name is wpll_product. So the file name for this example would be:
Now any page that is created in the Product custom post type will use this template to display its’ content. This might seem a little confusing at first, this video on the WordPress hierarchy (YouTube tutorial) should help you wrap your head around how WordPress loads files.
By editing the single-wpll_product.php file inside your active theme or child theme, you will change the appearance of just this custom post type.
You do need to know PHP to custom the custom post type template.
Adding A Custom Post Type Entry
To see how this works, let’s create a new entry in the custom post type.
For my example, I will go to Products > Add New.
I’ll name it “Test Product” and then publish it. Here’s how it looks in the unedited custom post type template single-wpll_product.php
Notice the black footer bar in the example above.
I’m going to make that footer disappear. To do that I will open the single-wpll_product.php by clicking on it to highlight it and then choosing Code Editor.
If find the PHP function that calls the footer which is this:
And I comment it out so that the function does not execute by adding two forward slashes before the call like this:
For more details on how it’s done check out the video tutorial above.
Now I save changes to the file, go back to the Test Product page, and refresh it. Now the footer bar at the bottom is gone.
The footer disappeared only for the products custom post type. If you go to any other post, it is going to pull the single.php file from the parent theme and the footer will be there.
Just to give one more example to bring it home. Earlier I mentioned a second custom post type template example called Music. To create the template file for that custom post type I duplicate the single-wpll_product.php file and rename it to:
Now that specific template file will be called for any post in the music custom post type.
That’s all there is to know about assigning templates to custom post types. Now begins the hard work for PHP coding the output that you want for file. You can do that with the Advanced Custom Fields plugin, which is an awesome plugin. You can even add custom post types to RSS feeds once you’ve completed them.
For customizing your WordPress site further, make sure you subscribe to my WordPress Tutorials – WPLearningLab channel and click on the bell notification not to miss any of the useful WordPress tutorials.