众所周知,7b2主题是没有图片灯箱效果的,所以一般大家都是使用插件来使用灯箱,插件或多或少都会拉低网站速度,唔,还是不推荐大家使用灯箱插件,这里我整理了全代码集成FancyBox灯箱,摆脱无用插件
[content_hide]
首先在header.php引入 jQuery 和 FancyBox 文件引入位于 之前
<script src="//code.jquery.com/jquery-3.3.1.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
将下面的代码放入你 7b2 主题下的 functions.php 文件中即可实现效果
/**FancyBox图片灯箱**/
add_filter('the_content', 'fancybox1');
add_filter('the_content', 'fancybox2');
function fancybox1($content){
global $post;
$pattern = "/<img(.*?)src=('|\")([^>]*).(bmp|gif|jpeg|jpg|png|swf)('|\")(.*?)>/i";
$replacement = '<a$1href=$2$3.$4$5 data-fancybox="images"><img$1src=$2$3.$4$5$6></a>';
$content = preg_replace($pattern, $replacement, $content);
return $content;
}
function fancybox2($content){
global $post;
$pattern = "/<a(.*?)href=('|\")([^>]*).(bmp|gif|jpeg|jpg|png|swf)('|\")(.*?)>(.*?)<\/a>/i";
$replacement = '<a$1href=$2$3.$4$5 data-fancybox="images"$6>$7</a>';
$content = preg_replace($pattern, $replacement, $content);
return $content;
}
[/content_hide]



无法正常显示图片,打开后直接错误
请问这段 functions.php 中的代码放到哪个位置合适呀,放到头尾就会报错
不懂建议加我QQ:82719519
啊?可以技术指导吗请问
可以提供一定程度上的指导
感谢分享
控制台滑动图片一堆报错,也不支持webp
格式自己按照代码里的规格添加,控制台问题看看是不是你使用的子主题或其他代码冲突了
后续修复部分子主题不可用的教程: https://www.lsenyu.cn/19639.html
试过了, 浏览器控制台报错 Unable to preventDefault inside passive event listener invocation.
webp格式点击有反应但是看不到图
古腾堡wp-block-image 用不了 :a2:
能不能将侧面显示小图改成下面显示小图!
看一下交流群
添加后小图在侧面,鹿语小图在下面
白买了,跟我想的一样?
买个教训hhh
极主题引用不了的,需要改代码,但是我没有买极主题,是没办法测试代码的
我也没有买
不生效可能是加载不了灯箱文件,网上下载灯箱文件或者下载森鹿语同款灯箱文件(交流群内下载)上传服务器自己修改链接路径对照好文件名
7b2完美教程来了:https://www.lsenyu.cn/19639.html
这个代码是现在这个站的同款灯箱嘛 :a23:
一样都是FancyBox灯箱