Use HTML5 Figure and Caption Elements in WordPress

If you want to use HTML5 figure and caption elements within your theme, this is a simple snippet that will make things easy as pie. Just add this snippet to the functions.php of your WordPress theme and you’ll automatically add HTML when you insert images into posts.

   <img src="/picture.jpg" alt="some sample picture">
<figcaption>Cool sample picture of something interesting. Original by <a href="http://wpsnipp.com">Kevin Chard</a></figcaption>
function wpsnipp_figure_caption($html, $id, $caption, $title, $align, $url) {
  $html5 = "<figure id='post-$id media-$id' class='align-$align'>";
  $html5 .= "<img src='$url' alt='$title' />";
  if ($caption) {
    $html5 .= "<figcaption>$caption</figcaption>";
  $html5 .= "</figure>";
  return $html5;
add_filter( 'image_send_to_editor', 'wpsnipp_figure_caption', 10, 9 );

Comments  Leave a Reply

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

WordPress Launch Checklist

The Ultimate WordPress Launch Checklist

We've compiled all the essential checklist items for your next WordPress website launch into one handy ebook.
Yes, Send Me the Free eBook!