Create A New Template For WordPress Page
Posted by in PHP May 28, 2011 5 Comments

Let’s say that you want to create a new WordPress page which its layout does not look like any post/page template and you’re thinking how to create a custom page template for WordPress. This article will help you know how to do that.

As you know, the files defining each Page Template are found in your Themes directory. To create a new Custom Page Template for a Page you must create a file. Go to the directory where you installed WordPress then go to the theme directory. It usually looks like this: “/wp-content/themes/twentyten/” where “twentyten” is your current theme name.

You need to create a new file or duplicate the page.php file there. Let’s call our new Page Template for the custom Page “page-without-sidebar.php”. At the top of the page-without-sidebar.php, put the following:

<?php
/*
Template Name: Page No Sidebar
*/
?>

The above code defines this page-without-sidebar.php file as the “Page No Sidebar” Template and the Template Name: Page No Sidebar is the name that will show up in the Template drop down list when you create/edit a page.

In the custom page, we don’t need the sidebar, so next step you need to include the header and footer and add some HTML as your design.

An example of a new custom Page

<?php
/*
Template Name: Page No Sidebar
*/
?>
<?php
get_header(); ?>
 
		<div id="container">
			<div id="content" role="main">
			  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam sapien tellus, viverra vitae sollicitudin sed, tincidunt et elit. Vestibulum volutpat metus ac risus porta eu ultricies tellus pretium. Vestibulum ante nisi, interdum sed varius in, mattis vel nisl. Integer venenatis eros et dolor sollicitudin tincidunt. In hac habitasse platea dictumst. Aliquam venenatis interdum felis, ac placerat leo pharetra sed. Cras ullamcorper feugiat sapien sodales commodo. Fusce nisi libero, hendrerit rhoncus vulputate in, gravida sit amet urna. Vivamus vehicula ullamcorper felis, sit amet varius nunc feugiat non. Ut tristique ligula vel ligula fringilla tempor.</p>
			  <p>Praesent in viverra risus. Suspendisse fringilla tellus vel ante tempus tempor. Aliquam et mi sed velit luctus volutpat non eu augue. Maecenas ut metus lobortis nulla lacinia pellentesque. Vivamus ac enim ut ipsum sodales sagittis quis pellentesque lectus. Fusce et porta mi. Nunc orci purus, varius a tincidunt sit amet, sagittis non justo. Ut posuere lobortis enim vel condimentum. Donec lectus erat, ultrices eu hendrerit a, convallis pretium leo. Vestibulum venenatis, quam eget feugiat scelerisque, nibh nisi cursus nulla, quis sodales augue nisi eu quam. Nullam in lorem diam, id interdum elit. Nunc sit amet dolor ac dolor volutpat viverra non sed magna. Aliquam posuere rutrum bibendum. Duis lobortis bibendum nisi sed ornare. Suspendisse mollis consectetur lectus ac suscipit. Morbi et nisl at erat congue commodo vitae non urna. Mauris vitae eleifend erat. Nunc molestie nibh a magna pellentesque et sollicitudin justo pellentesque. Nunc quis lacus sit amet metus ultricies consectetur ac quis dolor. Nullam sapien purus, tempor accumsan ultricies nec, sollicitudin sit amet turpis.</p>
			</div><!-- #content -->
		</div><!-- #container -->
 
<?php get_footer(); ?>

Creating a new page based on the new custom page

Now, your new custom page is ready, this step will create a new page from that template. You need to log in to the WordPress admin and add a new page then assign your new template to it.

WordPress Create New Page Template

WordPress Create New Page Template

As you see, in the Page Attributes panel, in the Template drop down list, there is an item called Page No Sidebar. It’s the Template Name we set in the page-without-sidebar.php template page file above.

You shouldn’t add anything in the WordPress editor, let’s leave it blank, content of the page should be controlled in the template file.

Hoan Huynh is the founder and head of 4rapiddev.com. Reach him at hoan@4rapiddev.com
  • Pingback: Add WordPress Login Form On Sidebar Or Custom Page | 4 Rapid Development

  • Pingback: How To Change Default Hom Page Of WordPress | 4 Rapid Development

  • Amber Goodwin

    Hopefully you are still following this as I have a question to ask you about your post. As informative as it is, I am currently making a website through wordpress for my friend to edit. She has no knowledge of HTML & CSS and wont be able to do these edits without me, and wants to be able to do all these content changes by herself. Do you know of a way that this can be done dynamically?

    My programming isn’t the strongest so I’m finding this task very difficult. Any help or comments would be appreciated.

    • hoanhuynh

      Hi Amber Goodwin,

      From my understanding, your friend is free to manage her articles; meaning she can create new content or modify whatever she wants. Regrading the HTML & CSS stuffs, I think they’re related to template which is created from the beginning and she don’t need to modify it in a period of time.

      Not quite sure about your concerns and let me know if anything I can help.

      H2.

  • Amber Goodwin

    I appreciate the reply. What I was trying to go for was a bit of coding into the template so she wouldn’t have to edit the backend script. If that makes any sense. I found a snippet of code from the twentyten theme and migrated it over to allow for what I wanted my final result to end up acting like.