Creating a Custom Page Template in WordPress: A Step-by-Step Guide with Example Code
A custom page template is a unique page layout that can be created in WordPress to display specific content differently from the rest of the pages on your site. To create a custom page template, you’ll need to create a new PHP file in your theme directory and include some basic code to define the page template.
Here’s an example code for a custom page template:
<?php
/*
Template Name: Custom Page Template
*/
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
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();
endif;
// End the loop
endwhile; ?>
</main><!-- #main -->
</div><!-- #primary -->
<?php get_footer(); ?>
In this example, we start by creating a comment block at the top of the file that defines the template name. This comment block is important because it tells WordPress that this is a custom page template.
Next, we include the header of our site using the get_header()
function. Then, we create a div
with an id
of primary
to hold our main content, and a main
tag with an id
of main
to define the main content of our page.
Within our main
tag, we use a while
loop to iterate through the content of the page using the have_posts()
and the_post()
functions. Inside the loop, we include the page content using the get_template_part()
function, which will load the content-page.php
file from our theme directory.
Finally, we check if comments are open or if there are any comments using the comments_open()
and get_comments_number()
functions, and if there are, we load the comment template using the comments_template()
function. We then close the loop and include the footer of our site using the get_footer()
function.
You can save this file as something like custom-page-template.php
in your theme directory and then select it as a page template when creating a new page in the WordPress editor.
Here are detailed instructions on how to implement a custom page template in WordPress:
- Create a new PHP file in your theme directory: Start by creating a new PHP file in your theme directory using a text editor such as Notepad or Sublime Text. You can name the file anything you like, but it’s best to give it a descriptive name such as
custom-page-template.php
.
2. Define the template name: At the top of your PHP file, add the following comment block to define the name of your template:
<?php
/*
Template Name: Custom Page Template
*/
?>
This tells WordPress that this is a custom page template and sets the name of the template to “Custom Page Template”.
3. Include header and footer: In your PHP file, include the get_header()
and get_footer()
functions to include your theme’s header and footer. These functions will automatically include the appropriate files based on your current theme.
4. Define content area: Create a div
with an id
of primary
to hold your main content, and a main
tag with an id
of main
to define the main content of your page.
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<!-- Your content will go here -->
</main><!-- #main -->
</div><!-- #primary -->
5. Loop through the page content: Use a while
loop to iterate through the content of the page using the have_posts()
and the_post()
functions. Inside the loop, include the page content using the get_template_part()
function, which will load the content-page.php
file from your theme directory.
<?php while ( have_posts() ) : the_post(); ?>
<?php get_template_part( 'template-parts/content', 'page' ); ?>
<?php endwhile; ?>
6. Add comments template (optional): If you want to allow comments on your page, you can use the comments_template()
function to load the comments template. This function checks if comments are open and if there are any comments, and if there are, it will load the comments template.
<?php if ( comments_open() || get_comments_number() ) : ?>
<?php comments_template(); ?>
<?php endif; ?>
7. Save the file: Save your file and upload it to your theme directory.
8. Create a new page and select your custom page template: In your WordPress dashboard, create a new page by clicking on Pages -> Add New. Give your page a title and select “Custom Page Template” as the page template under “Page Attributes”.
9. Add content to your page: Add your content to the page using the WordPress editor.
10. Publish your page: Click “Publish” to publish your new page with your custom page template.
That’s it! You should now have a new page on your site with a custom page template that you created.