Build Your Own Business Website header image

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

Part 1 – Fundamental Elements of Genesis Custom Templates

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

Good evening everybody and welcome to lesson 5 of Customize Genesis Like a Pro. Tonight we will be talking about using custom templates in a Genesis child theme.

Create User Selectable Page Templates

One thing worth noting is that the template system in WordPress is kind of complex. Different kinds of templates do different things and what we’re going to learn tonight is how to create page templates.

When you create page templates it doesn’t affect posts and it doesn’t affect your archive pages. It’s only going to affect those types of pages that are user-selectable, that is when you are in a page.

On the admin side let’s go to Pages and choose All Pages from the dropdown. Let’s just edit this Finished Projects page so you can see what I’m talking about. Here then under Page Attributes you have this ability to choose a template. And tonight you are going to learn how to add templates to this list.

We’re not going to be discussing how to change an archive template or how to change a post template yet. We’re going to do that in the future so tonight is just about page templates.

Create Separate Files for Each Template

Let’s go over to NetBeans and look at what we’ve been working on in this customizing Genesis course up to this point. Here’s the custom-functions.php file and this is where we made all those widget areas in the previous lesson, Using Custom Sidebars in Genesis.

However, most of what we’re doing now we will not be doing in a custom-functions.php file. Instead we’ll be creating separate files for each template.

Where to Place the Template Files

That starts off by understanding where this template file should go. You can actually put it in the root of the child theme. However, I recommend that you put it in a folder in the root of the child theme. That way you are certain that when the child theme updates it doesn’t overwrite what you’ve created.

Template Folder Name

Let’s come over here to Enterprise Pro and say New Folder, the name of this folder needs to be my-templates. This is a folder that WordPress is looking for.

When WordPress is going about the process of choosing which template should be used, it first looks in the root of the child theme then it looks in a folder called my-templates in the child theme. Then it goes and looks in the root of the parent theme folder. So the templates that we create tonight we’re going to create and place inside of the my-templates folder.

Create New PHP File

So let’s go ahead and create a new PHP file. I don’t see PHP as an option here. My project is not letting me create a new PHP file. I must have this thing improperly configured so I’m just going to create a new empty file for the time being.

We’re going to start with the naming convention. Now, if you were to name it page_, at that point WordPress thinks of it as a special template so we are not going to create it that way. We’re not going to create starting with page.

We’re going to start off with custom-header-template.php. Because I’ve set up my project here such that it doesn’t recognize this, I really have to start with the opening PHP tag which is actually very uncommon.

If you do ever have to start a PHP file from scratch, the very first line needs to start with this opening php tag and there can be nothing above it and nothing else on that line. The second line is where the rest of your code goes.

Custom Page Templates Code

Next we’re going to add the bit that actually makes it clear that this is a template. Let’s go to wordpress.org to their codex and take a look at custom page templates, wordpress.org/Page_Templates. There’s lots of good stuff in here and it makes sense for you to review this.

We’re going to copy this piece of code here under Custom Page Templates and paste it in our file. We’re doing this because this code is fundamentally necessary in order for this file that we’ve created to be recognized as a template.

It’s not going to be “My Custom Page”. We’re going to call this one “Custom Header Template”. That’s really all that you need in order for this to be a template. You don’t really need anything else and in fact, you could go down here and say genesis() and this template is going to work just perfectly.

Upload the Template File to the Site

Now let’s go ahead and upload that file to the appropriate place, the site that we’re working on. Open up FileZilla and go to wp-content and then themes and enterprise-pro which is the one we’re working in.

Let’s scroll down here, you’re going to see we have this my-templates folder and I’m going to upload the my-templates folder. You can see the my-templates folder did get uploaded and there’s the custom-header-template.php.

What Make it a Genesis Template

Let’s go back to the site and edit this page. When we look under the default template, now we have the Custom Header Template here that we can choose from. So let’s choose that template and view the page. It looks exactly the same as it did before, right? And that’s because we’ve added this genesis() reference in the php file. That’s the thing that makes a Genesis template what it is.

You have the WordPress aspect of it and then in a Genesis template what you do is make changes to the base Genesis template system and then you add genesis() here. Then what happens is all these changes get made to the typical Genesis base and then the rest of Genesis proceeds.

So since there are no changes to this template, the page displays exactly the same way because we haven’t told Genesis to do anything special. We’re using a separate template but it doesn’t have any special instructions.

Save $200 on Membership Now!

Start learning today for as little as
$0.82 PER DAY!
THIS IS A LIMITED TIME OFFER!
Subscription Options
0 Comments… add one
0 comments… add one

Leave a Comment