If you want to set a different layout for one (or more) of your pages, it’s a good idea to create a WordPress custom page template. This also enables you to apply your template to other pages quickly and easily. However, you might not know how to do this in WordPress.
Fortunately, there are two relatively simple methods to create a custom template. For beginners, it’s best to use a page builder plugin like 🚧 Elementor. Or, for more experienced users, you can create a custom template manually 🧑💻 by editing the page.php file.
Let’s get started!
Why create a WordPress custom page template
When you add a new page to your website, the page inherits the layout and design from your current WordPress theme. In this instance, the template is applied using the page.php file, which affects all of your single pages.
However, there are times when it makes sense to use a different template for certain web pages. If you have a portfolio website, you might want to make the layout slightly wider than your other pages.
Meanwhile, your usual page template might not work for sales and landing pages if you want to include a captivating call-to-action section or display a large hero image. While you can tweak your current page template, this can be time-consuming. Plus, you’ll be limited by the page.php theme file.
Additionally, a WordPress custom page template is useful if you want to apply the template to multiple pages. For instance, once you’ve designed a custom template for a landing page, you can then use the layout across all your landing pages without manually tweaking every page.
How to create a WordPress custom page template (2 methods)
Now that you know why it’s a good idea to create a WordPress custom page template, let’s take a look at some methods to achieve this.
1. Create a page template with a page builder (Elementor) 🏗️
If you’re using the free version of Elementor, install the plugin directly from your WordPress dashboard. Then, head to Templates and click on Add New:
Next, choose the type of template you want to create, like a landing page or a container. Give the template a name and select Create Template to open the Elementor editor:
Here, you’ll find a selection of elements stacked to the left of the page. On the right, you can see a live preview of your layout.
First, click on the Settings icon in the bottom left corner and locate the Page Layout dropdown:
By default, this option will be set to Elementor Canvas, which is a completely blank page. Instead, you can select a full-width layout or inherit the page layout from your theme.
Or, if you’re using Elementor Pro, you can click on the folder icon in the editor to access a pre-made section or page:
This is also how you’ll access any templates that you create with Elementor.
Now, you can customize the layout using basic elements like buttons, images, and headings. Or, if you’re using Elementor Pro, you can access more advanced options like portfolios, carousels, and menus.
Once you’re happy with the design, click on the arrow besides the Publish button and select Save as Template:
Give your template a name and click on Save.
You can apply this layout to your other pages through the Elementor editor. In this instance, select the folder icon in the editor and go to My Templates:
You can preview the layout first, or click on Insert.
2. Create a page template manually 👨💻
If you’re a more experienced user, you can create a WordPress custom page template manually. To do this, you can use the default theme template as the basis for your custom layout.
However, it’s important to note that some themes are more compatible with the WordPress directory structure. Meanwhile, other themes handle everything through a single file.
Therefore, if your theme doesn’t have a separate page.php file, it’ll be very difficult to create a custom template manually. If this is the case, you’ll be better off using the first method in this article.
To get started, you’ll need to use an FTP client like FileZilla to connect to your site files remotely. If you haven’t done this before, you can access your FTP credentials through your hosting account.
Then, locate the root folder of your site (usually labeled public). Open the wp-content folder and go to themes → templates.
Now, find the theme template you want to change, right-click on the file, and select Download:
Once you’ve downloaded the template to your computer, it’s a good idea to rename the file something like “custom-page-template.php.” Now, you’re ready to customize the template.
How to customize the theme template
To customize the default theme template that you’ve just downloaded, open the file. Now, the first thing to do is to change the
Template Name to something descriptive. An example:
This is what will display in the dropdown menu when you assign a WordPress page to the template in the editor.
Now, you can make any other customizations that you wish. For example, you might want to remove components like the header or footer. In which case, simply remove the line(s):
Alternatively, you can use a custom header or footer for your page template by changing their calls inside the file to use modified files. In this case, you could use the following code:
Additionally, you could also include a call to a widget area to display a custom message at the top of your page. You would have to create the call inside your theme’s functions.php file. However, then, you can add the following line to your page template file:
<?php dynamic_sidebar( 'announcement' ); ?>
What’s more, if you want to change the page width, simply adjust the
content-area code to
site-content-fullwidth. Once you’re happy with the changes, you’re ready to re-upload the file via FTP.
You can either place the file directly in your root folder. Or, if you plan on creating multiple custom templates, you might want to create a separate subfolder.
Now, in the WordPress editor, you should be able to find your custom template on the sidebar when working on a new page:
Go to the Template section and use the dropdown to find your custom template.
All new pages inherit the layout from your active theme. However, there are times when you might want to create a custom template for landing pages, blogs, or portfolios. Then, you can easily apply this template to other pages on your site that require the same formatting.
To recap, here are the methods to create a WordPress custom page template:
Do you have any questions about how to create a WordPress custom page template? Let us know in the comments below!
4 Essential Steps to Speed Up
Your WordPress Website
Follow the simple steps in our 4-part mini series
and reduce your loading times by 50-80%. 🚀
This content was originally published here.