Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
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.
Earlier in this course I talked briefly about widgetized areas and sidebars. Now we're going to take a look at how you can add new widgetized areas to your site. One reason you may want to do this is if you want to offer up different widgets on your pages from those that are on your index and single posts. To add a whole new widgetized area we first have to add to the existing function that creates widgetized areas and then we have to add that area to a new sidebar file, or somewhere else. In our functions.php file you find the function that registers the sidebars at line 195.
It's called twentytwelve_widgets_init, and in it you have three instances of this register_sidebar function. What we want to do is add another one of these functions with our new sidebar. So I'm simply going to copy this register sidebar array out and then I'm going to go to the functions.php file in my child theme and I'll use this original my child theme setup function and I'll just put the new widgetized area in here. So I'll paste the code in. I'll also add a comment at the top-- New widgetized sidebar area for pages-- and then I need to change some of these values so that it appears as a different sidebar.
So I'll call this one Page Sidebar and I'll change the ID to the sidebar-4 and then I'll change the description here so that it says, Appears on pages only. I'm going to leave the rest the way it is and then I'm going to save functions.php, go back into my site, and go to Widgets. Now you see I now have the page sidebar here at the top as an option, in addition to the main sidebar, first front page, and second front page.
And I can populate Page Sidebar if I wanted to. I'll put in Categories and Archives and then I'm going to go back to the front page and go to a single page, and nothing changed. That's because I haven't put in the new sidebar anywhere, so we're still seeing the original sidebar. What I need to do now is create a new custom sidebar template. You learned how to do that earlier in the course, but I'll repeat it now so you can see how it works. I will go and grab the sidebar.php file and copy it into my child theme.
I'll give it a new name. So I'll call this one sidebar-page. And this is really important, because that's how we're going to call it. Then I'll open sidebar-page in my code editor and change what sidebar is being called. You will remember I gave this sidebar the named sidebar-4, so I'll change this to sidebar-4. Then I can save it, and then I have to make one more change. I now have to change my page template to call this new sidebar-page template. So I'll go back to the parent theme, find my page template, copy it into my child theme, open it, scroll down to the bottom where the sidebar is being called, and add the value.
So now it says get the sidebar page that's called sidebar-page, which is this one, and this one in turn calls my new sidebar, as defined in functions.php. I'll save page.php, reload my page in the browser, and now you see that the sidebar changed for this page. But if I go back to the homepage, the sidebar is the same as it was before. Widgetized areas are extremely powerful because they allow you to add advanced content in a very simple way, through the Widgets Admin panel.
Though widgets are most commonly found in sidebars and footers, you can actually put a widgetized area anywhere you want. Now that you know how to do it, you can knock yourself out putting widgetized areas anywhere. Just remember that you have to link all these files together like you saw to make it all work.
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.