Confessions of a Six Figure Professional Blogger

How To Use a Custom Page Template In Wordpress

View Comments | Posted In Technical by David

Sometimes, it is useful to give a particular section or page of your blog a completely different look and feel from your regular blog theme. It is very easy to do in Wordpress.

For example, over on PCMECH I wanted to have a sales page for our premium program. I wanted to make it long-form style and without the usual clutter of the main site theme. As I have stated in the past, when you are in selling mode on your site, you want to get your reader to read the offer and make a yes/no decision. Having a top and bottom menu and a full sidebar is a lot of distraction and a lot of potential ways out of your sales letter without them making a choice on your offer. The solution is to remove all the clutter.

My sales page at PCMech is set up as a page in Wordpress. That page, though, uses a completely custom template just for that page. The “how” is actually pretty easy…

Creating a Custom Page Template in Wordpress

All Wordpress themes have a file called page.php. This is your template file for all pages you have on your blog (remember, pages are distinctly different than posts). The page.php file is your default page template. To create a new one, just open that file in any text editor then “save as” a different file name. In my case, I named the template for my sales page signup_page.php.

Now, at the very top of this new file, you’re going to want a block of PHP code as follows:

<?php
/*
Template Name: [your page name here]

*/
?>

Picture 1This is a PHP comment. Leave the “Template Name:” in place, but you need to change the name of the page. Once you have done that, upload this new file to your blog theme’s folder.

Then, in Wordpress, when you go to add or edit a page, scroll way down and you’ll see a setting for “Page Template”. You should see your new page template listed in the dropdown, using the name you entered above. To the right, you can see what my dropdown list looks like in my own Wordpress admin panel. I have many different custom page templates in my system, all for different purposes.

Customizing Even Further

At this point, you would have a custom page template, but it would be an exact duplicate of your default page template. So, you would need to customize it. For example, if you want to get rid of the sidebar, just remove the the following line from your template:

<?php get_sidebar(); ?>

You can change any other HTML in this file that you want.

If you want to include different a different header, you would need to hack the code just a bit. By default, the get_header() and get_footer() functions include the default headers and footers for your theme. However, you can replace these with custom PHP includes to any file you want. For example, you could replace:

<?php get_header(); ?>

with this:

<?php include(“header_new.php”); ?>

This would include the file header_new.php from your theme as your header. You would, of course, need to create a file called header_new.php and alter the HTML to make that your new header file for that page.

You can do this same thing for your footer or even your sidebar if you want to include a different sidebar.

Wrapping It Up

The Wordpress template system is insanely customizable once you know how to do it. Above is how I have gone about it for my sales page. I have a custom page set up, and it includes a custom header and custom footer (both with stripped down options). I left the sidebar out. In my case, I even put the HTML for the content of the page into the template itself. Inside of Wordpress, the content field is blank. I just selected the custom page template, saved the page, and now my signup page works quite well.

Repeat the same basic process for any page of your blog that you want to have a custom appearance. It is so much easier than trying to pack complicated HTML into the editing field of Wordpress.

Happy customizing!

If you enjoyed this article, you might also like...

  1. Creating a Custom Blog Homepage [Wordpress]
  2. How To Replace Your Wordpress Search With Google
  3. Solution – Wordpress Theme Reverts to Default (Kubrick)
  4. How To Leverage Your “Money Posts”
  5. How To Do A Custom Login Box With Wishlist Member
Six Figure Blogger Blueprint

Get your copy of the Six Figure Blogger Blueprint.

You'll Discover...

  • 3 vital questions to pick the right niche.
  • The layout for funneling traffic into your blog.
  • How this blog generates thousands of dollars monthly - without a single banner ad.

Your information will not be shared with anybody - ever.

  • Jwewrite
    Freak! Thank YOU. The other information I got was much more convoluted than this! So simple and it works without a hitch.
  • Ben
    I used this article to add an advertisment into the footer of a page using a Max Banner Ads Pro banner for an individual page sponsor to my site as MBP doesnt support individual page selection. Thanks for your help.

    PS: If there's an easier way using MBP then let me know!! ;-)
  • johannabartley
    Wordpress isn't easy to manipulate or it isn't for me at least/ I'll try changing the header files using the code you provided. I really hope it will work.
    Domain name registration
  • lily
    Ok, I see this is an older article, but I could still use your help! I did exactly what you said, and the sidebar DID get removed, but the page looks messed up. The main part of the page is super small now, and the footer background (which is dark) takes up most of the page, instead of the light background that is supposed to be there. In other words, it looks like the middle part of the page is gone, and the footer is huge. How do I fix this? If there is only one stylesheet for all the pages, I don't want to tinker with that too much because I only want the sidebar removed from the secondary pages.

    thanks!!
  • Great article! Got rid of side bar, now I just need to see how I can widen text area. http://www.islandconsultingcorp.com/island-consulting-promotional-video/ is a link to my sites promotional video. I'm helping local businesses branch out into social media and this information can prove very beneficial. Thanks for all you do. I will search to see how to expand my text area/video area, but if you point me in the right direction, I would appreciate it. I believe if you help others get what they want, you can have everything you want.
  • thanks a lot, it works immediately after your tut.
  • Thanks for the tutorial. I was searching for info on how to do this and came across your post. You just saved me from having to pay someone at scriptlance to do it for me. I didn't realize that it was so easy... :)
  • Hi David,

    I wanted to say thanks for this great post. My blog has a bit of a small content area.. about 500px and I wanted to make a special page for search results to properly fit the google search code without changing the rest of the site. I was looking all over and came across your info. I followed your instructions, added a quick few lines of css to the stylesheet and bang... done. While others made this seem very complicated, I was almost afraid to try your solution because it seemed too easy, but worked like a charm :)

    Thanks again...
  • Sorry Guys, its working now. Actually I forgot to put 'php' with
  • Hi,

    I have done everything what you said and new template is working. But when I log out from wordpress, it is using orginal default template, that is, page.php. Why is so? I am working on wamp on my PC. Could anyone tell where I am wrong.
  • Super Dave! Very concise. Thank you!

    Now I will finally be able to get rid of that annoying title at the top of my pages that just repeats the name of the page.
  • joe
    yes, remove sidebar but what is left is a big space on my custom page's side. what to do to expand the content to the side, please tell us more. thanks for great post.
  • Great stuff for a short tutorial. It looks to me like you've included everything needed (minus the cussing I might engage in) for a new look on my blog.
  • That's a good point about right or left margin clutter...especially when making a sales presentation. Sometimes we think noise looks cool and maybe so but it only serves to distract from the sale.
  • Eric Graudins
    Thanks for this useful explanation of what to remove in Wordpress pages.
    Other instructions I've seen take 5 times as much space to say the same thing.
    Cheers, Eric G.
  • I'm building a blog about my travels in Europe. This will help enormously. Your advice is much appreciated.
  • Hi David,

    Now this is smething i have wanted to do for some time now. So i guess with your instructions and some coding i best go do it.

    Thanks for sharing this, its great to find gems like this just when you need them.

    Kevin
  • Finally someone I can understand.
    Thank you, thank you, thank you!
    John Turner
  • David, this is a "next level" tutorial for me. About 6 months ago, I finally jumped in to WordPress blogs and I can't believe how good they are for SEO. The problem I've had is that I've wanted that customizable hybrid of being able to make a static web page when I want, then utilizing the regular blog structure when I needed it.

    Thanks!
  • I'm sorry - I just found the solution - Some people are having this problem and not others. http://wordpress.org/support/topic/190138
  • It appears that page templates are gone in the latest Wordpress release (2.8). I am not sure why I cannot find the page template drop down now.
  • Not sure that this exactly applies to what you were talking about above, but you do seem to know a lot about WP... I'm a blogger person thinking about switching to wordpress, but it looks like you're not able to edit the html code of the blog layout, which I'm sort of attached to being able to do... it looks like the only thing editable is the CSS code, which I'm not familiar with (yet). This seems pretty limiting- you HAVE to use one of their templates?

    Thanks for any advice- I'm diving into this whole web-page editing thing and I'm in a little over my head at the moment!
  • Nice post. Thanks for the tip ;)
  • Yeah, you'll need to adjust your stylesheet so that the content column is the full width of your theme.
  • Jack
    Dave, thanks for post.

    A quick question, do you have to do anything to the stylesheet at all? I tried to remove my right sidebar, but my content is still on the left with big white space on the right, as if the right sidebar is still there but invisible.

    Thanks
  • AJ
    Okay, answering my own question... I am downloading from wordpress.org and will install on my own server.
  • AJ
    This is exactly what I need to do, thank you!

    If anyone can help a complete Wordpress newbie, I cannot figure out how to access the page.php file. Do I need to have one of the upgrades installed, or host this on my own domain to do so? Is it possible to access these files via FTP?

    I apologize if this is hijacking at all, thought an answer might help others like me.
  • Wow..I'll try that out on my wordpress blog - http://www.sexacademy.wordpress.com
  • Awesome post.... this is definitely a sexy tutorial.... it has many applications.... When i create niche sites, sometimes the sidebar can be filled with clutter that can be distracting people from buying... now i can get rid of those sidebars, but still enjoy the benefits of wordpress.
  • Great post, David; I'll be using a similar approach for another blog I'm building.

    A home page (home.php) is another example of when you might want to use this approach. You may want to have a welcome message, or a special banner without the sidebar or navigation bar getting in the way.
blog comments powered by Disqus