Modern Decorating ideas interior decorating Home decorators
post-formats-sm

WordPress 3.1 Post Formats Reference

I’ve been playing around with, and testing, WordPress 3.1 beta since its release on November 25, 2010 (Happy Thanksgiving, WordPressers!).  There are some great new features coming your way with the 3.1 release – which you can read about in their announcement post.

I’ve been hard at work on last edits for both my WordPress All In One For Dummies and WordPress Web Design For Dummies books over the past several weeks and want to make sure I include the great new 3.1 features for my readers. One of the new features I just got done including in the books is the new Post Formats feature in 3.1.  Post Formats allow you to create a Tumblr-like blog layout where you can offer different types of content and styling for each individual format type.

Adding theme support for Post Formats is not overly complicated – it’s a quick function added to your Theme Functions (functions.php) file, after you decide which types of formats you are planning on using.  Currently, there are 9 available formats including:  Aside, Link, Gallery, Image, Chat, Audio, Video, Status.  You can add all, or just a few, of the formats using this example (note: this example assumes you are using all the available formats):

// ADD POST FORMATS
add_theme_support( 'post-formats', array( 'aside', 'chat', 'gallery', 'image', 'link', 'quote', 'status', 'video', 'audio' ) );

Technically, there is a tenth format which is the default format, that is the catch-all formatting for posts that you don’t assign a specific format to (you can, such as, use this default format for your regular blog posts).

Once you add the support in your Theme Functions file, you’ll notice a new option under the Publish module on the Add New Post, or Edit Post, screen in your Dashboard:

You have the Post Format added to your theme through the Theme Options file, you create your posts by assigning formats to them – but what about the template?  Below is a very, very simplified template to handle Post Formats.  I simplified it – – with very little markup and content, for you to use as a ready reference.  There are two items at play here that will allow you to customize your Post Formats:

  • Content: using the conditional functions in my template reference example below, you can see that you can include, or exclude, certain template tags and content displays on a per-format basis.  For example, in my example below, I’ve excluded the title template tag: the_title(); from my Asides format, but included it in my Gallery format.  It follows then, that when my posts display on my site, Asides will not have a title, but Gallery posts will.  The possibilities here are endless in terms of what kind of content you want to display for each format, using common WordPress template tags.
  • CSS Style and Markup: Note, in my example below, the presence of the post_class(); tag.  This ensures that WordPress will pickup your formats and add specific and unique CSS classes in your markup, allowing you to use CSS to style each format type differently.  Additionally, within the conditional functions, you can add your own markup to fancy things up a bit using basic HTML and CSS. (example: when I assign the Image format to my post, WordPress adds the following CSS classes in the markup: class=”post type-post format-image” .. just like it always has for categories and tags since version 2.7)

Here is the sample template for post formats.  There are surely other (likely better, easier, cleaner?) ways to go about it – – I created this template as guide to make it as easy to follow for you as I possibly could.  This example  is a very simple, stripped down ….. naked, even ….. template for your reference use.  Expand and contract, at will – – hope it helps you on your way to utilizing Post Formats in the future once 3.1 is officially released!

php get_header(); ?>
<div id="main">
php if (have_posts()) : ?>
php while (have_posts()) : the_post(); ?>
<div id="post-<?<span class=">php the_ID(); ?>" ></div>
		php
			if ( has_post_format( 'aside' )) {
				echo the_content();
			}

			elseif ( has_post_format( 'chat' )) {
				echo '<h3>';
  				echo the_title();
				echo '</h3>';
				echo the_content();
			}

			elseif ( has_post_format( 'gallery' )) {
				echo '<h3>';
  				echo the_title();
				echo '</h3>';
				echo the_content();
			}

			elseif ( has_post_format( 'image' )) {
				echo '<h3>';
  				echo the_title();
				echo '</h3>';
 				echo the_post_thumbnail('medium');
				echo the_content();
			}

			elseif ( has_post_format( 'link' )) {
				echo '<h3>';
  				echo the_title();
				echo '</h3>';
				echo the_content();
			}

			elseif ( has_post_format( 'quote' )) {
				echo the_content();
			}

			elseif ( has_post_format( 'status' )) {
  				echo the_content();
			}

			elseif ( has_post_format( 'video' )) {
				echo '<h3>';
  				echo the_title();
				echo '</h3>';
				echo the_content();
			}

			elseif ( has_post_format( 'audio' )) {
				echo '<h3>';
  				echo the_title();
				echo '</h3>';
				echo the_content();
			}

			else {
				echo '<h3>';
  				echo the_title();
				echo '</h3>';
				echo the_content();
			}
		?>
	</div>
php endwhile; else: endif; ?>
</div>
php get_sidebar();  get_footer(); ?>

Want more? Check out other posts about Post Formats from:

**Disclaimer –> WordPress 3.1 is now in beta. This means that the Post Formats feature is likely to change…possibly.   This post is meant as a helper to give you an idea of what’s coming .. updates will be made to this post in the future should anything change during beta testing.

Look for a redesign here soon! I’m working on integrating Post Formats here … since my books are almost done, I might even resume posting here more regularly!

Do you have a better way to skin this cat?  Do share!

As development continues with Post Formats – I would love to hear what you’re doing with the feature, if you’re using it and how …. drop a line in my comments and brag a little about your handiwork on your own site (or a site you’ve created).  Are there any brave hearts out there who have already installed 3.1 beta and are using the Post Formats feature already??  Do tell!

Hope you all had a fantastic Thanksgiving holiday (for my US readers)!

52 Responses to “WordPress 3.1 Post Formats Reference”

  1. valentmustamin says:

    RT @LisaSabinWilson: #WordPress 3.1 Post Formats Reference http://lisasabin-wilson.com/wordpress-3-

  2. Nazieb says:

    Interesting.

    But what about the recent added ‘custom post type’? Is it going to be different?

  3. Lisa says:

    Post Formats are completely different than Custom Post Types. Check out this post by Mark Jaquith: Post Formats vs Custom Post Types

  4. Lukas_Sparks says:

    RT @LisaSabinWilson: #WordPress 3.1 Post Formats Reference http://lisasabin-wilson.com/wordpress-3-

  5. Nate says:

    Really glad to find your site! I LOVE wordpress for everything website based (ecommerce, basic websites, membership sites, and even blogging :) )

    Look forward to your tips and would love to interview you sometime!

    I’m excited to see what 3.1 does for the website world as I think WordPress is the end-all cure-all for everything web!

    Nate Moller
    MollerMarketing.com

  6. hi miss Lisa,

    I’m currently using WP 3.0. do you think i should upgrade to 3.1 to get these added features? cuz i worry that the theme i’m using now will not be compatible with the latest version of WP.

    thanks in advance!

    • Lisa says:

      Go ahead with the upgrade to 3.1 when it comes out. You can always put up a test site on a domain you reserve just for testing and load your theme on it to see if it breaks before you apply the upgrade to your live site. I usually recommend this for people who worry about upgrades.

  7. Laura says:

    I’ve never used anything for customizing individual posts. I’d rather have the changes for the site overall and give it a uniform look. Keeps it simple for me too.

    I don’t know why they added the option for Header graphics and backgrounds to the WP default 2010 theme but did not also add options to select the fonts and font sizes in the same way. Twenty ten would be a great theme if it had gone just a bit farther in the customizing options.

    One thing I would like to see in your book about Web Design for WP are ways to make CSS changes which are independent of changing your themes.

  8. […] code rendering only the post content differently depending on which post format chosen: http://lisasabin-wilson.com/wordpres…mats-reference If this is the recommended usage then it seems to be outside the scope of post formats to control […]

  9. Vlad says:

    Hi Lisa!

    Very interesting post. WordPress 3.1 seems to be full of new and intriguing features. Guess I’ll upgrade when it comes out.

  10. […] 3: Programming and CSS Lisa Sabin-Wilson has a very informative post regarding how to add theme functionality. Basically, you could turn the WordPress Loop into a giant […]

  11. Metta says:

    Thanks, Lisa, for sharing this helpful preview!

    Has a release date been set for WP 3.1?

  12. […] have been a few articles posted already with examples of how to add support for this in your theme. And they all […]

  13. Haluk says:

    Looks like the post-formats are limited to what would be coming with 3.1. Is it possible to add our own types?

    Example;

    Will I be able to do this;
    add_theme_support( ‘post-formats’, array( ‘aside’, ‘chat’, ‘gallery’, ‘image’, ‘link’, ‘quote’, ‘status’, ‘video’, ‘audio’,’MY_TYPE_HERE’ ) );

    If that’s possible, where do we create the special template? Is it something like single-aside.php, and therefore our custom post format type is expected to be something like single-MY_TYPE_HERE.php?

    And what happens if the matching file is missing. Does the post get served by single.php?

    And finally, can I use this very taxonomy ( post-formats ) in place of creating a taxonomy called Media Type or category called Media Type? In other words, can I have a landing “page”, which pulls together all posts that have been formatted say as “aside”? Without the post-formats, you would have created a taxonomy or a cat for that?

  14. Nick W says:

    Hi Lisa,

    Your post here is a good example of how flexible WordPress can be and still be easy to use. There is still a ton I have yet to explore myself. I’ll definitely be adding your site to my list of wordpress experts.

    Thanks,

    Nick

  15. […] WordPress 3.1 Post Formats Reference by Lisa Sabin Wilson […]

  16. […] designate a post with a specified format. For a thorough write-up on this new feature, go read the post format reference from my friend Lisa […]

  17. […] pages. But there was one wrench that made me slow down and rethink how I was going about this: custom post formats.Custom post types vs. Custom post formatsWhat is the difference between a custom post format and a […]

  18. […] Post Formats This has been implemented in WordPress in roundabout ways. However, 9 different post formats are supported out of the box now in 3.1 They are aside, chat, gallery, link, image, quote, status, video, or audio. Codex: Post Formats Article: Lisa Sabin Wilson […]

  19. […] all my loop elements for all templates.  I had originally thought about just using a bunch of conditionals to include post formats.  But I don’t think that would allow any control through child themes?  So what I did was […]

  20. I have read your post numerous times since first working on my dev 3.1 install. I’m pretty new to really trying to code my own stuff from my own thought process. I read your article, and the other ones out there like Smarter Post Formats and Even Smarter Post Formats. My dilemma was to continue using get template part for loop.php and also use get template part for formats, so child themes could easily override it all. Here’s my attempt…

    http://go.rvoodoo.com/WPformats

    I have no idea if this is a good way to go about it…..but its what I did. But your article was the one that started me thinking, so thanks!

  21. […] Codex on Post Formats Otto on Post Formats Dougal on Post Formats Lisa Sabin Wilson on Post Formats […]

  22. James says:

    Hi Lisa,

    A great article. Thank you for sharing.

    One question. Obviously, your piece of code only calls the title and the content. How would you go about adding such elements as permalink etc?

    else {
    echo ”;
    echo the_title();
    echo ”;
    echo the_content();
    }

    Thanks if you can help…

  23. […] »3.1 Post Formats Reference« von Lisa Sabin-Wilson, die die Post Formats bereits auf ihrem Blog im Einsatz hat. […]

  24. […] For more information on PHP conditionals, if/else statements and comparisons, check out this tutorial from W3Schools. For more examples of how to use this function, check out Lisa Sabin Wilson’s reference. […]

  25. […] get going on using post formats, try going here, here, here, here, and here just to […]

  26. WordPress 3.1 Post Formats Reference | Lisa Sabin-Wilson…

    WordPress 3.1 Post Formats explained. Add theme support for Post Formats, use conditional functions in your template to display different content and styles for your chosen format types…….

  27. Hesham says:

    Really cool stuff Lisa, I was publishing a blog post about the new features that I like in the WP 3.1, and this is so far the best resource I found, so I will include it in my resources to share it on the post!

    Great work!

  28. […] WordPress 3.1 Post Formats Reference by Lisa Sabin-Wilson […]

  29. […] the Admin Bar for specific users – REmove comments link from WordPress admin bar – WordPress 3.1 Post Formats ReferenceAwesome! Let’s see what else WordPress 3.1 have for us!Easy and Fast Internal LinkingTired of […]

  30. […] WordPress 3.1 Post Formats Reference at Lisa Sabin-Wilson […]

  31. MauHG says:

    i only have 1 questions, how i can do a loop of only asides, for example?

  32. Lisa, Thank you for sharing your insights on Post Formats. I borrowed some of your ideas and posted my own version. I did so for my own understanding and also to share my thoughts as well: http://www.whatsthebigidea.com/wordpress-post-formats-tumblr.html

    Here is also a very simple post that I found easy to understand: http://upthemes.com/blog/a-simple-guide-to-wordpress-post-formats/

    Thanks again!

  33. […] So what I have here is essentially every post format possible in the WordPress 3.1 release and the differing formats. I haven’t really customised these much that is coming tomorrow and where I will start to implement these into the blog but this is very much the basic layout which I took(read: stole) from Lisa Sabin-Wilson’s super awesome post about Post Formats. […]

  34. […] WordPress 3.1 Post Formats Reference – tutorial : Adding theme support for Post Formats is not overly complicated […]

  35. max says:

    Thanks for the reference! Great work, Lisa!
    How this “Post Formats” differ from “Custom Post Types”?

  36. […] Read the tutorial at Lisa’s website. […]

  37. […] plenty of tutorials on post formats out there, so I’ll assume you’re more than capable of figuring out how to use […]

  38. […] 1) Post Formats Supports : I love this new feature the most in latest version of WordPress 3.1. This new feature help you in styling a specific post. Now you can show off your different posts in different styling like videos, links, images, audio, statuses etc. This feature will give you chance to give your WordPress blog a Tumblr- like look. Now, this feature is on the floor, theme author has to add few lines of code to their templates and stylesheets. For more information on Post Format and how to use this feature, you can refer to an article written by Lisa Sabin Wilson. […]

  39. […] better suited as custom post types.To get going on using post formats, try going here, here, here, here, and here just to start.Custom post type archivesBy default WordPress 3.0 does not index custom […]

  40. […] WordPress 3.1 Post Formats Reference by Lisa Sabin-Wilson […]

  41. […] I turn to Lisa Sabin-Wilson’s reference on post formats (fantastic resource, by the way).  It uses the “has_post_format” tag to check for specific […]

  42. […] WordPress 3.1 Post Formats Reference by Lisa Sabin-Wilson […]

  43. Jacobus says:

    Hi Lisa, I am a bit late! Thanksgiving has past a couple of times! :-) Just wanted to let you know something. I was looking for something specific (not even 3.1 related as you can imagine) but couldn’t find it but then I found the link to Weblog Tools Collection and got my answer there. Wouldn’t have gotten it without you though. So thanks!

  44. Jacobus says:

    You’re welcome Lisa!