给你的wordpress添加文章内图片鼠标点击放大浏览的功能吧~
注:笔者已启用WP Githuber MD插件使用Markdown语法进行文章编辑,启用的主题为generatepress。
1、进入你的宝塔面板首页
点击文件选项:
2、分别找到以下几个文件进行修改
2.1、header.php
<!-- 图片放大 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
2.2、footer.php
<!-- 图片放大 -->
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
2.3、functions.php
/**图片灯箱自动给图片加链接**/
add_filter('the_content', 'fancybox');
function fancybox($content){
$pattern = array("/<img(.*?)src=('|\")([^>]*).(bmp|gif|jpeg|jpg|png|swf)('|\")(.*?)>/i","/<a(.*?)href=('|\")([^>]*).(bmp|gif|jpeg|jpg|png|swf)('|\")(.*?)>(.*?)<\/a>/i");
$replacement = array('<a$1href=$2$3.$4$5 data-fancybox="gallery"><img$1src=$2$3.$4$5$6></a>','<a$1href=$2$3.$4$5 data-fancybox="images"$6>$7</a>');
$content = preg_replace($pattern, $replacement, $content);
return $content;
}
保存退出之后再次点击查看你的文章会出现如下效果:
给你的wordpress添加文章内图片鼠标点击放大浏览的功能吧~的更多相关文章
- wordpress 解决文章内http链接问题
1. 登录Wordpress后台, 常规设置 > 里面把站点URL 修改成 https开头 2. 登录phpmyadmin , 执行替换链接的SQL 替换wordpress配置的链接地址 (可 ...
- wordpress添加文章固定字段
让wordpress的文章数据表 增加一个字段,使其能在文章编辑页能编辑,并能通过rest api 获取出来. 例:给文章加一个缩略图字段 litpic 首先 通过mysql 给文章表 wp_post ...
- Winform 图片鼠标滚动查看(放大,缩小,旋转,拖动查看)[日常随笔]
方法千千万,我只是其中一笔[通过控制PictureBox来控制图片,图片完全施展在控件中]...几久不做,还真有点陌生! 窗体构造中添加鼠标滚动: /// <summary> /// 窗体 ...
- Android浏览图片,点击放大至全屏效果
做到照片浏览的功能,对于QQ空间中点击图片放大至全屏,感觉效果很赞,于是也做了个类似的效果.如下. 我不知道QQ那个是怎么做的,我的思路如下: 首先,从图片缩略界面跳转到图片详情页面,应该是从一个Ac ...
- wordpress添加文章浏览统计(刷新不重复)
wordpress本身不带文章浏览统计,可以用插件wp-postview,但是刷新还是算一个浏览次数. 1.首先在主题下functions.php里增加以下代码,这段代码也是网上可以找到的 //add ...
- wordpress添加文章阅读数量
将下面代码添加到functions.php //取得文章的阅读次数 function post_views($before = '点击 ', $after = ' 次', $echo = 1) { g ...
- 【PyQt5-Qt Designer】添加图片+鼠标点击
添加图片+鼠标点击 graphicsView中添加图片 效果图 添加之后左边1处 生成qrc文件 选择文件右键编译-生成图片的16进制文件 课后作业:
- Android 响应webview中图片的点击事件
最近碰到个新需求需要点击webview中的图片进行放大显示. 整理了下思路,想到了下面的一个可行的方案. 方案思路, 1.在点击图片的时候调用本地的java方法并给出响应的图片地址 2.本地获得图片地 ...
- html图片上传阅览并且点击放大
关闭 qq_31540195的博客 目录视图 摘要视图 订阅 异步赠书:9月重磅新书升级,本本经典 程序员9月书讯 每周荐书: ...
- Android中Textview显示Html,图文混排,支持图片点击放大
本文首发于网易云社区 对于呈现Html文本来说,Android提供的Webview控件可以得到很好的效果,但使用Webview控件的弊端是效率相对比较低,对于呈现简单的html文本的话,杀鸡不必使用牛 ...
随机推荐
- vmware之NAT模式配置
题外话之前的题外话,本文迁移自别的社区,三年前大学实习时写下本文,过了几年再回过头来看,虽然讲得浅显,作为入门笔记也勉强合格. ---------------------------------- ...
- C# readonly修饰符
readonly修饰符在作祟 强化官方解释: readonly是一个修饰字段的关键字:被它修饰的字段只有在初始化或者构造函数中才能够赋值. readonly修饰的引用类型字段必须始终引用同一对象: r ...
- 循环掌控:深入理解C语言循环结构,高效实现重复性任务
欢迎大家来到贝蒂大讲堂 养成好习惯,先赞后看哦~ 所属专栏:C语言学习 贝蒂的主页:Betty's blog 引言 前面贝蒂带大家了解了选择结构,今天就来为大家介绍循环结构,也就是我们熟悉的while ...
- RK3588开发笔记(一):基于方案商提供的宿主机交叉编译Qt5.12.10
前言 rk3588开发车机,方案上提供的宿主机只是编译rk sdk的版本,并未编译好Qt,那么需要自行交叉编译Qt系统.选择的Qt的版本为5.12.10. 宿主机准备 下载并打开宿主机,只 ...
- window上使用Putty通过ssh远程连接并通过Xming实现X11图形界面功能
# 0.先确认远程服务器的ssh配置 >>> grep X11 /etc/ssh/sshd_config X11Forwarding yes #X11DisplayOffset 10 ...
- VMware虚拟机Ubuntu系统如何占满整个屏幕
VMware虚拟机Ubuntu系统分辨率调节 桌面右击--Disoplay Settings 选择一个跟本机系统一样或者相近的.(本机小米笔记本win11,具体看自己的情况) 结束.
- 为什么HashMap的键值可以为null,而ConcurrentHashMap不行?
写在开头 昨天在写<HashMap很美好,但线程不安全怎么办?ConcurrentHashMap告诉你答案!>这篇文章的时候,漏了一个知识点,知道晚上吃饭的时候才凸显想到,关于Concur ...
- 【转载】大数据OLAP系统--开源组件方案对比
开源大数据OLAP组件,可以分为MOLAP和ROLAP两类.ROLAP中又可细分为MPP数据库和SQL引擎两类.对于SQL引擎又可以再细分为基于MPP架构的SQL引擎和基于通用计算框架的SQL引擎: ...
- 智能升级:AntSK教你如何让聊天机器人实现智能联网操作
随着人工智能技术的飞速发展,智能体已经逐步融入到我们的日常生活中.不过,要想让智能体不仅能聊天,还能接入网络实时获取信息,为我们提供更多便利,所需技术的复杂性不得不让人瞩目.今天,我将和各位分享如何在 ...
- docker构建带ik分词器Elasticsearch镜像
创建Dockerfile 文件: FROM elasticsearch:7.4.2 RUN cd /usr/share/elasticsearch && sh -c '/bin/ech ...