我已经使用Wordpress多年了。每当我向文章中添加图像时,我都会手动写出每个图像的所有HTML。我还使用了一个名为Highslide的图像灯箱插件,供人们放大我的缩略图。链接到较大图像的缩略图示例在我的手动HTML中如下所示:
<a href="large-file.jpg" rel="highslide" class="highslide"><img src="thumbnail.gif"></a>
但现在我已经安装了最新版本的Wordpress,可以很容易地将图像直接添加到文章中,而无需编写任何HTML。我得到的输出是:
<a href="http://site.com/newwp/wp-content/uploads/2012/12/file.jpg"><img class="alignright size-medium wp-image-24971" alt="file" src="http://file.com/newwp/wp-content/uploads/2012/12/file-196x300.jpg" width="196" height="300" /></a>
我想做的是修改Wordpress,以便在插入链接图像时自动将rel=“highslide”和class=“highslide”添加到链接中,从而使highslide插件工作。我猜最终结果如下:
<a href="http://site.com/newwp/wp-content/uploads/2012/12/file.jpg" rel="highslide" class="highslide"><img class="alignright size-medium wp-image-24971" alt="file" src="http://file.com/newwp/wp-content/uploads/2012/12/file-196x300.jpg" width="196" height="300" /></a>
我查看了核心文件,但不知道Wordpress在插入图像时在哪里生成HTML。那么,有人知道如何修改Wordpress来添加这两个属性吗?我真的很感激你的帮助!:)非常感谢。
最合适的回答,由SO网友:Rob Vermeer 整理而成
此过滤器检查发送到编辑器的html图像中是否有锚定,如果是,则向锚定添加rel和class。
function add_highslide_attr( $html ) {
preg_match_all(\'/(<a[^>]*>)(.*)/i\', $html, $result);
if( !isset($result) || !isset($result[1][0]) || ! $result[1][0] )
return $html;
$anchor = $result[1][0];
if( strstr($anchor, \'rel=\') )
$anchor = str_replace(\'rel="\', \'rel="highslide \', $anchor);
else
$anchor = str_replace(\'href=\', \'rel="highslide" href=\', $anchor);
if( strstr($anchor, \'class=\') )
$anchor = str_replace(\'class="\', \'class="highslide \', $anchor);
else
$anchor = str_replace(\'href=\', \'class="highslide" href=\', $anchor);
$html = $anchor . $result[2][0];
return $html;
}
add_filter( \'image_send_to_editor\', \'add_highslide_attr\', 10 );