Quantcast
Channel: Web Design 101 » WordPress
Viewing all articles
Browse latest Browse all 6

WordPress Themes – Enable Post Formats

$
0
0

WordPress logoVersion 3.1 onwards of WordPress has introduced a new feature to your posts called post formats.

A post format is a piece of meta information that can be assigned to posts and used by your theme to customise the look and feel of said post to the end user.

Currently there is little urgent need to use this new feature as it has been included really to keep up with sites such as Tumblr which allow users to set posts to be specific to a type of media upload, a short snippet or quote etc. Choosing a post format in the back end does not change the editor layout – keeping the title and content box as normal.

At the moment they are becoming used by theme developers in website design to allow people to have the ability to display different post “types” such as an audio upload, a video or a quote differently.  Currently here at Web Design 101 we do not use them to their full effect. To set them up in your own theme, follow this tutorial…

Allow Post Formats in Your Theme

To add Post Format support to your current WordPress theme you will need to add the following line of code to functions.php file.

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

If you do not have a functions.php file in the root of your theme folder simple create one.  The above code will allow all post formats to your theme.  Add a new post from the WordPress admin and you will now see a new box called Format.

WordPress Post Formats box

Available Post Formats

WordPress themes support the following Post Formats:

  • aside –  Typically styled without a title. Similar to a Facebook note update.
  • gallery – A gallery of images.
  • link – A link to another site.
  • image – A single image.
  • quote – A quotation.
  • status – A short status update, similar to a Twitter status update.
  • video – A single video.
  • audio – An audio file.
  • chat – A chat transcript.

Standard is the default option and implies that no Post Format choice is made.

Using Post Formats in your WordPress Theme

Using has_post_format() Function

One way to style up the different posts types is to use WordPress function has_post_format().  You can loop through your available formats and style up accordingly:

if (has_post_format('image')){
echo 'This post has a format of IMAGE';
}
else if (has_post_format('chat')){
echo 'This post has a format of CHAT';
}
else{
echo 'This is a standard post with no Post Format meta data.';
}

This is a little inefficient if you loop through all available options, but could be well suited if you want each post format type to look completely different.

Using get_template_part() Function

Instead of looping though each post format type and adding code to your theme template file you can point each type to separate template files.  All you would have to do it add template files in your theme folder such as format-standard.php, format-gallery.php, format-quote.php etc.

if (have_posts()) :
while (have_posts()) : the_post();
if(!get_post_format()){
get_template_part('format', 'standard');
}
else{
get_template_part('format', get_post_format());
}
endwhile;
endif;

A great example of a WordPress theme which has very different looking post formats depending on the set type of the post is theme Shelf… very cool and very creative!

WordPress theme Shelf

Using style rules and post_class() Function

Alternative approach to having radically different post templates is to style up the post format types using CSS and the WordPress function post_class(). Using this function you can add a wrapper div with class for example “format-quote”, “format-gallery” etc.  You can add a simple background image or watermark to add additional style to each type, such as a paper clip for a link post, polaroid for an image post and quote marks for a quote post.


Viewing all articles
Browse latest Browse all 6

Trending Articles