This Post
  • HOME PAGE
  • ABOUT
  • ARCHIVES
  • SITEMAP
 
« Google, Comments, Bounce And You How To Create A WordPress Theme - Part 6 »
 
20
Feb

How To Create A Wordpress Theme - Part 5

by admin

create theme logo
This is the fifth part of how to create a WordPress theme. In the last part How To Create A WordPress Theme - Part 4, you created the single post page and added the comments,, but there are several other pages you can incorporate into your theme. There are two types of page in WordPress.

Query Type Page Templates

You have already met the first kind, they are time dependent. For example, you write a post and save it then you write another post and save it as well. These two posts will always appear in that order because they have a post date associated with them, you can also put them in a Category. This type of page is usually the result of some kind of query, for example show me all the posts that were created in September of 2007. Here is a list of template pages can be included in your theme:

  • archive.php
  • author.php
  • category.php
  • tag.php
  • date.php

Each of these templates will give you a series of posts, the name of the file tells you what kind of query you performed. If any template is missing then WordPress will look for another file and if that is missing in some cases there is a third choice. Here are the choices:

category.php => archive.php => index.php
tag.php => archive.php => index.php
date.php => archive.php => index.php
author.php => archive.php => index.php
archive.php => index.php

As you can see if any of the templates are missing WordPress will look for archive.php and if that is missing then it will use the index.php. So if you want a minimal theme then just have the archive.php. By including all the above templates you can have different layouts and/or color schemes for each type of query.

When you do a search on Google you are presented with a series of urls with short descriptions so that you can scan them faster and see which is more meaningful. This method should be used in WordPress, whenever you perform a query you will see a list of post titles and excerpts of the posts.

In the last part of this series I showed you how to create a file called excerpt.php from the file index.php. In HTML-kit, load up this file and save as:

  • archive.php
  • author.php
  • category.php
  • tag.php
  • date.php

The only time that you need author.php is if you have multiple authors. If that is the case then in the postmetadata section find the code:

<?php the_author() ?>

and replace it with:

<?php the_author_posts_link(); ?>

This will change the author’s name from just text to a link.

Non-Query Type Page Templates

The other kind of page is not time dependent and you will usually find information about either the site or it’s author. They can also be linked in a hierarchy much like a regular web site by the use of sub-pages. This kind of page cannot be assigned to a Category.

Page.php

To create page.php you can use index.php and edit it as follows:

  1. Delete lines 19-29.
  2. Change line 8 to:
    <h2><?php the_title(); ?></h2>
    
  3. Change line 14 to:
    <?php the_content('<p class="serif">Read the rest of this page »</p>'); ?>
    
  4. Delete the postmetadata div, lines 10-12.
  5. Delete line 9 and line 15.
  6. Delete line 14
  7. Move the cursor to the end of line 12, press Enter and add this on line 13:
    <?php wp_link_pages(array('before' => '<p><strong>Pages:</strong> ',
    'after' => '</p>', 'next_or_number' => 'number')); ?>
    
  8. Move the cursor to the end of line 20, press Enter and add this on line 21:
    <?php edit_post_link('Edit this entry.', '<p>', '</p>'); ?>
    
  9. Move the cursor to the end of line 7, press Enter and add this on line 8:
    <div class="post" id="post-<?php the_ID(); ?>">
    
  10. On line 17 add:
    </div>
    

These changes should result in:

<?php get_header() ?>
<div id="wrap">
  <div id="wrapper">
    <div id="content">
      <?php if (have_posts()) : ?>
        <?php while (have_posts()) : the_post(); ?>
          <div class="post" id="post-<?php the_ID(); ?>">
            <h2><?php the_title(); ?></h2>
            <div class="entry">
              <?php the_content('<p class="serif">Read the rest of this page »</p>'); ?>
              <?php wp_link_pages(array('before' => '<p><strong>Pages:</strong> ',
                'after' => '</p>', 'next_or_number' => 'number')); ?>
            </div>
          </div>
        <?php endwhile; ?>
      <?php endif; ?>
      <?php edit_post_link('Edit this entry.', '<p>', '</p>'); ?>
    </div>
  </div>
  <?php get_sidebar() ?>
  <div style="clear: both; height: 0px;"> </div>
</div>
<?php get_footer() ?>

This will allow you to create your About Page, Comment Policy Page etc. All you have to do is go to the Admin Panel, select Write > Page and enter a title and whatever text you need for that page then Publish it.

To add the page to the horizontal navigation you need the page’s url. Select Manage > Pages, you will see a table of the pages you have created. In the 5th column click on View. highlight and copy the url in the address bar, mine was:

http://localhost/wordpress/about2/

Open the header.php file and find the line with the home link. Place your cursor at the end of that line and press Enter to create a blank line. If you look at the other links you will not see a url, instead there’s a WordPress function <?php bloginfo('url'); ?>. This returns the blog’s url in this case:

http://localhost/wordpress

So to get the url of the new About page I would use:

<?php bloginfo('url'); ?>/about2/

On the new blank line add:

<li><a href="<?php bloginfo('url'); ?>/about2/" title="Read all
about me">About</a></li>

Save it and then refresh the browser. The new About button should appear next to the Home button and by clicking on it you will be able to view the About Page.

Other Page Templates

You can create pages to display specific information about the blog. For example instead of using plugins or widgets to show the archives you could have a dedicated page with it’s own layout.

Such a page would be an archives page which displays archives sorted by both date and category. To create it you shall start with the page.php that you just made, save it as archives.php.

Delete lines 6-19. This is everything inside the content div. Replace them with the following:

<h2>Archives by Month:</h2>
<ul>
  <?php wp_get_archives('type=monthly'); ?>
</ul>

<h2>Archives by Subject:</h2>
<ul>
  <?php wp_list_categories('orderby=name&title_li='); ?>
</ul>
<?php include (TEMPLATEPATH . '/searchform.php'); ?>

As this is a specially formatted page, you need to give it a name so that WordPress can recognize it, otherwise page.php would be used. You do this by adding the following at the very beginning of the file:

<?php
/*
Template Name: Archives
*/
?>

Now save it. To use the page go to the Admin Panel and select Write > Page. For Page Title enter Site Archives. On the right side of the page you will see a number of drop-down boxes, click the plus sign on the one named Page Template. In that there is a drop-down list, from it select Archives . Lastly under Page Slug change site-archives to archives, then click the Publish button. Now save it. You may have noticed on the last line a call to load searchform.php. This file can be copied from the Default theme.

Wrap Up

In this part you have had a go at creating non-post pages. In the next part of this series, how to create a WordPress theme, we shall create a few more pages like the 404 and search results page. We shall also clean up the sidebar and footer so that there are real plugins there.

Related posts:
  1. How To Create A WordPress Theme - Part 8
  2. How To Create A Wordpress Theme - Part 4
  3. How To Create A WordPress Theme - Part 3
  4. How To Create A WordPress Theme - Part 7
  5. How To Get Started Creating Web Pages
Subscribe to RSS feed
stumble me

Tags: category, comments, Google, page, php, plugin, posts, template page, theme, wordpress
Category wordpress | Print This Post Print This Post |

There are 8 Comments

  1. For someone like myself with the interest in making my own WP Theme, your series so far have been awesome. So informative.

    Scribbled by Dave on 21/02/08 at 4:02 am
  2. I don’t know whether to love you or just be utterly terrified of the fact that you are ALWAYS blogging about EXACTLY what I am thinking about. Do-follow vs. no-follow and now the multiple authors link code. Seriously, you’re starting to scare me ;)

    Scribbled by Erica on 21/02/08 at 4:39 pm
  3. @Dave: thx, if you have any questions, let me know.

    @Erica: What’s the phrase… ‘great minds think alike’ or is it ‘fools never differ’? ;)

    Scribbled by Colin King on 21/02/08 at 5:13 pm
  4. I just recently moved my blog from blogspot to wordpress and from there to my own domain- this will be a huge help!

    Scribbled by Cindy on 22/02/08 at 2:23 pm
  5. This is so informative. I wish I could have my own domain and use wordpress later. Thanks for sharing anyway. :)

    Scribbled by Yoko on 24/02/08 at 5:42 pm
  6. […] « How To Create A Wordpress Theme - Part 5   26 […]

    Scribbled by How To Create A WordPress Theme - Part 6 | CK Marketing on 26/02/08 at 12:08 am
  7. Excellent tutorials. I’ve been thinking of creating my own WP theme, but never did. Thanks to your series, I just might do that soon! Thanks!

    Scribbled by Joy on 27/02/08 at 11:31 pm
  8. @Yoko: It’s not really that hard! Hosting is only $5-$6 a month, the rest is free. Or just setup a web-server on your PC/Mac and play with it there until you are confident enough to go live. If you need any help - gimme a shout :)

    @Joy: Same goes for you if you need any help.

    Scribbled by Colin King on 28/02/08 at 10:06 pm

What are your thoughts?

What do you think? Leave a comment. Alternatively, write a post on your own blog, this blog accepts trackbacks [trackback].

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>

Please read the Comment Policy before commenting.

  • Check out one of my favourite sites

    Changes Daily. This is not an Ad!



  • Categories

    • Affiliate Marketing
    • Blogging
    • General
    • Guest Posts
    • List Building
    • Monthly Reports
    • Product Reviews
    • Social Networking
    • Traffic
    • Wednesday Links
    • wordpress
  • Recent Posts

    • A New PC05.11
    • Get More Traffic From Your Tutorials05.8
    • A Surprise In The Mail04.30
    • How To style your Comments - Part 304.28
    • How to Style Your Comments - Part 204.26
    • How To Style Your Comments - Part 104.23
    • The March $100 winner, a problem and a rant04.21
    • Valid XHTML For The EntreCard Widget04.15
  • Bookmarks

    Add to Technorati Favorites
  • Top Commentators

    • Kamran Mahmood (1)
    • Nick (1)
    • Robert (1)
 

This site's design and contents are ©2007-2008 by CK Marketing - All rights reserved Worldwide

This blog is protected by Dave's Spam Karma 2: 4101 Spams eaten and counting...