纯代码博客图片添加灯箱效果
作为一个小小站长,一定要把小站打扮得美美的,我们平时在查看图片,图片太小看中不太美观,所以需要给小站添加一个灯箱效果的展示,但是不想用插件的我,终于找到了一款灯箱图片的部署方法,如图:
部署方法:
1.将下列css及js文件下载下来,分别放在你主题下css及js目录下
/**图片灯箱自动给图片加链接**/
add_filter('the_content', 'fancybox');
function fancybox($content){
$pattern = array("https://cdn.hlhasd.com/]*).(bmp|gif|jpeg|jpg|png|swf)('|\")(.*?)>/i","https://cdn.hlhasd.com/]*).(bmp|gif|jpeg|jpg|png|swf)('|\")(.*?)>(.*?)<\/a>/i");
$replacement = array('','$7');
$content = preg_replace($pattern, $replacement, $content);
return $content;
}
在主题下header.php文件head下加入如下代码:
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/jquery.fancybox.min.css">
在主题下footer.php文件</body>前加入如下代码:
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.fancybox.min.js"></script>
快去看看效果吧!~~