How to make WordPress page templatesOctober 20, 2013

So you’ve decided to use WordPress as a content management system – well, you’re going to need custom WordPress page templates, then.

Custom page templates represent the pages of your website that aren’t related to blog posts – for example an about page, a contact page, or a custom homepage. You want them to look a little different than the rest of the site and you want them to be editable within the WordPress administration section in the same way that a post is.

To accomplish this, firstly you need to create a HTML template that defines how the page will look. Then, when you create a new ‘page’ from the WordPress administration section of your site you can identify its template as the HTML template you just created.

To define the content for a custom page template you can either

a) dynamically grab some content within the page template based on a custom post-type,

b) simply edit the page directly within WordPress or

c) hard-code it into your custom page template.

An example custom page template

<?php get_header(); ?>

<h1>All about me, me, glorious me! I am marketable, me!</h1>

<p>I have been on an Aitkins/Gluten-free/Paleo/Vegan diet for five years now, and this is my wonderfully self-satisfied blog which expands upon that experience with excruciating detail. My posts explain what I eat meal by grainy meal in blandly-flavoured detail complete with artsy-angled iPhone-filtered photographs and comments from over-eager hangers-on. I also explain how I manage on a daily basis to cope with people who don’t respect my food choices (or are just plain sick of hearing about them every five minutes!). One day I hope that we can live in a society where everyone’s foodstyles are accomodated equally, no matter how agonisingly unique they are, or how radically expensive they are to sustain. </p>

  while(have_posts()) : the_post();

<p>Hit me up on Facebook or Tumblr, Google or Twitter, Youtube or Github, Dribble or Flickr:</p>
<p>If you LinkedIn with my Pinterests, Instagrammed MySpace or want to Badoo my Bebo</p>

  $args = array(‘post_type’ => ‘social_networks’, ‘posts_per_page’ => 5);
  $loop = new WP_Query($args);

<?php get_footer(); ?>

This custom WordPress page template grabs the header file first, then has some hard-coded content in it – the H1, the first paragraph explaining what the blog is all about, and then a paragraph further on inviting people to communicate via social networking.

It also dynamically grabs some content – custom posts types. It does this by executing a loop that loops through the posts (with post type ‘social_networks’) and grabs and displays their content. Then it displays a footer.

Category: Tutorials

Thoughts onHow to make WordPress page templates

Leave a Reply

Your email address will not be published. Required fields are marked *