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:

  1. 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.

wordpress