WordPress [caption] 多出来 10px 的问题

最近在使用caption时发现 WordPress 的一个新问题,如:

<img src="example.com/image.jpg" alt="This is a caption" title="XYZ" width="100" height="100" /> This is a caption

那么,在浏览器中会看到实际的宽度被额外加了 10px。
Google 这个关键字,真发现有这样的问题,下面是关于 多出来 10px 的讨论链接:http://wordpress.org/support/topic/10px-added-to-width-in-image-captions
从讨论贴的日期可以看出这个问题由来很久,为什么还没有解决?

解决办法

在你的 functions.php 中加入下面的代码:

add_filter( 'img_caption_shortcode', 'cleaner_caption', 10, 3 );
function cleaner_caption( $output, $attr, $content ) {
    /* We're not worried abut captions in feeds, so just return the output here. */
    if ( is_feed() )
        return $output;
    /* Set up the default arguments. */
    $defaults = array(
        'id' => '',
        'align' => 'alignnone',
        'width' => '',
        'caption' => ''
    );
    
    /* Merge the defaults with user input. */
    $attr = shortcode_atts( $defaults, $attr );
    /* If the width is less than 1 or there is no caption, return the content wrapped between the < tags. */
    if ( 1 > $attr['width'] || empty( $attr['caption'] ) )
        return $content;
    /* Set up the attributes for the caption <div>. */
    $attributes = ( !empty( $attr['id'] ) ? ' id="' . esc_attr( $attr['id'] ) . '"' : '' );
    $attributes .= '';
    $attributes .= ' style="width: ' . esc_attr( $attr['width'] ) . 'px"';
    /* Open the caption <div>. */
    $output = '<div' . $attributes .'>';
    /* Allow shortcodes for the content the caption was created for. */
    $output .= do_shortcode( $content );
    /* Append the caption text. */
    $output .= '<p>' . $attr['caption'] . '</p>';
    /* Close the caption </div>. */
    $output .= '</div>';
    /* Return the formatted, clean caption. */
    return $output;
}

以上代码出自这里,感谢作者!

发表评论