Creating a WordPress Page Template

Hi!

I know you are probably wondering why there is a dancing chicken on the screen, but we are going to use that fellow in a moment to do a little exercise to show how to make page tempates in WordPress. It is a powerful little trick that I picked up a month or two ago.

I’m going to go to add new page in my admin panel. Over to the right you’ll see a drop down of page templates. Different themes come with different ones. I’ve made one call quote page, because I want to add random quotes pulled from a database to certain pages on the site. If I want it to be a quote page I simply select it from the tempate menu.

So I’m going to put a title of Quotes test page and content of “some cool content” select the quote page from the drop down, and I publish that. View it. And you will see a note at the bottom of the page.

There is a Steve Job’s quote right there, on a css note, and there is my text “some cool content” right there.

Now Here’s how you do it, and it is very simple. You go into your theme folder with whatever editor you like, I’m using dreamweaver. I’m using enigma theme, so you just need to find the folder that has the same name as your theme. I copied the fullwidth.php.

Now back to the dancing chicken

Save your fullwidth.php as a new file. I’m going to save it as dancingchicken.php

And here at the top where it says full width page and replace it with dancing chicken

Change

//Template Name:Full-Width Page

to

//Template Name:Dancing Chicken

Now for any php or javascript developers this is sorta counter-intuitive because usually if we put in a comment it is ignored by the server, but in this case WordPress reads it to identify which template it is.

Now if I upload this and go back and add a new page called Chicken Test and go over to the drop down and select dancing chicken from templates.

Now if we view it is just going to be a blank page, because we have not changed anything yet.

So let up go back and add the chicken to the page.

Now I have the chicken in my media library already. Select it and add it to the page

copy the url of the image, over at the top right of page

go back to the php page.

Now the part of the code that says: get_template_part(‘post’,’page’); is the part of the code that pull the content into the page.

So if we put the image below that code it will go after the text, and before that code it will come before.

Paste the url from the media library into a img tag so it looks like this

<img src=”http://williamclarkson.net/wp-content/uploads/2016/03/chicken.gif“/>

Upload, and go back to your page.

View the chicken test page and there he is!

So any page I use with dancing chicken template will have the chicken on it.

This is just an example how a template can work.

I hope that this has been helpful.

If you’ve any questions, please email me at the link at the top of the page.