Be sure and review my post, The Main Index For Building Your Web Page Output In WordPress, before watching the video.
And also my post, Connecting The Templates.
Customizing WordPress #4 – Creating Page Templates 7:51
LevelUpTuts
Published on Mar 6, 2014
The 4th video in the Customizing WordPress tutorial series. Here we show you how to create a re-useable page template or override an individual page template.
This is how to make a custom template for a particular page.
0:10 In this video, the author uses as the example the About Us page – that is, how to change only that page.
0:20 In this example, we want to get rid of the side bar but just in this page.
So on the about us page we inspect the sidebar element.
0:32 And so in Chrome Tools we find that the side bar lives in <div id=”secondary”>…</div>.
And we can click on it and it disappears but only in our Chrome Tools window.
We haven’t actually changed the code in the file.
1:00 So we have a modification that needs to be made but only to the about us page.
And in the last video we showed you how to copy a template and place the copy in the child theme and make changes that will over ride that template in the main theme.
1:20 We’re going to do the same thing for this but we’re going to change the template’s name slightly so that it only affects the about us page.
1:35 Because we’re modifying a page you can probably guess that our page.php is going to be our best guess of the what template file to modify.
1:41 And here is the 2014 theme’s page.php:
1:55 So we’re going to copy our page.php file into our child theme folder just like we did before.
2:00 Now we’re going to come into our text editor (I use notepad++ which is a free download) and open up the file and to make sure we’re using the correct file, we’re going to through TEST into the file to make sure we have the right file (line 26 of the file):
And so here is Our TEST on the page:
2:42 – 3:00 But we only want our TEST to display on the About Us page and right now it displays on Sample Page and Donations also. Now it is not on the home page or any of these individual posts because these are using different templates.
3:00 So now we want our TEST to only show up on our about us page.
3:42 – One way we can do this is by changing the name of our file in the child theme folder from page.php to page-about-us.php. Now WordPress will only use this file for the About Us page. So when we refresh our page– now TEST is on About Us but is not on Sample Page or Donations when we check them.
4:14 – So now we know that we are targeting specifically the About Us page. And now you’re wondering — how can we make a template that targets more than one page?
4:25 – It is really easy to do. And here’s how we do it so the template can be used to target more than one page: We’re going to rename our page-about-us.php in our child theme folder to another name (since we want to get rid of our sidebar in this example) we’re going to rename the file page-no-sidebar.php and we’re going to save the file as that name.
4:55 So now we go to the top of the file and on line 3 we’ll type Template Name: No Sidebar:
5:21 – So if we want to remove the sidebar we go to the sidebar and right click and hit inspect. And we see that it starts just below the ending of Main Content below:
5:35 So we go to our template file in the child theme, page-no-sidebar.php and we go down to the bottom of the file and we see (below) the end div of main content and we see just below it get_sidebar.php
5:46 So now delete that line (line 48). And we hit save. And then we hit refresh and we see (below) that none of our pages including About Us have gotten rid of the left menu. How come?
6:00 The reason the template isn’t removing the sidebar is because we renamed it page-no-sidebar.php. So we need to come over to Edit page for About Us and we click on Template and we see that we can now choose the template No Sidebar (or whatever you named your template) and click on update (below).
6:20 And when we refresh our About Us page we now see that the sidebar is gone.
6:30 And we can do the same thing for Donations and Sample pages. Just go to the Edit page, choose the No Sidebar template and hit update. And that’s how you do it!
