How to Create a Custom Page in WordPress
When you first start with wordpress, the system will provide you with default page layout which will be the “Master Template” of your website. The template page will hold and arrange all the content from blog, article, sidebar, header and footer. Customizing the Page templates in WordPress is a great way to add structural variations or highly customized functionality and design to your website. Custom WordPress page templates are easy to create and simple to modify. Follow the 2 steps bellow to start structuring your page layout as you wish
-
Create a Custom Page in WordPress
First, we need to add a file which tells WordPress that this is a page template, and it should be recognized as CustomPagedesign.. To do this you’ll need to open a plain text editor like Notepad or Notepad++ on your computer. In the new file add this line of code below:
<?php /* Template Name: CustomPagedesign */ ?>
You can name your template anything you want as long as you can recognize it. Once you have added the code, save the file to your desktop as fellow, custompagedesign.php.
When you are saving a file to embed in WordPress core code, make sure that it ends with .phpextension.
Now, you need to upload this file to your website directory, you can do this using an FTP client or through File Manager from your Cpanel dashboard, locate your current theme or child theme folder. You will find it in /wp-content/themes/ directory. Next, upload template file to your theme directory.
Now you need to login to your WordPress admin area to create a new page or edit an existing one.
On the page editing screen, scroll down to ‘Page Layouts’ section, and you will find a template drop down menu. Clicking on it will allow you to select the template you just created.
Now click on preview page to view the changes, you’ll find a blank page. This is not an error that’s because your template file is doesn’t contain any structure for wordpress to render.
Don’t worry, I’ll this was just the first step. I willshow you how to easily edit your custom page template.
-
Edit Your Custom Page Template
You can customize your page by adding any HTML, template tags, or PHP code in this file.
You should know that the custom page template is like any other theme file in WordPress, so the easiest way to get start is by duplicating an existing page template provided by your theme. Now
Open your FTP client and go to your theme folder, and download a file called page.php to your desktop
Open the page.php file in a plain text editor like Notepad++, and copy all its content except the header part, We will not copying it, because our custom page template already has one.
Now you need to open your custom page template file and paste it at the end.
Your custom page file would now look something like this:
<?php /* Template Name: CustomPagedesign */ ?>
<?php get_header(); ?>
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<?php
// Start the loop.
while ( have_posts() ) : the_post();
// Include the page content template.
get_template_part( 'template-parts/content', 'page' );
// If comments are open or we have at least one comment, load up the comment template.
if ( comments_open() || get_comments_number() ) {
comments_template();
}
// End of the loop.
endwhile;
?>
</main><!-- .site-main -->
<?php get_sidebar( 'content-bottom' ); ?>
</div><!-- .content-area -->
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Save the file and upload it back to your theme, now you can view the page you created using custom page template. It will now look exactly like your default theme pages.
You can now continue editing your custom page file, and customize as you want. For example,you can add custom PHP code from wordpress codex, add any HTML you want, you can add/remove sections.
Don’t forget to add content by editing the page in WordPress page editor screen. You can also leave the content area in page editor completely empty, and add custom content directly in your page template.
