How To Create A Custom Page Template

There are times when we require our own custom page template. Maybe you want half width for certain pages or you want to design it according to your requirement.

We use custom page template to make some page or group of page behave differently from normal page.

The custom page template you create can also be used by multiple pages at once – which can be really handy in the long run.

To create a custom page template you need to create a new file on your themes folder. You’ll have to write Template name inside a PHP comment before you can start making your own custom page template.

Here’s the syntax:

<?php 
/*
 * Template Name: My Custom Page
 * Description: Write your description here.
 */

// Code to display Page goes here...

Once you save the file, you will be able to find it in the dropdown of Edit Page screen’s template.

There, you can choose your custom page template and assign it to pages as you wish.

The safe way to create your custom page template is to use copy of page.php file and edit it as required.

Below you can see live demo of how to create a custom page template:

First, here’s the page.php file of Catch Box theme which we will modify to create our own page template:

<?php
/**
 * The template for displaying all pages.
 *
 * This is the template that displays all pages by default.
 * Please note that this is the WordPress construct of pages
 * and that other 'pages' on your WordPress site will use a
 * different template.
 *
 * @package Catch Themes
 * @subpackage Catch_Box
 * @since Catch Box 1.0
 */
get_header(); ?>
				<?php while ( have_posts() ) : the_post(); ?>
					<?php get_template_part( 'content', 'page' ); ?>
					<?php comments_template( '', true ); ?>
				<?php endwhile; // end of the loop. ?>
		</div><!-- #content -->
        
		<?php 
        /** 
         * catchbox_after_content hook
         *
         */
        do_action( 'catchbox_after_content' ); ?>
            
	</div><!-- #primary -->
    
	<?php 
    /** 
     * catchbox_after_primary hook
     *
     */
    do_action( 'catchbox_after_primary' ); ?>    
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Now, as said earlier, for you to create your own custom page template, you’ll need to copy the above code (assuming that you use catch box theme. If not, use the page.php code of the theme you are using.) and create a new page template page-without-title.php. For which, the code will be:

<?php
/**
 * Template Name: Page Without Title
 *
 * Description: This is the template that display page wihout title
 *
 * @package Catch Themes
 * @subpackage Catch_Box
 * @since Catch Box 1.0
 */
get_header(); ?>
				<?php while ( have_posts() ) : the_post(); ?>
					<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                    
                        <div class="entry-content">
                            <?php the_content(); ?>
                            <?php wp_link_pages( array( 
                                'before'		=> '<div class="page-link"><span class="pages">' . __( 'Pages:', 'catchbox' ) . '</span>',
                                'after'			=> '</div>',
                                'link_before' 	=> '<span>',
                                'link_after'   	=> '</span>',
                            ) ); 
                            ?>
                        </div><!-- .entry-content -->
                        <footer class="entry-meta">
                            <?php edit_post_link( __( 'Edit', 'catchbox' ), '<span class="edit-link">', '</span>' ); ?>
                        </footer><!-- .entry-meta -->
                    </article><!-- #post-<?php the_ID(); ?> -->
					<?php comments_template( '', true ); ?>
				<?php endwhile; // end of the loop. ?>
		</div><!-- #content -->
        
		<?php 
        /** 
         * catchbox_after_content hook
         *
         */
        do_action( 'catchbox_after_content' ); ?>
            
	</div><!-- #primary -->
    
	<?php 
    /** 
     * catchbox_after_primary hook
     *
     */
    do_action( 'catchbox_after_primary' ); ?>    
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Edit, hack or modify it to create your own awesome custom page template.

Leave a Reply

Your email address will not be published.