如何防止WordPress自动将内联样式应用于发布图像？

时间：2010-09-01 作者：kevtrout

我想知道如何防止WordPress对帖子中包含div的图片应用内嵌样式。

<div class="img size-medium wp-image-3267 alignright" style="width:190px;">

Edit: 帖子在主题文件中生成，使用the_content().

该宽度声明导致我的帖子在内容下方显示一个水平滚动条。奇怪的是，只有当图像设置为右对齐时，水平滚动条才会出现。将图像向左对齐不会导致出现滚动条。

我可以通过设置来删除滚动条。post溢出从“自动”到“隐藏”。

有人知道WordPress是如何应用内联样式的吗？或者如何覆盖它？现在，我已经准备好了。帖子溢出被隐藏，但我担心接下来，这可能会咬到我。

谢谢

3 个回复

最合适的回答,由SO网友:EAMann 整理而成

WordPress不换行<image /> 标记为<div> 默认情况下的元素。。。因此，您的主题或站点上的插件中可能有添加元素包装器的内容。

我建议切换到默认的二十个主题，并禁用插件来比较生成的标记。然后一次重新启用一个插件并切换回主题，以查看哪一组代码正在添加不需要的插件<div> 阻碍。

SO网友:jeremyzilar

检查以下功能：
^{（来源：http://troychaplin.ca/2010/06/remove-automatically-generated-inline-style-on-images-with-caption-in-wordpress/ )}

add_shortcode( \'wp_caption\', \'fixed_img_caption_shortcode\' );
add_shortcode( \'caption\', \'fixed_img_caption_shortcode\' );

function fixed_img_caption_shortcode($attr, $content = null) 
{
    // Allow plugins/themes to override the default caption template.
    $output = apply_filters(\'img_caption_shortcode\', \'\', $attr, $content);

    if ( $output != \'\' ) 
        return $output;

    extract(shortcode_atts(array(
        \'id\'=> \'\',
        \'align\'    => \'alignnone\',
        \'width\'    => \'\',
        \'caption\' => \'\'), $attr));

    if ( 1 > (int) $width || empty($caption) )
        return $content;

    if ( $id ) 
        $id = \'id="\' . esc_attr($id) . \'" \';

    return \'<div \' . $id . \'class="wp-caption \' . esc_attr($align)
    . \'" style="width: \' . ((int) $width) . \'px">\'
    . do_shortcode( $content ) . \'<p>\'
    . $caption . \'</p></div>\';
}

它帮助我自定义默认的WP图像短代码。

SO网友:Troy Chaplin

Jeremy提供的指向我的原始博客的链接对于运行3.2或之前版本的WordPress站点很有用（不确定是否运行3.3，尚未测试），但我最近注意到它不适用于3.4。我还没有机会更新或写一篇关于它的新帖子，但这里有一个修改过的函数可以处理它：

add_shortcode(\'wp_caption\', \'fixed_img_caption_shortcode\');
add_shortcode(\'caption\', \'fixed_img_caption_shortcode\');
function fixed_img_caption_shortcode($attr, $content = null) {

if ( ! isset( $attr[\'caption\'] ) ) {
    if ( preg_match( \'#((?:<a [^>]+>\\s*)?<img [^>]+>(?:\\s*</a>)?)(.*)#is\', $content, $matches ) ) {
        $content = $matches[1];
        $attr[\'caption\'] = trim( $matches[2] );
    }
}

$output = apply_filters(\'img_caption_shortcode\', \'\', $attr, $content);
if ( $output != \'\' )
    return $output;

extract(shortcode_atts(array(
    \'id\' => \'\',
    \'align\' => \'alignnone\',
    \'width\' => \'\',
    \'caption\' => \'\'
), $attr));

if ( 1 > (int) $width || empty($caption) )
    return $content;

if ( $id ) $id = \'id="\' . esc_attr($id) . \'" \';

return \'<div \' . $id . \'class="wp-caption \' . esc_attr($align) . \'" style="width: \' . $width . \'px">\'
. do_shortcode( $content ) . \'<p class="wp-caption-text">\' . $caption . \'</p></div>\';
}

结束

标签： formatting 小码农

小码农CODE

如何防止WordPress自动将内联样式应用于发布图像？

相关推荐