The challenge

When creating a WordPress theme you can use a number of individual template files to control different types of content. However, very little often changes from page to page. You end up retyping the same code into each template. When you want to make a change to your theme you have to go and edit the code numerous times across different templates. A better solution would be to have a few template files as possible and apply a different output based on certain conditions. WordPress offers us conditional tags to do this very thing.

Imagine my scenario. I have blog posts published in full on the front-page of my site. Each of these posts contains a link in the title which takes us to the full, permalinked article plus comments. I can use the same WordPress loop for the homepage as for the single articles save for a two things: 1. The link in the title isn’t needed on the single post as it would self-link. 2. The link to the comments isn’t needed for the same reason.

The solution

<?php if (is_single()) { ?>
<?php the_title(); ?>
<?php } else { ?>
<a class="bookmark" href="<?php the_permalink() ?>"
rel="bookmark" title="Permanent Link to <?php the_title(); ?> ">
<?php the_title(); ?> </a>
<?php } ?>

The code above illustrates the syntax to use. The emboldened bits provide the conditional logic and the bits between are the code I want to output. And there you have it. Simple really.

Something I have to hunt for every time I build a WordPress theme is the method of referencing images and other elements placed within the theme directory I’ve created. The code above is the means of doing this.

Firstly, the site should perform as an online portfolio of my work. I’ve got to make more of this feature and hope to add to it shortly.

Secondly, the site needs to present friends and family with recent photos from my exciting life.

Thirdly, it needs to have links to my thoughts and ramblings – articles. I’ve not written too much lately and although I hope to do more over the next year, it’s probably best not to put the main emphasis of the site on the ‘blog’ part.

Fourthly, I record interesting, relevant links daily using my del.icio.us account. These are now visible via the ‘recent links’ feature on the homepage as well as a daily digest in article format.

So, the homepage now introduces the site before presenting links to recent content and then links to all archived content.

The article pages themselves now make use of gravatars if you have one (incidentally, I’m still awaiting mine). The comments are now open for discussion by default.

Content-wise, I’m going through all the old posts to check the internal links which have been broken since the days of switching from Movable Type. The information-architecture will be fine-tuned, making use of good contextual-navigation.

As I say, the design is nealry done but there are some things I still need to do. For example, more graphics will be added, icons may change and I’ll also be listing all of the sites that have influenced this design.

If it doesn’t, you’re probably viewing it in a bad browser that doesn’t support web standards or W3C specification. For example, Internet Explorer on both PC and Mac (although it will just about display correctly on IE6/PC). It’s worth viewing it in Firefox or Opera on PC and Safari on the Mac. Browsing the web as a whole will be greatly imporved if you use a standards-compliant browser.

Here’s what it looks like in a bunch of good browsers on Windows:

Feedback is encouraged so let rip..

I’ve been happy to use the Kubrick theme for the last couple of months but I’m now finally in the position to put my new design into place. It’s all rather bare-bones at the moment but something more substantial will appear shortly. This is a step-by-step process. Step 1 being the underlying WordPress template code. I’ve got to clean up all the old bits left over from the default theme. Step 2 will see me work on the CSS styles.

For the initial rather plain design, I’ve taken inspiration from the likes of Garrett and Tom who avoid cluttering up their blogs with navigation. I may continue along this route or may find that I actally need a nav bar. We’ll see. The search box is currently at the bottom of each page but I might move it nearer the top. A lot of this is farily experimental at the moment.

1. Blogroll doesn’t order by name by default (You have to change it from ‘random’ in link – link categories -edit)
2. Categories don’t order by name in the default template
3. How to stop comment spam in old entries by SQL
4. How to put a time-limit on a comments form. (worth adding the ‘ping’ bit too.)