当前位置:首页 > 网站运营 > 正文内容

为wordpress文章图片添加原图链接和图片放大效果

葱子8年前 (2017-05-27)网站运营3354

今天接到用户反馈,葱子的博客文章,点击图片无法查看大图,只能右键新窗口打开看。

这个体验非常的不好。

所以,我今天搜集了下方案,实现了文章页中点击图片放大的效果。

你可以点击下面这张图片试下效果:

问题分析:

1、如何实现点击图片放大的效果?

解决方案:

1、安装wp的插件Auto Highslide,点击下载

插件安装好后,就实现了图片点击放大的效果。

接着又出现新的问题了。

这个点击放大效果需要文章图片本身链接到源文件,很多以往的旧文章里面的图片没有链接到源文件,一个个的修改起来非常的麻烦。

怎么办?

找到了解决办法:

添加下面的JS代码到当前主题header.php模版文件中的<head>标签下方:

<script src="https://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"></script>

<script type="text/javascript">
$(function() {
$('.entry img').each(function(i){
if (! this.parentNode.href) {
$(this).wrap("<a href='"+this.src+"' class='highslide-image' onclick='return hs.expand(this);'></a>");
}
     });
});
</script>

该脚本会检查文章中的图片是否包含了链接,如果没有,会自动为图片添加链接到原图。

修改其中的 .entry 为你主题正文的CSS类。

重点部分我已经标红了,怎么去寻找这个.entry呢?

打开你博客任一篇文章,右键查看源代码:搜索“article”,找到类似的红框中的信息,替换entry即可

扫描二维码推送至手机访问。

版权声明:本文由葱子博客发布,如需转载请注明出处。

本文链接:https://www.aitiancheng.com/article-753.html

相关文章

网页广告被劫持怎么办?是时候为你的网站开启https访问了

网页广告被劫持怎么办?是时候为你的网站开启https访问了

今天葱子在查看收藏大家坛手机端网页的时候,发现文章页面怎么多了这么多的广告位。 看下图:整个页面上出现了四处广告位。其中只有标记为“4”的地方是站长自己设置的广告。其余三处都不是就站长自己设置的。...

centos(Linux)系统如何挂载数据盘

centos(Linux)系统如何挂载数据盘

大部分的网站服务器都是使用的centos作为服务器程序,一旦磁盘空间爆满,就需要更换更大的硬盘。不过现在很多IDC服务商已经支持挂载数据盘了。 下面以阿里云ECS服务器为例,开始讲解centos如何挂载数据盘。...

windows server2008中为IIS7开启https的TLS1_2协议

windows server2008中为IIS7开启https的TLS1_2协议

我们在IIS7上配置了SSL证书后,使用ATS检测,发现服务器不支持TLS1_2协议。 经查询发现,在IIS7中TLS1_2协议是默认关闭的。 所以我们需要对IIS做下设置,来开启...

记录分析我的discuz网站被挂马,快照被劫持的解决过程

就在前几天,我心血来潮检查了下的古玩论坛网站的收录情况,突然发现在各大搜索引擎里面的快照都变成违规信息了。根据我以往的经验,很快判断出是被挂马劫持了快照。 我在之前的文章中给大家讲过挂马后的一些表现,比如在搜索引擎中收录的链接标题都变成了...

Nginx+Apache组合配置discuz的HTTPS访问(SSL)

为什么用Nginx+Apache组合? 用户访问页面的请求到达服务器之后,静态页面又nginx出来,动态页面则交给apache处理。这是因为apache处理静态页面的效率不高,远不及nginx。通过nginx的反向...

discuz网站被挂马,非管理员访问自动跳转到广告页面 怎么解决

discuz网站被挂马,非管理员访问自动跳转到广告页面 怎么解决

你是否遇到过你的网站打开一会就自动跳转到其他页面,而且这个问题是你的用户告诉你的,而你自己却没有遇到? 经过葱子我细心的对挂马网站做排查,终于让我找到了问题所在。 挂马者是通过在discuz的头部js文件里面添加了劫持js代...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。