Start learning with our library of video tutorials taught by experts. Get started

Create an Online Portfolio with WordPress

Creating custom post type templates


From:

Create an Online Portfolio with WordPress

with Morten Rand-Hendriksen

Video: Creating custom post type templates

At this point we've created three new custom post types with their respective custom taxonomies and we populated those custom post types with different types of content. But what's the point of having custom post types with types of content if we don't display them differently depending on what content is there? For example, if we are going to display the content, shouldn't we also be displaying the custom taxonomy information for each of them? This can be done very easily using a feature in WordPress that allows us to create custom templates for each custom post type.
Expand all | Collapse all
  1. 6m 28s
    1. Welcome
      58s
    2. Using the exercise files
      3m 54s
    3. Using the code snippets file
      1m 36s
  2. 8m 31s
    1. What is an online portfolio?
      2m 43s
    2. Tour of the finished project
      3m 15s
    3. Setting up a WordPress development environment
      2m 33s
  3. 16m 10s
    1. Creating site architecture
      5m 1s
    2. Creating a child theme
      6m 7s
    3. Creating an external file to manage functions separately from the theme
      5m 2s
  4. 25m 26s
    1. What is a custom post type?
      2m 14s
    2. Setting up a custom post type
      6m 39s
    3. Adding advanced variables to the custom post type
      3m 35s
    4. Advanced custom post type functionalities
      4m 29s
    5. Changing the menu position of the custom post type
      3m 19s
    6. Adding a custom post type icon
      5m 10s
  5. 22m 8s
    1. What are custom taxonomies?
      3m 34s
    2. Setting up a basic custom taxonomy
      2m 52s
    3. Hooking a custom taxonomy to a post type
      3m 13s
    4. Adding advanced variables to a custom taxonomy
      3m 9s
    5. Using hierarchical and nonhierarchical custom taxonomies
      5m 54s
    6. Using custom taxonomies in admin
      3m 26s
  6. 25m 40s
    1. Populating content into the custom post types
      10m 54s
    2. Uploading videos to YouTube
      2m 22s
    3. Embedding YouTube videos in a custom post type
      4m 23s
    4. Uploading videos to WordPress
      8m 1s
  7. 39m 47s
    1. Creating custom post type templates
      6m 50s
    2. Adding taxonomy info to the custom post type template
      9m 13s
    3. Creating conditional custom taxonomy links
      4m 46s
    4. Handling multiple post type templates: Individual templates
      6m 25s
    5. Handling multiple post type templates: Consolidating everything in one file
      6m 21s
    6. Handling multiple post type templates: Making custom post types the default
      6m 12s
  8. 15m 23s
    1. Creating an index page for a custom post type
      8m 10s
    2. Creating a custom taxonomy index page
      7m 13s
  9. 12m 3s
    1. Creating a custom footer sidebar template
      6m 58s
    2. Displaying a list of links to the latest custom post type posts
      5m 5s
  10. 14m 58s
    1. Creating static pages for the front and the blog
      4m 54s
    2. Populating the menu with new index pages
      4m 52s
    3. Creating a contact page with a contact form
      5m 12s
  11. 5m 55s
    1. Including the abstraction layer in other stock themes
      5m 55s
  12. 1m 22s
    1. Next steps
      1m 22s

Watch this entire course now—plus get access to every course in the library. Each course includes high-quality videos taught by expert instructors.

Become a member
Please wait...
Create an Online Portfolio with WordPress
3h 13m Advanced Sep 23, 2011

Viewers: in countries Watching now:

Learn how to build an advanced portfolio site that showcases various types of content using the free open-source application WordPress. Author Morten Rand-Hendriksen demonstrates creating custom post types, differentiating and classifying content with custom taxonomies, and working with custom post templates. The course also shows how to embed YouTube videos, build index pages, display the latest posts from different custom post types, and hook custom post types into separate themes. Exercise files accompany with the course.

Topics include:
  • Exploring online portfolios
  • Creating the site architecture
  • Incorporating advanced custom post type functionalities
  • Hooking a custom taxonomy to a post type
  • Understanding how hierarchy relates to taxonomies
  • Populating content into custom post types
  • Handling multiple post type templates
  • Displaying a list of links to the latest custom post type posts
  • Building static pages for the front and the blog
  • Creating a contact page with a contact form
Subjects:
Design Web CMS Web Design Projects
Software:
WordPress
Author:
Morten Rand-Hendriksen

Creating custom post type templates

At this point we've created three new custom post types with their respective custom taxonomies and we populated those custom post types with different types of content. But what's the point of having custom post types with types of content if we don't display them differently depending on what content is there? For example, if we are going to display the content, shouldn't we also be displaying the custom taxonomy information for each of them? This can be done very easily using a feature in WordPress that allows us to create custom templates for each custom post type.

By default, when you run WordPress and you open a post, let's say for instance the Pizza Primavera post, WordPress will use the standard single post template, the same one that's used when you open a regular blog post. But if we create a new file, we can target the recipes post type exclusively, and create a template that's only used for the recipes. To show you how this works I am going to open this Pizza Primavera and I am also going to open one of my photos.

As you see right now the photos and the Pizza Primavera story both look pretty much the same. They have the same elements in them and they have the same layout. What I am going to do now is create a new template that only targets the recipes, so this Pizza Primavera story. I will go into my code editor and under cooking I will create a new file and call it single-recipes.

In this file I need to put in some dummy content, so I will say echo "I am the template file that displays Recipes", end the line, and then end my php delimiter. When I save this and go reload the At the Market photo page, nothing happens. Everything is normal. But when I reload the Pizza Primavera page which lives under the recipes custom post type, we now only see "I am the template file that displays Recipes." That's because we are now using that custom template file and it doesn't have any other content than that line of text.

This is the core way of targeting a specific custom post type for single templates. However, when you are creating a child theme from something like the twentyten theme or the twentyeleven theme you have to do a bit more, and I will show you why. If we go to the twentyeleven theme and we scroll down to the file that calls up single post templates, the one that's called single.php, you will see that inside this file there is a call down here on line 23 that says get_template_part.

This is where the whole loop is going to appear, but instead of having a loop inside the single.php file, it's instead calling a different file within the template that's called content-single and if we scroll up, you will see that here's the file called content-single. There are also a lot of other content files. We have content-aside, content-featured, content-gallery, image, intro, link, page, quote, single, and status as well as one file that's just called content.

This is done to make it easy for people who manage the site to target specific loops rather than the entire page. So the page template here displays the header with the title and everything and displays the footer and then all we are changing is the loop in the middle that actually displays the content for that page. So if you want to make a different loop and you only want it to appear for a custom post type and you are using twentyeleven as your parent theme, rather than creating the single-recipes file you would create the content-recipes file.

But it's not that simple. We still have to make one more change, because as you can see it says get_ template_part content and single. What we needed to do is go test for what custom post type we are using right here. So what I am going to do is grab all the content from the single.php file found under twentyeleven, I'll copy it, then I will go to cooking, create a new file, call it single.php. This file will now override the parent theme, sngle.php, and then I will paste in all the content from the original single.php and go in here where it says get_template_part and take out single and replace it with a function that returns the name of the current custom post type.

That function is get_post_type. If I now save this, delete the single-recipes file, and instead create a new file that I call content-recipes and within it echo a new message, "I am the content template for Recipes," end it, and end that, when I now reload the single page for the Primavera Pizza, which is under the recipes content type, and we will now see the general layout but instead of the loop we just have this text, "I am the content template for Recipes." I will go back to my theme, find the parent theme, in this case twentyeleven, and find the appropriate content template.

In this case it's the one that's called content-single. So I'll open this file, highlight all the content and copy it, go into my content-recipes file, and replace the dummy content with what I just copied. Just to make sure that we are still getting this template and not something else, I will put in a small little div here and just say "I am the content-recipes.php file." I will save this and when we reload this page we should see that new comment I added plus the actual content for the recipe. And we do.

"I am the content-recipes.php file" and here we have the entire recipe. That means we are now at a point where we are working with a template that targets just the recipes content for single pages and we can now make changes and add the stuff we need to add.

There are currently no FAQs about Create an Online Portfolio with WordPress.

Share a link to this course
Please wait... Please wait...
Upgrade to get access to exercise files.

Exercise files video

How to use exercise files.

Learn by watching, listening, and doing, Exercise files are the same files the author uses in the course, so you can download them and follow along Premium memberships include access to all exercise files in the library.
Upgrade now


Exercise files

Exercise files video

How to use exercise files.

For additional information on downloading and using exercise files, watch our instructional video or read the instructions in the FAQ.

This course includes free exercise files, so you can practice while you watch the course. To access all the exercise files in our library, become a Premium Member.

join now

Are you sure you want to mark all the videos in this course as unwatched?

This will not affect your course history, your reports, or your certificates of completion for this course.


Mark all as unwatched Cancel

Congratulations

You have completed Create an Online Portfolio with WordPress.

Return to your organization's learning portal to continue training, or close this page.


OK
Become a member to add this course to a playlist

Join today and get unlimited access to the entire library of video courses—and create as many playlists as you like.

Get started

Already a member?

Become a member to like this course.

Join today and get unlimited access to the entire library of video courses.

Get started

Already a member?

Exercise files

Learn by watching, listening, and doing! Exercise files are the same files the author uses in the course, so you can download them and follow along. Exercise files are available with all Premium memberships. Learn more

Get started

Already a Premium member?

Exercise files video

How to use exercise files.

Ask a question

Thanks for contacting us.
You’ll hear from our Customer Service team within 24 hours.

Please enter the text shown below:

The classic layout automatically defaults to the latest Flash Player.

To choose a different player, hold the cursor over your name at the top right of any lynda.com page and choose Site preferencesfrom the dropdown menu.

Continue to classic layout Stay on new layout
Welcome to the redesigned course page.

We’ve moved some things around, and now you can



Exercise files

Access exercise files from a button right under the course name.

Mark videos as unwatched

Remove icons showing you already watched videos if you want to start over.

Control your viewing experience

Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.

Interactive transcripts

Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.

Thanks for signing up.

We’ll send you a confirmation email shortly.


Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from lynda.com.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

   
submit Lightbox submit clicked