[WordPress技术] WordPress Ajax 评论提交

[复制链接]
查看: 398|回复: 0

16

主题

16

帖子

60

积分

注册会员

Rank: 2

积分
60
发表于 2021-1-7 10:14:06 | 显示全部楼层 |阅读模式
5.1+ 新版本
新版本重构addComment 对象使原来的代码失效了,于是移除了脚本里集成的addComment 对象,并载入官方文档。

只要是4.4+ 版本即可使用。下载地址:点此下载

4.4+ 新版本
查看源码发现4.4新增了一个函数wp_handle_comment_submission

这个函数可以看作是wp_new_comment的升级版,用这个函数将大大减少了AJAX回调函数的代码量,简单的说就是由原来的几十行代码变成一行,而且过滤条件更加全面,非常之方便。 :idea:

本教程必须为4.4或以上版本,低版本直接使用会报错。

使用方法
下载压缩包里的文件,解压后将文件夹上传到主题根目录下,注意是加压后的文件夹,不是文件件中的文件。

下载地址:点此下载

然后在functions.php中使用如下代码调用
  1. require('ajax-comment/main.php');
复制代码
配置适应主题
app.js第四行调整评论列表class
  1. __list = 'comment-list';
复制代码
main.php 中formpostion参数为评论表单位置

回调函数中的评论样式可根据你的主题自行调整,但不要使用回复按钮,会报错。

代码已经过默认主题twentysixteen测试,没有任何问题。

旧版本
2015/11/17 更新

解决了当评论倒序排列时新评论无法出现在顶部的bug

增加了一个评论表单位置参数

编辑do.php,找到formpostion参数(约第9行),默认为bottom,如果你的表单在顶部则设置为top。

ajax提交评论不但可以提升交互体验而且可以防止垃圾评论,一般垃圾评论都是通过表单机器人提交的,如果使用了ajax评论提交我们就可以禁用wordpress的表单提交,也就是删除或者清空wp根目录下的wp-comment-post.php这个文件。

默认代码兼容wordpress 默认主题2015。

实现方法
下载压缩包,解压后把文件夹放到自己的主题目录中,在functions.php中加入如下代码即可。
  1. require get_template_directory() . '/ajax-comment/do.php';
复制代码
注意是把解压得到的文件夹放到主题目录下,不是文件夹中的文件。

兼容处理
由于主题结构的不同,可能出现的结果是虽然你成功提交了评论,但是刷新之前显示不正常,那么我们需要对相关函数进行处理

1.评论样式不一致

需要修改文件夹中的do.php,修改其中的评论结构使之和你的一致即可

2.不显示新评论

这是因为包裹评论的容器和JS中的不一致,打开comments.php,看看你的容器名,然后修改ajax-comment.js中标注的位置即可,具体代码如下
  1. __list = 'comment-list';//your comment wrapprer
复制代码
3.注意你的评论结构使用的是ul还是ol,js中也要保持一直

4.修改文字提示样式需要修改压缩包内的css文件

5.如无文字提示则检查你的评论框textarea是否有id="#comment"

文件下载:点此下载


腾讯云
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

精彩图文



在线客服(工作时间:9:00-22:00)
400-600-6565

内容导航

微信客服

Copyright   ©2015-2019  云服务器社区  Powered by©Discuz!  技术支持:尊托网络     ( 湘ICP备15009499号-1 )