This website uses cookies

Our website, platform and/or any sub domains use cookies to understand how you use our services, and to improve both your experience and our marketing relevance.

WordPress 5.0 is out. Test all the great new features before upgrading your Live website. Read How!

Create a Custom Page Template in WordPress

Updated on  15th January

5 Min Read
creating custom page template
Reading Time: 5 minutes

One of the most important selling points of WordPress is the idea of themes. A single theme adds great value to the design and functionality of the website. However, there are websites that have different designs on different pages.

Unfortunately, several WordPress themes restrict users from altering layouts and functionality for a different page in the hierarchy. WordPress custom page template allows users to integrate custom requirements such as right/left sidebar on a particular page, an additional call-to-action functionality, or maybe a unique header for a particular landing page. Let’s dive in further to see how WordPress custom page template display different type of content.

Learn how Genesis Framework allows you to customize and create child themes from scratch in the WordPress environment.

A custom WordPress page template could be used for a number of purposes. Some ideas include:

  • Show recent posts of each category
  • Embed Google Map or any script
  • List of all authors.
  • Recently uploaded images
  • Custom design page for the portfolio
  • Contact page

The appearance of all the pages and posts that are created on a WordPress website is handled by a template file named page.php. Creating or editing a custom page template in WordPress requires basic knowledge of HTML, CSS, and PHP.

Simply open any text editor and paste the following code in it.

The above line of code tells WordPress that it is a template file called PageWithoutSidebar. You can use any name you want. Now save this file as PageWithoutSidebar.php. Again you can use any other name for the file. But don’t forget to keep the extension as .php

Now, we’re going to test our newly created template file.

Login to your hosting panel. In this example, I am using Cloudways – A WordPress Managed Hosting. Navigate to /wp-content/themes folder. Open your current theme folder and upload PageWithoutSidebar.php file there.

Navigate to Theme Folder

Go to WordPress Admin Panel > Pages > Add New. You can see the new custom page template listed on the right side.

Add new Page

Create a new page and set its template to PageWithoutSidebar. Once done, Publish it.

Page Without Sidebar

Open the newly created page. As there are no design elements in the template yet, a blank page like the image below is displayed.

Blank Page

This shows that the custom page template in WordPress is successfully implemented, hence you can create a custom responsive WordPress theme

It is now time to add a few lines of code to display the content of the page.

For this demo, I will discuss how you could customize the default Twenty Sixteen page template.

The default appearance of the pages is generated by page.php file located in /wp-contents/themes/YOUR THEME/ folder. Open page.php and copy this code.

Paste this code into PageWithoutSidebar.php just below this line of code.

Save it!

Your complete PageWithoutSidebar.php file will look like below.

Go back to your page and refresh it. You’ll observe everything is working in the way it does on the default WordPress Twenty Sixteen theme.

WordPress Default Theme

Now let us customize it. As you can see there is a sidebar on the right side. I will remove it from this page only. All other pages will have the default appearance of Twenty Sixteen theme.

Open the file PageWithoutSidebar.php file. Scroll down till the end of the file and remove:

This is the line of code that gets the sidebar on the page. After removing the line, save it. Open the page’s URL and the sidebar is no more!

Sidebar Removed

As you can see, the sidebar has been successfully removed from this page. However, the text alignment is not good. There is a blank space on the right side. The fix is to justify and extend the text to fill the screen.

Go back to PageWithoutSidebar.php and find:

Just change “ content-area ” to “ site-content-fullwidth” and you’re done. Refresh the page and the content is full width.

Wide Content Area

Still curious about why I have created a custom page template when I could have easily edited the page.php file? It’s quite obvious that if page.php file is edited, all the pages across the website would show the changes. In order to apply customized appearance on specific pages, custom page template in WordPress comes in handy. You can also define custom user role in WordPress in order to assign different privileges to users.

If you’ve any query, feel free to ask by posting in the comment section below.

Share your opinion in the comment section. COMMENT NOW

Mustaasam Saleem

Mustaasam is the WordPress Community Manager at Cloudways - A Managed WordPress Hosting Platform, where he actively works and loves sharing his knowledge with the WordPress Community. When he is not working, you can find him playing squash with his friends, or defending in Football, and listening to music. You can email him at mustaasam.saleem@cloudways.com

Be the first to check out WordPress 5.0

Use our Staging feature before upgrading your website to WordPress 5.0.

Get Our Newsletter
Be the first to get the latest updates and tutorials.

THERE’S MORE TO READ.