Start learning with our library of video tutorials taught by experts. Get started
Viewed by members. in countries. members currently watching.
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.
If you've been following along, for the last two movies we've been talking about how to handle multiple custom post type templates. In the first method, we created separate template files for each of the custom post types. In the second one, we created one centralized file that contained conditional statements that tested which custom post type was being called. And then we used simple custom post type template files to call that one singular file. Now we're going to take that to its final extreme and turn the entire website on its head.
And I'll show you how that's done. The problem with the approach we did in the last movie was that we ended up with three files called content- recipes.php, content-videos.php, and content-photos.php that only did one thing. They all pointed to a third movie called custom-content. As a result, we have four different files that all do almost the same thing. It's kind of cluttered and it also fills up your theme with extra files that you don't need. The reason why we had to do it like that is because we needed to pick up each individual custom post type and point them to the right location.
However, there is another way of doing this, but you have to kind of turn your thinking upside down. What I mean by that is there's a fourth custom post type that we're dealing with that we haven't really talked about much. It's the one that's just called post. It's not really a custom post type because it's the default, but still it is a post type. The reason why we've been creating these content-recipes, content-photos, and constant-videos is because by default, WordPress will always fall back on the one that's just called content. And the one that's just called content applies to the content posts.
So what if we then instead of having the posts be the default content on our site, make our custom post types the default and make posts a special case? We can do that and it actually solves our problem very efficiently. So the first thing I'm going to do is create a new file that I'm going to call content-post. content-post will target the posts, so not the recipes, not the photos, not the videos.
just the regular posts in the site. Inside content-post, I need to put the content that would normally appear for posts. So I'll go into my 2011 theme, scroll down until I find the file that's called content-single. I'll open that, highlight all the code, copy it, I'll close this so I don't make any mistakes, and then just paste it into content-post. Just to make sure that I have the right template now, I'll put in a little comment here and then I can test a single post in my site.
You see that that comment appears, "This is the content-post.php file," which means it works for single posts. And if I go back to my recipes, you see it does not appear. So we're still where we want to be. The only that's changed is that we've made posts into a custom post type. That in turn means if we now change content-recipes to just content, this template should now be applied to all our custom post types.
So I'll close it and I'll go into my theme, find content-recipes, and just rename it to content. Now when I reload my recipe, I'm seeing the content file and I know that because if I reload a photo, I see the custom taxonomy information. So now I'll refresh this cooking folder so we can see what's there now and you'll see that instead of having the four files, content-recipes, content-photos, content- videos, and custom-content, we only have two: content-posts and just content.
And now we can apply those same conditional statements we did in the previous movie into our file, content, and apply it in the same way. So I'll open content, go to my Code Snippets, and find the first conditional statement, the one that tests for whether or not this is the recipes post type, I will go back, find my entry-meta- custom and delete what's already in content.php, and paste in what's in my code snippets. I'll save it.
So this is the recipes page and we should see no change. And I'll also test it for a photos page. And here we should see that the custom taxonomies are gone. And then I'll scroll down to find the footer entry-meta, go back to my code snippets, grab all the code all the way up to footer entry-meta, copy that, and replace this line, save it again, go back to a photo, reload it, scroll down to the bottom, and we now see the custom taxonomy information.
The same should have happened for videos down here. And just to be sure, the recipes should stay the same. With this, we have turned our WordPress site on its head. Now posts are handled as custom post types, at least in the templates, using this contents-post file, whereas older custom post types are handled as default content in this content.php file. It's a subtle change, but it makes it so that we only have two files to deal with and it's very clear what files do which operation.
I'm going to use this approach throughout the rest of this course and also apply it to index pages, as you'll see while we move forward.
There are currently no FAQs about Create an Online Portfolio with WordPress.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
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.