Three/Unite主题如何增加图片弹窗功能的详细教程

原创 懿古今  2016-04-18  阅读 577 次

对于图片弹窗的功能我一直都不太感冒,毕竟大部分文章的图片都是处理过的,一般都是宽在500-600PX左右,点击放大也就那么大,所以感觉意义不大。而且一篇文章的图片本来就不多,一般都是看文章内容的时候就顺便看图片了,应该很少有人会点击图片来注意查看。不过应部分博主的要求,已将Nana主题增加了图片弹窗功能,现将Three/Unite主题增加图片弹窗功能的详细教程分享给大家。

Three/Unite主题如何增加图片弹窗功能的详细教程

Three/Unite主题增加图片弹窗功能的详细步骤如下:

1、下载“Three-Unite主题如何增加图片弹窗功能所需文件”压缩包,解压后得到两个文件,其中fancybox.js文件上传覆盖Three/Unite主题js文件夹的fancybox.js;addclass.php文件上传到Three/Unite主题\inc\functions\文件夹内。

2、打开Three/Unite主题的functions.php文件,在恰当的位置,如最后一个?>的前面添加以下代码:

  1. // 图片属性
  2. require get_template_directory() . '/inc/functions/addclass.php';

3、因为图片弹窗的一些按钮需要用到个性化图标,所以建议安装font awesome 4 menus插件。PS:导航菜单的个性化图标也是用到这个插件。

到了这里,我们就已经成功为Three/Unite主题添加了图片弹窗功能,大家赶紧试试效果吧。具体效果请点击本文的图片试试。

重要提示:

在编辑文章插入图片时,从URL插入(外链)必须选择链接到:图像URL;本地上传,必须选择链接到:媒体文件,并且图片名称不能为中文汉字(PS:插入图片时一般不用输入图片名称,一般都是输入alt属性而已),否则不会启用图片lightbox查看。另外,图片对齐方式不能为空,必须选择一种对齐方式,建议选择居中。

本文地址:http://yigujin.cn/718.html
关注我们:请关注一下我们的微信公众号:扫描二维码,公众号:aiboke112
版权声明:本文为原创文章,版权归 懿古今 所有,欢迎分享本文,转载请保留出处!

文件下载

boke112导航-免费收录独立博客

WordPress免费清新BLOG/CMS响应式主题Nana专题文章
WordPress免费响应式主题:Nana

发表评论


表情

  1. 微童年
    微童年 【市长】 @回复

    博主还是比较上进的人啊,经常可以看到您的身影,我这边还在纠结,有没有勇气像松松那样,转PHP了

    • 懿古今
      懿古今【站长】 @回复

      @微童年 其实不用纠结的,如果喜欢PHP就转,毕竟ASP转PHP还是很简单的,何况你的站点文章还不算多

  2. 楚书业
    楚书业 【县长】 @回复

    我现在比较少用图片。

  3. Koolight
    Koolight 【市长】 @回复

    我一般插入图片都是在用代码了,所以目前都不显弹窗功能。

    • 懿古今
      懿古今【站长】 @回复

      @Koolight 我一般都是一片文章就配一张图片,所以不喜欢用弹窗