Start learning with our library of video tutorials taught by experts. Get started
Viewed by members. in countries. members currently watching.
Create a child theme based on an existing parent theme in WordPress and change the functionality, presentation, or styling of your website. In this course, author Morten Rand-Hendriksen shows how to use the default WordPress theme, Twenty Twelve, as a basis for a new child theme and add custom menus; new headers, sidebars, and footers; and index pages with widgets and pagination to your site. The course also demonstrates how to add a responsive welcome message to your front page using PHP and jQuery, and how to edit the many templates found in a WordPress theme. Morten explains how to perform these changes using any code editor, the developer tools in the Chrome browser, and WordPress.
WordPress has multiple different index templates that kick in when different indexes are called, the most notable-- and the ones you should see in pretty much every WordPress theme--are index.php, category.php, tag.php, and archive.php. The names are self-explanatory. Sometimes you want different index pages to appear differently in your sites. I often find that while on the main index page it makes sense to have longer versions of the posts, with images and full text, on category and archive index pages it makes more sense to have shorter versions and maybe no images.
This can be accommodated by calling for an excerpt instead of the content of a post when the category or archive templates are used. If you look at the site the way it is now, you can see that on the front page, or the main index page, we have the full post, web images, and if there's a featured image, the featured image appears at the top. If we go to the category archive page, we'll see the exact same thing. Here we have the full post with images, and if there is a featured image, it's featured at the top. What I want to do is make the content of a post into just an excerpt, and I also take want to take away the featured image.
In a previous movie we looked closely at index.php template. Now we are going to look out the category.php template instead, to find out what we need to change to make the content into just an excerpt. So I'll open the category template and take a look at content within the category template. And here you see, just like with the index template, that we have a loop. It looks for all the posts and then displays each post using that same template file, content.php. So because we want to change the content from a full content into the excerpt, we have to change that in content.php.
I've already made changes to content.php in my child theme already, so I'll keep making changes to the same file in my child theme. I'll open it in my code editor and then I do find where I should make the changes. When I scroll down here, you'll see that under all the header information I have the section here. It starts with is_search and then it shows the_excerpt, if this is_search page, and otherwise it shows the_content. What you're seeing here is that we already have a conditional statement, this if statement, that tests whether or not this is a search archive, and then it displays the excerpt.
So what I need to do is add some conditions to the conditional statement so that we can test for more than just a search archive. Fortunately for us, just like pretty much everything else in WordPress, this has already been kind of taken care of for us. There are conditional tags available that can test for all the things that we want to test for. There is a conditional tag for Category Pages. It's simply is_category. There's also one for Tag Pages, is_tag. There is one for Archive Pages, is_archive, and so on. I think you see the pattern here.
So what we need to do is add these conditionals into the existing conditional statement in the template. It already says if is_search, so I am just going to append the other conditionals after that. What I want to say if(is_search) or-- and or is signified by two pipes like this--is_archive(), or is_category(), or is_tag().
With the change made, I'm going to save the template, go back to my browser, and reload this Category page. And you'll see that now, instead of the full content, we just have an excerpt for each post, which means we can see far more posts in a smaller page. But I also said I wanted to get rid of the featured image, because you can see the featured image still takes up quite a lot of space. To do that I am simply going to copy this existing conditional statement and append it to where the featured image is inserted. So I'll copy the entire statement, and then I'll find the featured image, which is all the way up here at the top. Right under have the_post_thumbnail.
And I need to wrap the_post_thumbnail in this conditional statement, so I'll paste the statement in. Now all we have to do is end it so that the conditional stops, lets say And now what I'm doing is I'm saying if this is search archive, an archive, a category archive, or a tag archive, then display the_post_thumbnail, which is exactly opposite of what I want to say. So what I need to do is reverse the statement so that we change it from saying it this is search to say if this is not search or is not archive, et cetera.
To do that I am going to wrap the conditional statements in another parenthesis, and I am going to put an exclamation point in front of it. So now we're saying if it's not one of these conditionals then show the_post_thumbnail. I'll save my new template and reload the page again and you see that now the featured images appear, and we have a much shorter category archive page. But when I go to the front page, you still have the is images, the full stories, and the featured images.
Here again you see an example of how rather than making huge changes and building things from scratch, we can reconfigure existing functions and just move them around to get completely different results.
Find answers to the most frequently asked questions about WordPress 3: Building Child Themes.
Here are the FAQs that matched your search "":
Sorry, there are no matches for your search ""—to search again, type in another word or phrase and click search.
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.