Every now and then you might find yourself in need of a special page on your blog – a page that looks, and perhaps even functions differently than the rest.
While this may seem like a daunting task, it’s actually pretty straightforward. The potential challenges depend on how much you want to customize this page, and how comfortable you are with editing code (things like CSS, PHP and HTML).
Where To Begin
Now, you could easily start this template from scratch, using either a text editor or HTML program – but if you are comfortable enough with code and design to start from there, you probably wouldn’t be reading this tutorial 😉
I’m going to assume that you are looking to take your theme’s current page layout and modify it slightly – maybe this page needs a special header, you want to eliminate/modify the sidebar or something.
If I’m wrong, and you ARE starting from scratch, then you should know what to do first – go write your page, and then skip down to the “Naming Your Template” section of this post.
Now, if you simply want to modify your current layout, then that’s where you should start. Using an FTP client, download a copy of your theme’s
You can also copy and paste the contents of the file from WordPress theme editor, but you’ll need an FTP client to upload the new template later on.
Whichever method you choose to acquire the file you are going to modify, you’ll want to create a new file, with whatever name you want – but make sure you save it as a PHP file (by giving it a
.php extension, so something like
nosidebar.php, for example).
Naming Your Template
Now that you have your original page copied, it’s time to tell WordPress that this file is, in fact, a new template – which means we have to give it a name.
For obvious reasons, it’s advisable to choose a name that is similar to the file name you just selected. Make sure that the name you give the template will be easily recognizable in the future. In the event that you eventually have multiple templates, you want them to be easily identifiable.
At the very beginning of your file – which most likely begins with a PHP tag (
<!--?php ></code>), you need to add the following code:</p> <pre> <?php /* Template Name: No Sidebar */ ?-->
If you’re familiar with PHP (and if you’re messing with page templates, you should be – at least a little ;)), this probably looks pretty straight forward. Here’s a quick breakdown, just in case you are just starting to get your feet wet.
First we opened a PHP block with the the
, and you’re home free.
<!--?php </code> tag. After that we started a comment string with <code>/*</code>. Comments are a handy tool when writing code, because they allow you to insert text like notes and reminders for the future. </p> <p>Generally, anything entered inside a comment string won't get parsed by the browser. In certain circumstances however, WordPress is designed to take note of your comments and react to them.</p> <p>In this case, when WordPress sees a comment that starts with "Template Name" at the beginning of a PHP file, it knows to treat this document as a template.</p> <p>The middle line of this code is pretty obvious. After that we close the comment string with <code>*/</code> (notice that the closing tag is reverse of the opening tag). Then you close out of PHP with <code>?-->
WordPress will now treat this document as a template, making it available on the Edit Pages screen (once you upload it, of course).
Saving and Applying Your New Template
Now that you’ve created a valid page template, you’ll obviously want to go ahead and make whatever changes you need.
That may seem vague, but since every template is different and I don’t know what your needs are for this project, I’m afraid I can’t be much more specific – at least not in this article 🙂
Once that’s done, pull up your FTP client and get ready to load the template onto your blog. You can always upload it before you’re finished with all of the editing if you want – that way you can preview the changes as you adjust your code. I’d recommend performing these tests on a draft, and using “Preview” rather than “Publish.” At least until you know everything is working right.
All you need to do now is upload your new file to your blog. It needs to be placed in your current theme’s folder:
Of course, you’ll want to use the name of the folder that stores your theme’s files.
This brings me to another good point. Templates are theme specific. This means if you change themes, you need to move your templates into the new theme’s folder – if you still want to use them, that is.
Since the template we’ve created today is actually based on the current theme, it probably wouldn’t work with a new one. This is partly because the design is likely to be different, but mostly because this template is using CSS styles that may not be present or the same in whatever new theme you decide to use.
Bottom line: if you change themes, you’ll need to move your templates – and you’ll most likely have to recreate/update them to look right and be compatible with whatever new theme you choose.
Now that your template is uploaded, log into your dashboard and create the page that you want to use it on.
Write the page just as you normally would, but before you publish it, look down the right hand column for the “Attributes” section. That’s where you’ll find a drop-down list entitled “Template.”
In that list, you’ll see your newly created page layout. Select it and preview or publish your new page!
Now that you’re done with this, try creating a couple more… play around a little – and as always, I’d love to hear your comments and feedback.