Starting in Wordpress 3.9, you can add a line of code to functions.php to tell Wordpress to output images with captions with the more semantic figure and figcaption elements:
add_theme_support( 'html5', array(
'search-form', 'comment-form', 'comment-list', 'gallery', 'caption'
) );
This is great. But for some reason Wordpress adds an inline style for width to the figure element, which prevents the whole unit from being responsive. That's not great. I'd like to add some code to the functions.php that tells Wordpress to not include the inline width.
In the media.php file, I found the caption shortcode that addresses my issue:
$output = apply_filters( 'img_caption_shortcode', '', $attr, $content );
if ( $output != '' )
return $output;
$atts = shortcode_atts( array(
'id' => '',
'align' => 'alignnone',
'width' => '',
'caption' => '',
'class' => '',
), $attr, 'caption' );
$atts['width'] = (int) $atts['width'];
if ( $atts['width'] < 1 || empty( $atts['caption'] ) )
return $content;
if ( ! empty( $atts['id'] ) )
$atts['id'] = 'id="' . esc_attr( $atts['id'] ) . '" ';
$class = trim( 'wp-caption ' . $atts['align'] . ' ' . $atts['class'] );
if ( current_theme_supports( 'html5', 'caption' ) ) {
return '<figure ' . $atts['id'] . 'style="width: ' . (int) $atts['width'] . 'px;" class="' . esc_attr( $class ) . '">'
. do_shortcode( $content ) . '<figcaption class="wp-caption-text">' . $atts['caption'] . '</figcaption></figure>';
}
Any ideas how to remove the inline style width from the figure element?
Edit: I found the solution here.
There is a filter for your question:
Any ideas how to remove the inline style width from the figure element?
add_filter('img_caption_shortcode_width', '__return_false');
This leaves the figure element without any style attribute crap
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With