Custom page templates in Wordpress - Mini Project: Build & Apply

Create a Custom Page Template in WordPress

📖 Scenario: You are building a WordPress website for a local bakery. The bakery wants a special page that looks different from the regular pages to showcase their seasonal products.

🎯 Goal: Create a custom page template in WordPress that displays a unique heading and a message. This template will be selectable when creating or editing pages in the WordPress admin.

📋 What You'll Learn

Create a PHP file with the correct template header comment

Define a unique template name in the header comment

Add HTML structure with a heading and a paragraph

Ensure the template can be selected in the WordPress page editor

💡 Why This Matters

🌍 Real World

Custom page templates let you create unique layouts for specific pages on a WordPress site, such as landing pages, portfolios, or special promotions.

💼 Career

Knowing how to create and use custom page templates is essential for WordPress developers and designers to build flexible, client-specific websites.

1

Create the template file with header comment

Create a PHP file named page-seasonal.php and add the WordPress template header comment with the template name Seasonal Products. The header comment must start with <?php and include Template Name: Seasonal Products.

Wordpress

<?php
/*
Template Name: Seasonal Products
*/

// Your code here

Need a hint?

The template header comment tells WordPress this is a custom page template. It must be at the top of the file.

2

Add basic HTML structure

Below the header comment, add the basic HTML structure with a <h1> heading that says Seasonal Products and a <p> paragraph with the text Welcome to our special seasonal collection!.

Wordpress

Need a hint?

Use standard HTML tags for the heading and paragraph inside the PHP file after closing the PHP tag.

3

Include WordPress header and footer

Add the WordPress functions get_header(); at the top after the header comment and get_footer(); at the bottom after the paragraph to include the site’s header and footer.

Wordpress

Seasonal Products
Welcome to our special seasonal collection!
<?php
// Add get_footer() here

Need a hint?

These functions load the common header and footer parts of your WordPress theme.

4

Save and select the template in WordPress admin

Save the page-seasonal.php file in your active theme folder. Then, in the WordPress admin, create or edit a page and select the Seasonal Products template from the Template dropdown under Page Attributes.

Wordpress

Seasonal Products
Welcome to our special seasonal collection!
<?php
get_footer();

// Save and select this template in WordPress admin

Need a hint?

After saving the file in your theme folder, check the page editor in WordPress to find your new template in the dropdown.