From e16aa0e9436917f5a8513fa470449e191ce05320 Mon Sep 17 00:00:00 2001
From: Ben Word <ben@benword.com>
Date: Mon, 11 Jun 2012 22:31:08 -0600
Subject: [PATCH] Use <figure> & <figcaption> for captions

---
 css/app.css     | 2 ++
 inc/cleanup.php | 8 +++++---
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/css/app.css b/css/app.css
index e0dee85..c8e9863 100644
--- a/css/app.css
+++ b/css/app.css
@@ -86,6 +86,8 @@ ol.commentlist img.avatar { float: left; margin-right: 10px; }
 .alignleft { margin: 0 20px 20px 0; float: left; }
 .alignright { margin: 0 0 20px 20px; float: right; }
 
+figure.alignnone { margin-left: 0; margin-right: 0; }
+
 
 
 /* =============================================================================
diff --git a/inc/cleanup.php b/inc/cleanup.php
index 2bf1cee..ec8a185 100644
--- a/inc/cleanup.php
+++ b/inc/cleanup.php
@@ -345,6 +345,7 @@ add_filter('wp_get_attachment_link', 'roots_attachment_link_class', 10, 1);
 
 /**
  * Add Bootstrap thumbnail styling to images with captions
+ * Use <figure> and <figcaption>
  *
  * @link http://justintadlock.com/archives/2011/07/01/captions-in-wordpress
  */
@@ -372,10 +373,10 @@ function roots_caption($output, $attr, $content) {
   $attributes .= ' class="thumbnail wp-caption ' . esc_attr($attr['align']) . '"';
   $attributes .= ' style="width: ' . esc_attr($attr['width']) . 'px"';
 
-  $output  = '<div' . $attributes .'>';
+  $output  = '<figure' . $attributes .'>';
   $output .= do_shortcode($content);
-  $output .= '<div class="caption"><p class="wp-caption-text">' . $attr['caption'] . '</p></div>';
-  $output .= '</div>';
+  $output .= '<figcaption class="caption wp-caption-text">' . $attr['caption'] . '</figcaption>';
+  $output .= '</figure>';
 
   return $output;
 }
@@ -721,3 +722,4 @@ function roots_embed_wrap($cache, $url, $attr = '', $post_ID = '') {
 
 add_filter('embed_oembed_html', 'roots_embed_wrap', 10, 4);
 add_filter('embed_googlevideo', 'roots_embed_wrap', 10, 2);
+