免插件实现Wordpress图片特效显示

自从用了这个简洁主题之后,以现很多功能都没了,于是又开始折腾旅程了,这不今天开始捣鼓图片特效了,Wordpress没装特效时点击图片会直接连接到图片地址,想继续看文章时就得使用“倒退”了,挺不方便的,所以得改改。话说到这里,其实很多插件都有这个功能,可又不想去安装,唉!还是把插件本地化吧,整合去。先去http://fancyapps.com/fancybox/下载这个盒子特效,下载后解压,提取source文件夹中如下几个基本文件:

blank.gif
fancybox_loading.gif
fancybox_loading@2x.gif
fancybox_overlay.png
fancybox_sprite.png
fancybox_sprite@2x.png
jquery.fancybox.css
jquery.fancybox.pack.js

将这些文件保存到新建目录fancybox(可以自己定义名称,只要和后面一样就行),接着在function.php文件中加入代码:

//自动添加暗箱标签属性
add_filter('the_content', 'pirobox_gall_replace');
function pirobox_gall_replace ($content)
{ global $post;
$pattern = "/]*).(bmp|gif|jpeg|jpg|png)('|")(.*?)>(.*?)/i";
$replacement = '$7';
$content = preg_replace($pattern, $replacement, $content);
return $content;
}

再在header.php或者footer.php文件中加入代码:

<link rel=“stylesheet” type=“text/css” href=“<?php bloginfo(‘template_url’) ?>/fancybox/jquery.fancybox.css” />
<script src=“<?php bloginfo(‘template_url’) ?>/fancybox/jquery.fancybox.pack.js”></script>
<script type=“text/javascript”>
$(function() {
jQuery(“.gallery a”).attr({rel: “fancybox”});
jQuery(“a[rel=fancybox]”).fancybox();
});
</script>

这段里的fancybox就是刚才我新建的目录,所以如果你自己是其它名字的话,也在代码里改一下。
好了,图片暗箱显示特效就大功告成了!


说点什么?