Post on 15-May-2015
description
POST FORMATSa new 3.1 feature
Wednesday, April 13, 2011
HI, I’M ALISON
i’ve worked with wordpress for last 5 years or so.i’m big on front-end design, UI, etc
twitter : @alisonmfsite: alisonfoxall.com
Wednesday, April 13, 2011
POST FORMATSas defined in the Codex
A Post Format is a piece of meta information that can be used by a
theme to customize its presentation of a post. The Post Formats feature provides a standardized list of formats that are available to all themes
that support the feature. New formats cannot be introduced by themes
nor even plugins. The standardization of this list provides both compatibility between numerous themes and an avenue for external
blogging tools to access to this feature in a consistent fashion.
In short, with a theme that supports Post Formats, a blogger can change how each post looks by choosing a Post Format from a radio-button list.
http://codex.wordpress.org/Post_Formats
Wednesday, April 13, 2011
WHAT?what is this term?
Wednesday, April 13, 2011
TUMBLR-STYLE POSTSsame blog, posts formatted in different ways
Wednesday, April 13, 2011
matt’s blog
Wednesday, April 13, 2011
regular postWednesday, April 13, 2011
post with only a link (top) & post as an aside (bottom)
Wednesday, April 13, 2011
tumblr theme
Wednesday, April 13, 2011
example of a chat in tumblr
Wednesday, April 13, 2011
OK, COOL.but couldn’t we do this already before with custom post types
or custom taxonomies?
Wednesday, April 13, 2011
STANDARDS, MY FRIEND■ aside - Typically styled without a title. Similar to a Facebook note update.
■ gallery - A gallery of images. Post will likely contain a gallery shortcode and will have image
attachments.
■ link - A link to another site. Themes may wish to use the first <a href=””> tag in the post
content as the external link for that post. An alternative approach could be if the post consists
only of a URL, then that will be the URL and the title (post_title) will be the name attached to
the anchor for it.
■ image - A single image. The first <img /> tag in the post could be considered the image.
Alternatively, if the post consists only of a URL, that will be the image URL and the title of the
post (post_title) will be the title attribute for the image.
■ quote - A quotation. Probably will contain a blockquote holding the quote content.
Alternatively, the quote may be just the content, with the source/author being the title.
■ status - A short status update, similar to a Twitter status update.
■ video - A single video. The first <video /> tag or object/embed in the post content could be
considered the video. Alternatively, if the post consists only of a URL, that will be the video
URL. May also contain the video as an attachment to the post, if video support is enabled on the
blog (like via a plugin).
■ audio - An audio file. Could be used for Podcasting.
■ chat - A chat transcript
http://codex.wordpress.org/Post_FormatsWednesday, April 13, 2011
POST TYPES VS. POST FORMATSwhat’s the difference?
well, what’s the difference between advertising and marketing?
Wednesday, April 13, 2011
THIS IS THEME DEVELOPMENT!
REMEMBER: with any custom post types, custom taxonomies, and post formats, one thing to realize:
these features are activated at the theme level, meaning that switching from theme to theme
you WILL lose front-end functionality.
Wednesday, April 13, 2011
ADDING SUPPORTis as easy as adding menu support. throw this in your
functions.php file of your theme folder.
add_theme_support( 'post-‐formats', array( 'aside', 'status' ) );
add_post_type_support( 'page', 'post-‐formats' );
Wednesday, April 13, 2011
USAGEit’s activated on my theme, now how do I style it all?
Wednesday, April 13, 2011
3 WAYS
1. conditionals2. CSS level
3. template parts
Wednesday, April 13, 2011
CONDITIONALS
holy toledo!
while ( the_loop() ): if ( has_post_format( 'gallery' ) ) : // big block of HTML to format a gallery post elseif ( has_post_format( 'video' ) ) : // big block of similar HTML to format a video post elseif ( has_post_format( 'image' ) ) :
// big block of similar HTML to format an image post elseif ( has_post_format( 'aside' ) ) :
// big block of similar HTML to format an aside else : // big block of similar HTML to format other post endif;
endwhile;
Wednesday, April 13, 2011
CSS LEVEL
unable to manipulate markup. easy fix for a few things.
.format-‐status h2 {display: none;}
.format-‐status p {text-‐decoration:underline;}
Wednesday, April 13, 2011
TEMPLATE PARTSdivision in files (like custom pages)
while ( the_loop() ): get_template_part( 'format', get_post_format() );
endwhile;
http://dougal.gunters.org/blog/2010/12/10/smarter-post-formats
Wednesday, April 13, 2011