Elliot Jay Stocks is a designer, speaker, and author. He is the Creative Director of Adobe Typekit, the founder of typography magazine 8 Faces, one half of Viewport Industries, and an electronic musician.

Tutorial: Multiple single.php templates in WordPress

Posted on 09 July 2009 55 comments

Article illustration for Tutorial: Multiple single.php templates in WordPress

WordPress has loads of cool features built-in for those of us who like to treat post categories differently, but sometimes a little extra hacking is required.

Take, for example, the category archives template, category.php. To have a different template for each category, all you have to do is add the category ID to the end of the filename; i.e: category-XX.php (where ‘XX’ is the ID of your category). That’s exactly how I achieved completely different-looking pages on the new elliotjaystocks.com: the Blog page uses a template called category-21.php, the Portfolio page uses a template called category-29.php, and the Speaking page uses a template called category-37.php. Simple, but extremely effective.*

So, with this in place, I started tackling the single.php template and assumed that you could do pretty much the same thing. I was wrong! WordPress has no built-in support for multiple single.php templates and so I had to find a way of doing this. I asked the Twitter community and got several responses,* and my final solution works as follows:

  1. Delete everything in single.php
  2. Insert the ‘switching’ code (see below)
  3. Create two new templates with unique names
  4. On the server, the magical fairy dust in your modified single.php will automatically load the correct template when the page is requested

The ‘switching’ code


<?php
if (in_category('21')) {include (TEMPLATEPATH . '/single-21.php');
}
else { include (TEMPLATEPATH . '/single-29.php');
}
?>

Not much to it, is there? But that’s all you need. You’ll notice that I’ve followed the same naming structure as the category template variations, but you can actually call the files whatever you like. (I’d recommend this naming convention because it correlates to your category templates and it also makes things future-proof if WordPress ever decides to add native support for template-switching.)

And that’s it! Expect to see similar posts over the coming weeks, since there are a fair few WordPress hacks I’ve employed to get this site working the way it does.

* The posts in the ‘speaking’ category don’t need a single.php template since they’re never ‘clicked through to’; they appear on the speaking page in their entirety.

** If you want me to elaborate on this technique some more, please let me know in the comments.

* I’m afraid I can’t remember who exactly came up with the final code I used; it may have been one person or several of you. I’m happy to give credit — my memory’s just crap. Give me a nudge if you think you deserve a mention.

55 comments

  1. Paul Davis

    Paul Davis

    09 July 2009 @ 10:30PM #

    I do love the WordPress conditional statements, but this brings them to another level. It’s also another use for them I haven’t considered yet, so thanks for enlightening me!

  2. Tim

    Tim

    09 July 2009 @ 10:44PM #

    That’s bad ass dude. Exactly the kind of thing I was looking for. Thank you for sharing.

    Stay metal.

  3. Mike Smith

    Mike Smith

    09 July 2009 @ 10:49PM #

    I’ve seen this done before, but totally forgot about it. Thanks for posting about it – it’s now in que for the next #wpwednesday on twitter. And I am sure I’ll be referencing this page for many templates to come :)

  4. kyle steed

    kyle steed

    09 July 2009 @ 10:50PM #

    Very nice Elliot. Thanks for the tip. I know a few people that would find this quite helpful, myself included. Cheers!

  5. Karina

    Karina

    09 July 2009 @ 11:41PM #

    Thanks so much for the help on this, Elliot! I’m in the middle of working on my own Wordpress site, and I wanted to completely Wordpressize it in the same way. I was sweating this aspect, only being a dabbler myself.

    I am very grateful that you posted this. <3

    And I still really, really like this new design! (The huge form fields are super fun.)

  6. Luke

    Luke

    09 July 2009 @ 11:46PM #

    It’s a great little system Wordpress, I’ve been using this system for about 2 years now, just popped onto the Wordpress Codex to find out how :)

  7. Matt Hill

    Matt Hill

    10 July 2009 @ 12:38AM #

    Perhaps I’m missing something, but why do you need separate single.php files for this?

    You can save all this hassle and simply use the category conditionals in your single.php, creating different layouts all in one file. That’s the technique I’ve used on my own site and countless others, I don’t really see the benefit of making more files than you need. Could you clarify this? Cheers.

  8. Max.W

    Max.W

    10 July 2009 @ 01:54AM #

    That’s fantastic Elliot, it gives us more control over the single template that I never thought was possible.

    Thanks mate!

  9. Justin Tadlock

    Justin Tadlock

    10 July 2009 @ 02:13AM #

    While this method is effective, wouldn’t it be better to not have to hack into the theme files? WordPress provides a simple filter hook called single_template that would allow you to override which template is used.

  10. Gio Gutierrez

    Gio Gutierrez

    10 July 2009 @ 02:43AM #

    What script did you use for the hiding and showing of titles as in your portfolio page (white text on black background). I dig….

  11. Matt Hill

    Matt Hill

    10 July 2009 @ 03:35AM #

    I looked into this some more and found this plugin which you might find useful:

    http://www.nathanrice.net/plugins/single-post-template/

  12. Dave Kirk

    Dave Kirk

    10 July 2009 @ 01:07PM #

    A great example of how sometimes developers / designers seem to automatically overcomplicate things :-) This solution proves that sometimes it can be that simple, yet achieve exactly what you were after.

    @Matt Hill: I guess it would come down to personal preference really. Both ways basically work in exactly the same way, however personally I would prefer to have each separate page treated as such, in the same way they would in a ‘static’ site. Doesn’t mean that way would be right for everyone :-)

  13. Elliot Jay Stocks

    Elliot Jay Stocks

    10 July 2009 @ 03:21PM #

    @ Matt Hill: I’m really glad you brought this up, because for a while I was considering both approaches, before ultimately deciding to go with the two different templates. You are, of course, completely correct in saying that it could all be achieved with just one single.php file, but it actually gets pretty complex.

    If you look at a ‘single’ page for the Blog category (such as this one), it’s got several elements specific to its category; things like:

    • Timestamp
    • Comment count
    • Post illustration custom field
    • Comments
    • Sidebar (containing ads and recent comments)
    • A completely different layout, with different div nestings, etc.

    In contrast, a ‘single’ page for the Portfolio category (such as the Fragile State Of Inbetween page) has specific elements like:

    • Category title
    • Excerpt
    • Client, credits, etc. custom fields
    • 5 x image custom fields
    • Call-to-action text at the bottom
    • A completely different layout, with different div nestings, etc.

    In fact, the only elements that both pages share are:

    • The post title
    • The post content

    So, with this in mind, I decided that they should be treated as separate pages, since they have so little in common.

    The other thing I’d say to support the two-templates method is that it’s exactly how WordPress works anyway. As you probably know, the only PHP file you actually need for a theme is index.php, and you could — if you were feeling so inclined — achieve everything in that one file using only conditional statements. (If this is news to any of you, just check out the template hierarchy diagram from WPcandy.) However, this is an unnecessarily complex way of doing things, which is why, over time, WordPress has gradually included more and more standalone templates (although I should add that this isn’t necessarily a good thing!)

    Realistically, for the majority of sites that use WordPress — especially those that treat it purely as a blogging engine rather than a fully-blown CMS — it’d be easier to achieve slight variations in the single.php file using some simple conditional statements, but every now and then the need arises to make things more streamlined, and that can be achieved by using the multiple templates method described above, the Single Post Template plugin you suggested (thanks!), or perhaps the plugin suggested to me just now by Miguel Ripoll via email: Post Templates by Category (or any number of other plugins, probably). Ultimately I guess it’s about finding the most easily manageable solution for your given scenario.

    Cheers again for bringing up the subject. It’s a good debate!

    @ Justin Tadlock: I wasn’t aware of this; could you expand on this with a quick demonstration of how the hook would be used in this situation, please?

    @ Gio Gutierrez: No script: just CSS. display:none overridden by display:block on :hover. Easy!

  14. Matt Hill

    Matt Hill

    10 July 2009 @ 09:13PM #

    Ah, right, that makes sense. I do understand the need to separate out more complex work into individual templates and I guess in this case it made sense for you to do it that way.

    As you say, different techniques suit different projects. I’ve just done a small site for a client that needed some page specific stuff but I didn’t want to mess with templates as I just knew they would forget to set the right template, so I put all the conditionals into page.php.

  15. Max

    Max

    10 July 2009 @ 11:00PM #

    The ‘If Category’ statement is really useful, especially when you want to add a linked list into you blog. After messing around with Wordpress php I figured it out, but wished I had a tutorial like this.

  16. Gaby

    Gaby

    11 July 2009 @ 04:22AM #

    Very useful piece of code. I may incorporate this into my blog at a later date (not much use for it right now, just started). I know someone’s posted a plugin up, but I personally like to have complete control over the code. Plus php is so fun :D

  17. Ritchie

    Ritchie

    11 July 2009 @ 05:38AM #

    Nice tutorial. This is much more easy to manage your template in every category. I will apply this into my new theme soon. Thanks Elliot.

  18. jothree

    jothree

    11 July 2009 @ 03:48PM #

    nice share, . . . .

    thanks

  19. Joel

    Joel

    13 July 2009 @ 01:23PM #

    Never thought of having multiple single.php files. Great idea.

    Love the new theme! Is this website powered by WordPress? If so, why do you say @Name for replies when you could make use of WordPress’ threaded comment feature?

  20. Elliot Jay Stocks

    Elliot Jay Stocks

    13 July 2009 @ 01:52PM #

    @ Joel: I’m not really a fan of threaded comments, to be honest. One of the reasons is that I like to reply to everyone at once, so that I can answer multiple questions at the same time (especially where one particular question has been asked several times by different people).

  21. Justin Tadlock

    Justin Tadlock

    16 July 2009 @ 02:07AM #

    @Elliot Jay Stocks: Sure thing. It’s quite simple, really. Just drop something like this in your theme’s functions.php file:

    add_filter( 'single_template', 'my_single_template' );

    function my_single_template( $template ) {

    if ( in_category( ‘21’ ) )
    $template = locate_template( array( ‘single-21.php’, ‘single.php’ ) );
    else
    $template = locate_template( array( ‘single-29.php’, ‘single.php’ ) );

    return $template;
    }

    You won’t to do anything within your single.php template.

  22. Mark

    Mark

    16 July 2009 @ 03:21AM #

    Thanks Justin.

    .. always a great help!

  23. nick

    nick

    20 July 2009 @ 01:07PM #

    wow nice blog!Please visit back my blogthank you :)

  24. Tom

    Tom

    21 July 2009 @ 01:42AM #

    Not sure whats the difference between this blank wp template and all the others that exist already. Please clarify why this one is getting so much hype.

  25. Adrienne Adams

    Adrienne Adams

    21 July 2009 @ 07:46AM #

    Thanks for the tutorial. This is the format that I also want to implement on my site: a blog area and a portfolio area. I tried using query_posts to separate two dynamic content areas but ran into many problems. Using categories instead seems much simpler.

    Two questions, if you are willing to share: one, how did you remove the preceding /category/ from the URL? And two, how did you set up your main menu? Did you hard-code it, use a combination of wp_page_menu and wp_list_categories, or some other technique?

    And last but not least, your redesign is really sweet!

  26. Antonin

    Antonin

    22 July 2009 @ 11:38AM #

    Hello,

    @Adrienne Adams : to remove /category/ from the category permalink you can use this plugin : WP No Category Base

    http://wordpress.org/extend/plugins/wp-no-category-base/

    Don’t forget to set custom permalink like this: /%postname%/

  27. nanochrome

    nanochrome

    22 July 2009 @ 03:11PM #

    Great, I’ll Use it in my next theme :)

  28. Cosmin

    Cosmin

    29 July 2009 @ 12:16AM #

    Man, you made my day.

    I found your article googling, and it was exactly what I was hoping for.

    Thanks a million!

    @Adrienne Adams: another, very simple way to remove /category/ is to use “./” (without the quotes) as your category base.

    Go to: Settings>Permalinks>Category Base and write ./ there ;)

    Or you could change the category base to something you need (for example I used “themes”)

  29. paratoner

    paratoner

    30 July 2009 @ 04:13AM #

    thanks for this page.

  30. gebelik

    gebelik

    30 July 2009 @ 04:22AM #

    i like this site. i added on my bookmark i thanks

  31. Adrienne Adams

    Adrienne Adams

    30 July 2009 @ 11:46PM #

    @Antonin, @Cosmin: thanks for the tips on removing the category base.

  32. Dave Sparks

    Dave Sparks

    10 August 2009 @ 12:21AM #

    Cheers – very useful!

  33. bluemag

    bluemag

    10 August 2009 @ 02:15AM #

    Nice article and very useful stuff!!

  34. jatropha

    jatropha

    14 August 2009 @ 10:16AM #

    Very nice Elliot. Thanks for the tip. I know a few people that would find this quite helpful, myself included. Cheers!

  35. driz

    driz

    15 August 2009 @ 07:29AM #

    What about nested categories? I’m building a zine which has a total of 60 categories and 8 of those are parent, but creating templates for just those 8 doesnt filter down to the children. Any ideas on how to tackle this? Thanks.

  36. driz

    driz

    15 August 2009 @ 05:53PM #

    Adding to me comment above for the time being I have borrowed the code you used for the single but instead changed it to: is_category but the problem is I now have 200 lines of code, but also means if I was to create a new category I would have to go back into the template files and create a new line, bit of pain. Any ideas on improvements to this method? It does work very well, but it’s just not elegant.

  37. robert reddick

    robert reddick

    20 August 2009 @ 03:37AM #

    good, better, best?

    On Nathan’s page he shows how, using functions.php, to create category-style single-nn.php pages. Your post here reminded me that I had used his method before. Thought I’d post here since there seems to be lots of recent activity: http://www.nathanrice.net/blog/wordpress-single-post-templates/.

  38. Shibi Kannan

    Shibi Kannan

    20 August 2009 @ 10:31AM #

    Very nice article and fantastic discussion going on here although there were some irrelevant comments. I really like the new look especially the background and the image enhancements. I do agree the need for customizing single.php templates – maybe future wordpress versions will incorporate something like this but much easier for folks who don’t want to dig into php code.

  39. Matt Martin

    Matt Martin

    23 August 2009 @ 09:38AM #

    Thanks!

    PS: Your comment box is great x 7

  40. Pali Madra

    Pali Madra

    04 September 2009 @ 04:40PM #

    Elliot you just got a new fan. I watched your portfolio website screencast which was awesome and then read this post. The post is very helpful for people like me as it is easy to understand.

    Can you please put up a post on how you managed to got the portfolio page, blog page and speaking page to work the way the do. I have an idea about how you did it (by creating categories) but it would be nice if you can elaborate on the technique used.

    Thanks in advance.

  41. wordpress 资源收藏

    wordpress 资源收藏

    27 March 2010 @ 09:45AM #

    […] Tutorial: Multiple single.php Templates in WordPress (教程:WP 中的多个 single.php 模板) – 在 WP 中使用一个以上的 single.php 文件。 […]

  42. dejunky

    dejunky

    03 July 2010 @ 01:21PM #

    This is a great find, thanks!

    I was wondering if this could be used with a function?

    I am trying to build an AJAX site with Wordpress and will call up the different post/pages but if someone have javascript disabled I would still like the pages/posts to show up formated right.

    So my idea is to use a way of .load within jquery the pages but if then load a different template with full page.

    What ya think? Might work…

  43. Jennifer

    Jennifer

    06 July 2010 @ 11:55PM #

    Wow—I’ve been trying to do this for days and luckily found your blog post. While I’ve found lots of “solutions” online, yours was the ONLY code that worked for me! Thank you, thank you, thank you!

© 2005 – 2014 Elliot Jay Stocks. All rights reserved. Powered by Harmony and tracked by Gaug.es. To keep updated with new content, you might like to subscribe to my RSS feed.