添加类img-response对wordpress中所有附加的帖子图像

时间:2014-04-29 13:09:40

标签: php html css wordpress

我想添加class = img-reponsive& img-shadow到所有附加的帖子缩略图 我使用了以下功能,它可以正常工作,但它删除了原始的thubmails类

function add_responsive_class($content){

        $content = mb_convert_encoding($content, 'HTML-ENTITIES', "UTF-8");
        $document = new DOMDocument();
        libxml_use_internal_errors(true);
        $document->loadHTML(utf8_decode($content));

        $imgs = $document->getElementsByTagName('img');
        foreach ($imgs as $img) {           
           $img->setAttribute('class','img-responsive img-shadow');
        }

        $html = $document->saveHTML();
        return $html;   
}

但我想合并我的课程而不仅仅是覆盖它们 所以我使用了jquery

 jQuery(function() {
jQuery(img).addClass('img-responsive img-shadow ');
});

但它给出的错误jquery没有定义

请帮帮我

3 个答案:

答案 0 :(得分:7)

function add_image_responsive_class($content) {
   global $post;
   $pattern ="/<img(.*?)class=\"(.*?)\"(.*?)>/i";
   $replacement = '<img$1class="$2 img-responsive img-shadow"$3>';
   $content = preg_replace($pattern, $replacement, $content);
   return $content;
}
add_filter('the_content', 'add_image_responsive_class');

答案 1 :(得分:0)

为什么不用你的函数重新添加原始类?

function add_responsive_class($content){

        $content = mb_convert_encoding($content, 'HTML-ENTITIES', "UTF-8");
        $document = new DOMDocument();
        libxml_use_internal_errors(true);
        $document->loadHTML(utf8_decode($content));

        $imgs = $document->getElementsByTagName('img');
        foreach ($imgs as $img) {           
           $img->setAttribute('class','thumbnails img-responsive img-shadow');
        }

        $html = $document->saveHTML();
        return $html;   
}

答案 2 :(得分:0)

如果您正在使用上面提到的DOMDocument方法,这可能会导致utf编码问题,尤其是在通过内容编辑器使用特殊字符时,例如:£被置于?或其他奇怪的人物。你可以遍历$ img,然后在$ content上使用str_replace,但使用“终结器”方法对我来说效果更好。