网站建设

WordPress评论滑动/拉链解锁myQaptcha代码版及部署方法

Jager · 9月20日 · 2014年 988次已读

虽然博客取消了文章页面评论,仅剩下留言板的评论,但张戈还是要尽力做到尽善尽美,将用户体验做到极致!在防止垃圾评论的同时,尽量让评论变得更加简单快捷。

于是就想到了很早之前就很眼馋的滑动解锁功能,可惜那时候太菜 B,安装后发现拖不动,也就没继续折腾了。现在把多说去掉了,是时候研究下这个清爽又华丽的“拉链”解锁了!

当我搜索安装 myQaptcha 插件并启用之后,发现居然可以用了!原来之前拖不动是因为 JQ 太旧了,最近为了解决代码高亮问题,把 JQ 升级到了 1.8.2 版本,从而解决了这个问题。

WordPress评论滑动/拉链解锁myQaptcha代码版及部署方法WordPress评论滑动/拉链解锁myQaptcha代码版及部署方法

看了下插件加载后的代码,觉得自己应该有能力换成代码实现,折腾了半天,终于搞定了,虽然我并不排斥用插件,不过能不用就不用吧。

废话不多说,下面说下免插件集成 Qaptcha 滑动解锁的具体方法:

一、下载代码

张戈已将修改好的代码打包上传,有需要的朋友可以下载:

二、部署代码

将我提供的压缩包解压,得到一个 myQaptcha 的文件夹,然后上传到主题目录,比如知更鸟的传完后的路径应该是..../HotNewspro/myQaptcha

然后编辑主题目录下的函数文件 functions.php,添加如下代码即可:

include("myqaptcha/myQaptcha.php");

WordPress评论滑动/拉链解锁myQaptcha代码版及部署方法

Ps:如果不知道添加到哪,就加到最后一行的 ?>之前即可。

保存后,你可以去能够留言的页面查看是否加载成功了!

三、修改代码

做完第二步之后,若刷新页面发现没有加载滑动解锁,说明你主题的评论框用的元素 ID 不是 comment,解决办法有 2 个,要不就修改 myQaptcha.php,要不就新增一个符合要求的标签。

修改 myQaptcha.php 需要对照主题的元素 ID,这个很多朋友犯迷糊,不懂怎么弄,这里就不说了。

增加符合要求的标签,方法很简单:

我们只需要编辑主题评论模板 comments.php,在合适的位置添加如下代码即可:

<div id="comment"></div>

这个标签是滑动解锁加载的标记位置,没有这个标签,就不会出现滑动模块了。

Ps:第三步的修改仅用于没有出现滑动模块的情况,重复添加会出现多个模块!

四、加载调整

代码默认是在文章和单页面加载,如果你的博客和张戈的一样,只是留言板可以留言,那文章页面完全不需要去加载相关的 js 和 css,影响加载速度。

修改方法:

编辑 myQaptcha 文件夹下的 myQaptcha.php,找到如下代码(第 11 行):

if ( is_singular() && !is_user_logged_in()) {

按照你的需求修改即可,比如张戈博客只需要在留言板页面加载这个功能,那么我需要如下修改:

if (is_page('liuyan') && !is_user_logged_in()) {

即只在页面名称为 liuyan,且用户未登录的情况加载,若是其他需求,依葫芦画瓢修改即可,相信难不倒你!

另外,如果发现出现拖不动的情况,请检查 JQuery 加载是否出现异常,或者将 JQuery 版本升级,比如张戈博客现在用的 JQ 版本是 1.8.2。

好了,这篇教程就介绍到这里,不喜欢折腾的朋友可以通过安装插件实现,有洁癖、有强迫症的朋友可以参考本文给自己的评论加一个拉链,还是不错的!最后,按惯例申明下,此代码纯属个人学习折腾之作,版权依然归原作者[三十岁]所有!

Ps:张戈博客已经发文分享了目前在用的滑动自动提交的部署方法,感兴趣的朋友请点此前往

54 条回应
  1. 小残博客 2014-11-29 · 15:18

    安装完成后发现没效果。

  2. 易淘金 2015-1-6 · 0:46

    ality主题没效果 没法加载啊

  3. 马洪飞 2015-1-28 · 16:30

    试试看 。。。

  4. 马洪飞 2015-1-28 · 17:12

    博主,安装不成功之后删掉不能评论了怎么办啊?

    • avatar
      Jager 2015-1-28 · 17:15

      乱留邮箱!拒绝回复。

  5. David 2015-2-15 · 20:24

    作者登录后那个滑动解锁就消失了……
    Firefox下不能自动提交评论,不知道怎么会事

    • avatar
      Jager 2015-2-15 · 21:27

      我回老家没电脑,你自己慢慢折腾把!
      至于登陆后不显示,你怎么没看文章最后一段?里面很明显有关于登陆的php代码,所以说看文章还是得仔细点。

      • David 2015-2-16 · 21:14

        我再研究研究。回家好好过年吧,回头再说。

  6. David 2015-2-15 · 20:25

    测试博主Firefox下自动提交评论。你这可以,我那不行,就不知道是什么回事了。。。

  7. iEdon Inside 2015-3-7 · 2:31

    准备用,代码移植中·

  8. 刚哥笔记 2015-3-12 · 9:42

    效果很酷,谢谢,没效果的筒子可能是路径不对,要上传整个文件夹。

  9. dgo521 2015-3-18 · 5:55

    测试下

  10. 小幻 2015-5-1 · 16:15

    我直接没有显示……

    • Yephy 2015-7-23 · 17:29

      幻杀的解决了么?貌似你的站现在是在用算数计算的验证方式啊?

      • 小幻 2015-7-24 · 3:01

        我的其他都有用,就是拉不拉一样。。然后只好自己改了个计算的

  11. 爱伦颇 2015-5-9 · 11:09

    我加了,不能滑动。。用的鸟哥begin主题。要升级JQ版本是1.8.2吗?复杂不。

  12. 小幻 2015-5-9 · 16:16

    表示拉链不拉也可以评论,怎么破?

    • zhangnew 2015-5-19 · 7:44

      我的拉了也不可以评论。。。。。。

    • JACK的机器人 2015-6-8 · 15:50

      拉,还是不拉,真是艰难的抉择 :grin:

  13. zhangnew 2015-5-19 · 7:20

    按照楼主的方法安装后网站在chrome下直接打不开了,IE可以打开,但是也没有加载解锁。

    直接安装插件也无效。。。。。。

  14. zhangnew 2015-5-19 · 7:30

    禁用掉myQaptcha 插件,用博主的方法可以显示解锁了,但是解锁后提交评论仍然要求解锁,也就是说根本没法解锁。。。。。显示解锁成功,提交那里却不知道。。。。。

  15. zhangnew 2015-5-19 · 7:31

    博主这个滑动提交评论很厉害呀,怎么搞的

  16. 茅庐网 2015-5-29 · 15:01

    求博主分享滑动提交评论。

    • avatar
      Jager 2015-5-29 · 22:51

      找个时间整理分享下,敬请关注。

    • avatar
      Jager 2015-8-7 · 14:14

      已发布 :https://zhang.ge/5057.html

  17. Yephy 2015-7-23 · 12:59

    试了张哥的东西,跟幻杀的结果一样,不显示&……

    • avatar
      Jager 2015-8-7 · 14:14

      问题是主题用的div和代码不一致,详见 :https://zhang.ge/5057.html

  18. Yephy 2015-7-23 · 17:01

    张哥,我现在用鸟哥的begin1.53主题啊,用你这方法坐上去,无效啊!~根本都不加载啊!~~

    • avatar
      Jager 2015-7-23 · 19:17

      估计已经报错了。

  19. 倚天雪 2015-7-26 · 2:18

    站长好,你我主题一样,我尝试了这个滑动解锁评论,遇到若干问题,请指点:
    1,按照说明操作之后,滑动无效,静止。如您所说,应该是JQ版本问题,百度无果之后前来提问,JQ版本怎么查看?怎么升级?还望不吝赐教。
    2,安装代码之后,评论框底部依旧有评论按钮,而您这个直接提交,不再有评论按钮。这是如何实现的呢?

    祝博客越来越好

    • avatar
      Jager 2015-7-28 · 10:44

      把我的博客的JQ下载下来,替换到你网站相同文件即可。
      直接提交的方法,有时间我会分享下。

      • 老杨 2015-8-6 · 0:16

        博主这个直接滑动提交评论更便捷,有空分享个吧。 :mrgreen:

        • avatar
          Jager 2015-8-6 · 10:33

          主要在纠结,怎么说好像都说不清楚,这周末看看能否挤出牙膏分享下。

          • 老杨 2015-8-6 · 13:58

            先谢了。

            • avatar
              Jager 2015-8-7 · 14:14

              已发布:https://zhang.ge/5057.html

  20. 夜雨 2015-8-6 · 9:38

    我的博客出问题了不能评论你能帮我看下吗?

    • avatar
      Jager 2015-8-6 · 10:34

      你不是用了第三方评论么,能有啥问题。

      • 夜雨 2015-8-6 · 10:40

        因为出了问题所以我刚才才临时换用了第三方 现在我换回来你帮我看下行吗

  21. god 2015-8-24 · 22:52

    的顶顶顶顶顶

  22. AX 2015-11-30 · 23:40

    不错的分享

  23. ddddddd 2016-2-18 · 23:33

    定i都能搞

  24. 红桃K 2016-3-23 · 9:41

    ding一下

  25. sky 2016-4-9 · 10:34

    测试一下,垃圾评论真的很讨厌

  26. 明月登楼 2016-5-4 · 16:39

    蛮喜欢这个滑动提交的,呵呵!

  27. 憧憬Licoy 2016-6-9 · 11:11

    Jager博主,为什么我的不用滑动也可以提交呢?

  28. JQQ 2017-2-27 · 23:29

    引用:“如果发现出现拖不动的情况,请检查JQuery加载是否出现异常,或者将JQuery版本升级,比如Jager博客现在用的JQ版本是1.8.2。”

    那如何升级主题的JQuery版本呢(我不是VPS的,虚拟小鸡带的网页控制台而已)?
    博主有么有招式支个招?

  29. clown 2017-4-27 · 20:12

    参考了,非常不错。

  30. 随之长风 2017-5-5 · 20:23

    为毛一直显示正在提交呢,不自动刷新页面!

  31. 云柯博客 2018-7-2 · 23:36

    我直接给关一点时间看看

  32. 1 2020-3-24 · 12:33

    好文章