简介
有很多人在网站浏览需要回复，有的比较嫌麻烦不愿意打字，也会收到一些各种评论相对比较杂乱，今天分享一个用夸夸功能，来替代传统的评论一言，将它们分开使用，先看看效果图，再考虑使用不使用！
操作：在本站评论旁边，点击夸夸按钮后，弹出如下随机一言评论窗口，本站效果图如下：
教程：
1、将下方代码添加到主题根目录下functions.php文件中，或者自己创建一个func.php文件把代码放里面也可以：
//随机夸夸
function kuakua(){
echo'<style type="text/css">
.kuakua-first-box{
margin: auto;
width: 440px;
border-radius: 16px;
bottom: auto;
min-height: 10rem;
left: 50%;
position: fixed;
right: auto;
top: 50%;
transform: translate(-50%, -50%);
background: #fff;
z-index: 1032;
box-shadow: 0px 0px 20px #0000001f;
display: none;
}
@media screen and (max-width: 500px){.kuakua-first-box{width:94%;}}
.kuakua-ei{
border-radius: 4px;
overflow: inherit;
}
.kuakua-close{
z-index: 9999;
right: 14px !important;
display: flex;
position: absolute;
right: 8px;
top: 4px;
padding: 16px;
cursor: pointer;
}
.kuakua-column{
position: absolute;
width: 298px;
height: auto;
top: -28px;
left: 0px;
right: 0px;
z-index: 6000;
background: url(https://www.aiik.cn/api/img/kuakua.png) 0% 0% / 298px 83px no-repeat;
margin: 0 auto;
text-align: center;
}
.kuakua-headerIcon{
border-radius: 50%;
position: relative;
text-align: center;
padding: 6px;
background-color: rgb(255, 255, 255);
width: 78px;
height: 78px;
margin: 0 auto;
}
.kuakua-icon{
width: 60px !important;
height: 60px !important;
fill: currentcolor;
transition: transform 0.3s ease 0s;
cursor: pointer;
}
.kuakua-headerTitle{
font-size: 20px;
font-weight: 600;
}
.kuakua-modal-body{
position: relative;
background-color: transparent;
text-align: center;
border-bottom: none;
border-top: none;
border-radius: 0px;
box-shadow: none;
padding: 65px 30px 20px 30px;
}
.kuakua-contentBox{
width: 100%;
min-height: 102px;
padding: 15px 20px;
margin-top: 20px;
border-radius: 0;
box-sizing: border-box;
position: relative;
background-color: rgb(244, 244, 244);
text-align: center;
border-bottom: none;
border-top: none;
box-shadow: none;
}
.kuakua-comment{
margin-bottom: 10px;
line-height: 26px;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
word-break: break-all;
transition: all 0s ease 0s;
color: rgb(68, 68, 68);
font-size: 18px;
}
.kuakua-cancelBtn{
background-color: rgb(255, 255, 255);
color: rgb(102, 102, 102);
border: none;
border-radius: 36px;
transition: all 0.3s ease 0s;
padding: 4px;
width: 80px;
display: inline-block;
margin-top: 10px;
}
.kuakua-confirmBtn{
background: rgb(255, 227, 0);
width: 118px;
height: 36px;
display: inline-block;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
background-color: rgb(255, 227, 0);
color: rgb(68, 68, 68);
border: none;
border-radius: 4px;
font-size: 14px;
cursor: pointer;
transition: all 0.3s ease 0s;
box-sizing: border-box;
margin-top: 20px;
}
.form-control:focus {
border: 1px solid rgb(148 148 148) !important;
box-shadow: none !important;
}
</style>
<a class="but btn-input-expand input-image mr6 " style="margin-bottom: 0px;background: #33e4ffab;border-radius: 6px;color: #000000;" id="kuakua" href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-zan-p" rel="external nofollow" rel="external nofollow" ></use>
</svg><span>夸夸</span></a>
<div class="kuakua-div" style="width: 9999px;height: 99999px;background: #000;z-index: 1031;position: fixed;top: 0;left: 0;opacity: .6;display:none"></div>
<div class="kuakua-first-box">
<div class="kuakua-ei">
<span class="kuakua-close" title="关闭">
<div>
<svg fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" id="close" class="sc-eCImPb iRFNEp"><g fill="none" fill-rule="evenodd" stroke="currentColor"><path d="M7.99 7.99L1 1l6.99 6.99L1 14.98l6.99-6.99zm0 0L15 15 7.99 7.99 14.98 1 7.99 7.99z" stroke="currentColor"></path></g></svg>
</div>
</span>
<div>
<div class="kuakua-column">
<section class="kuakua-headerIcon"><svg class="icon kuakua-icon" aria-hidden="true">
<use xlink:href="#icon-zan-p" rel="external nofollow" rel="external nofollow" ></use></svg>
</section>
<span size="16" color="black4" class="kuakua-headerTitle">夸夸</span>
</div>
</div>
<div style="position: relative;display: block;">
<div>
<section class="kuakua-modal-body">
<section class="kuakua-contentBox">
<span size="18" color="black4" class="kuakua-comment">还有吗！没看够！</span>
<button type="button" class="kuakua-cancelBtn">换一换</button>
</section>
<button type="button" class="kuakua-confirmBtn">夸夸TA</button>
</section>
</div>
</div>
</div>
</div>
<script>
$(function(){
$(".kuakua-cancelBtn").click(function() {
$.getJSON("https://www.aiik.cn/api/yiyan/kuakua.php?code=kuakua",function(data){
$(".kuakua-comment").html(data.text);
$("#comment").text(data.text);
});
});
});
$(".kuakua-confirmBtn").click(function() {
$("#submit").trigger("click");
$(".kuakua-first-box").hide(150);//隐藏速度
$(".kuakua-div").hide(150);//隐藏速度
});
$("#kuakua").click(function (e) {//
/*阻止冒泡事件*/
$(".kuakua-first-box").show(150);//显示速度
$(".kuakua-div").show(150);//显示速度
$.getJSON("https://www.aiik.cn/api/yiyan/kuakua.php?code=kuakua",function(data){
$(".kuakua-comment").html(data.text);
$("#comment").text(data.text);
});
e = window.event || e;
if (e.stopPropagation) {
e.stopPropagation();
} else {
e.cancelBubble = true;
}
});
$(".kuakua-close").click(function () {
$(".kuakua-first-box").hide(150);//隐藏速度
$(".kuakua-div").hide(150);//隐藏速度
$("#comment").text("");
});
</script>';
}
//随机夸夸结束2、后台自定义底部HTML代码：
<script src="//at.alicdn.com/t/c/font_4273847_4nf72j3ukyx.js"></script>3、将下方代码放到主题根目录下的template/comments.php第88行中：
<?php kuakua()?>大概位置看下面的代码
<?php
/*
* @Author: Qinver
* @Url: zibll.com
* @Date: 2021-04-11 21:36:20
* @LastEditTime: 2024-04-09 19:49:30
*/
defined('ABSPATH') or die('无法直接加载此文件.');
global $post;
$post_id = get_queried_object_id();
if (!comments_open($post_id) || _pz('close_comments')) {
return;
}
$count_t = $post->comment_count;
$user_id = get_current_user_id();
$closeTimer = (strtotime(current_time('Y-m-d G:i:s')) - strtotime(get_the_time('Y-m-d G:i:s'))) / 86400;
?>
<div class="theme-box" id="comments">
<div class="box-body notop">
<div class="title-theme"><?php echo _pz('comment_title') ?>
<?php echo $count_t ? '<small>共' . $count_t . '条</small>' : '<small>抢沙发</small>'; ?></div>
</div>
<div class="no_webshot main-bg theme-box box-body radius8 main-shadow">
<?php if (get_option('comment_registration') && !$user_id) { ?>
<?php if (!zib_is_close_sign()) { ?>
<div class="comment-signarea text-center box-body radius8">
<h3 class="text-muted em12 theme-box muted-3-color">请登录后发表评论</h3>
<p>
<a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="signin-loader but c-blue padding-lg"><i class="fa fa-fw fa-sign-in mr10" aria-hidden="true"></i>登录</a>
<?php echo !zib_is_close_signup() ? '<a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="signup-loader ml10 but c-yellow padding-lg">' . zib_get_svg('signup',null,'icon mr10') . '注册</a>' : ''; ?>
</p>
<?php zib_social_login(); ?>
</div>
<?php } ?>
<?php } elseif (get_option('close_comments_for_old_posts') && $closeTimer > get_option('close_comments_days_old')) { ?>
<div class="comment-signarea text-center box-body">
<div class="text-muted em12 separator">文章评论已关闭</div>
</div>
<?php } elseif ($user_id && zib_user_is_ban($user_id)) {
//封号
echo '<div class="muted-box" style="padding:0 10px;">' . zib_get_user_ban_nocan_info($user_id, '暂时无法评论', 10, 200) . '</div>';
?>
<?php } else { ?>
<?php echo zib_get_respond_mobile('#respond', esc_attr(_pz('comment_text'))); ?>
<div id="respond" class="mobile-fixed">
<div class="fixed-body"></div>
<form id="commentform">
<div class="flex ac">
<div class="comt-title text-center flex0 mr10">
<?php
if ($user_id) {
$avatar_img = zib_get_data_avatar($user_id);
$vip_icon = zibpay_get_vip_icon(zib_get_user_vip_level($user_id), 'em12 mr3');
$vip_icon = $vip_icon ? $vip_icon : '';
echo '<div class="comt-avatar mb10">' . $avatar_img . '</div>';
echo '<p class="text-ellipsis muted-2-color">' . $vip_icon . $user_identity . '</p>';
} else {
echo '<div class="comt-avatar mb10">' . zib_get_data_avatar($user_id) . '</div>';
echo '<p class="" data-toggle-class="open" data-target="#comment-user-info" data-toggle="tooltip" title="填写用户信息">' . ($comment_author ? $comment_author : '昵称') . '</p>';
}
?>
</div>
<div class="comt-box grow1">
<div class="action-text mb10 em09 muted-2-color"></div>
<textarea placeholder="<?php echo esc_attr(_pz('comment_text')) ?>" autoheight="true" maxheight="188" class="form-control grin" name="comment" id="comment" cols="100%" rows="4" tabindex="1" onkeydown="if(event.ctrlKey&&event.keyCode==13){document.getElementById('submit').click();return false};"></textarea>
<?php
//人机验证
if (_pz('verification_comment_s')) {
$verification_input = zib_get_machine_verification_input('submit_comment');
if ($verification_input) {
echo '<div style="width: 230px;">' . $verification_input . '</div>';
}
}
?>
<div class="comt-ctrl relative">
<div class="comt-tips">
<?php
comment_id_fields();
do_action('comment_form', $post->ID);
?>
</div>
<div class="comt-tips-right pull-right">
<?php kuakua()?>
<a class="but c-red" id="cancel-comment-reply-link" href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >取消</a>
<button class="but c-blue pw-1em" name="submit" id="submit" tabindex="5"><?php echo _pz('comment_submit_text') ?: '提交评论'; ?></button>
</div>以下为论坛评论区：
论坛评论区：路径：zibll/inc/functions/bbs/inc/comment.php里77行处添加以下代码：
$btns_r .= kuakua('return');大概位置看下面代码：
<?php
/*
* @Author : Qinver
* @Url : zibll.com
* @Date : 2021-08-05 20:25:29
* @LastEditTime: 2024-06-11 19:56:07
* @Email : 770349780@qq.com
* @Project : Zibll子比主题
* @Description : 一款极其优雅的Wordpress主题|论坛系统|回复类函数
* @Read me : 感谢您使用子比主题，主题源码有详细的注释，支持二次开发。
* @Remind : 使用盗版主题会存在各种未知风险。支持正版，从我做起！
*/
/**
* @description: 加载页面评论的主要函数
* @param {*}
* @return {*}
*/
function zib_bbs_comments_template()
{
$file = ZIB_BBS_REQUIRE_URI . 'template/comments.php';
comments_template($file, true);
}
function zib_bbs_get_respond()
{
global $post, $current_user, $comment_author;
$user_id = get_current_user_id();
if (!$user_id) {
//未登录
$html = '';
$html .= '<div class="text-center box-body">';
$html .= '<div class="mb20 muted-3-color">请登录后发表评论</div>';
$html .= '<p>';
$html .= '<a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="signin-loader but c-blue padding-lg"><i class="fa fa-fw fa-sign-in mr10" aria-hidden="true"></i>登录</a>';
$html .= !zib_is_close_signup() ? '<a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="signup-loader ml10 but c-yellow padding-lg"><i data-class="icon mr10" data-viewbox="0 0 1024 1024" data-svg="signup" aria-hidden="true"></i>注册</a>' : '';
$html .= '</p>';
$html .= '<div class="social_loginbar">';
$html .= zib_social_login(false);
$html .= '</div>';
$html .= '</div>';
return '<div id="respond" class="zib-widget"><form id="commentform">' . $html . '</form></div>';
}
//权限判断
if (!zib_bbs_current_user_can('comment_add')) {
return '<div id="respond" class="zib-widget"><form id="commentform">' . zib_bbs_get_nocan_info($user_id, 'comment_add', '暂时无法评论', 10, 200) . '</form></div>';
}
$placeholder = _pz('bbs_comment_placeholder');
$post_id = $post->ID;
$textarea = '<textarea placeholder="' . $placeholder . '" autoheight="true" maxheight="188" class="form-control grin" name="comment" id="comment" cols="100%" rows="4" tabindex="1"></textarea>';
//人机验证
if (_pz('verification_comment_s')) {
$verification_input = zib_get_machine_verification_input('submit_comment');
if ($verification_input) {
$textarea .= '<div style="width: 230px;">' . $verification_input . '</div>';
}
}
$hidden = get_comment_id_fields($post_id);
$avatar_img = zib_get_data_avatar($user_id);
$vip_icon = zibpay_get_vip_icon(zib_get_user_vip_level($user_id), 'em12 mr3');
$vip_icon = $vip_icon ? $vip_icon : '';
$user = '<div class="comt-avatar mb10">' . $avatar_img . '</div>';
$user .= '<p class="text-ellipsis muted-2-color">' . $vip_icon . $current_user->display_name . '</p>';
$user = '<div class="comt-title text-center flex0 mr10">' . $user . '</div>';
$btns_l = zib_bbs_get_respond_btns();
$btns_l = '<div class="comt-tips-left">' . $btns_l . '</div>';
$btns_r = '<a class="but c-red mr6" id="cancel-comment-reply-link" href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >取消</a>';
$btns_r .= kuakua('return');
$btns_r .= '<button class="but c-blue pw-1em" name="submit" id="submit" tabindex="2">提交回复</button>';
$btns_r = '<div class="comt-tips-right flex0">' . $btns_r . '</div>';至此就修改完成了，因为涉及到CSS，建议清空浏览器缓存再刷新看效果。
因api存在跨域问题，现解决办法是自建夸夸api，教程如下
网站根目录新建目录 api/kuakua
yiyan目录下建一个文件kuakua.php，内容如下
<?php
// 存储数据的文件
$filename = 'yiyan.txt';
// 指定页面编码
if(!file_exists($filename)) {
die($filename . ' 数据文件不存在');
}
if($_GET['type'] === 'json'){
header('Content-type:text/json');
// 读取整个数据文件
$data = file_get_contents($filename);
// 按换行符分割成数组
$data = explode(PHP_EOL, $data);
// 随机获取一行索引
$result = $data[array_rand($data)];
// 去除多余的换行符（保险起见）
$result = str_replace(array("\r","\n","\r\n"), '', $result);
//echo $result;
$content = array('code'=>1,'text'=>$result);
echo json_encode($content, JSON_UNESCAPED_UNICODE);
}else {
header('Content-type: text/html; charset=utf-8');
$data = array();
// 打开文档
$fh = fopen($filename, 'r');
// 逐行读取并存入数组中
while (!feof($fh)) {
$data[] = fgets($fh);
}
// 关闭文档
fclose($fh);
// 随机获取一行索引
$result = $data[array_rand($data)];
echo $result;
}需要在这个php文件路径下创建存放夸夸的txt文件，句子请自行搜集。
访问方法
演示站点：
夸夸：https://xz.xjmugong.cn/cdn/api/yiyanapi.php?type=json
夸夸(句子语录)
今天也为大佬的文章360度原地跳出爱的华尔兹!
大佬出手，必属精品！
存在即神话！
这个着实牛皮到离谱，离离原上谱
总是会在人生的不同阶段反复爱上大佬的文章~
真的牛逼，相比之下我就是来人间凑数的
看的我热血沸腾，转身踢开旁边的牛自己犁了三十亩地
我愿把它称之为精神食粮！
这个作者不是人，是神！
快去给你的大脑买保险！
这大概 就叫作 斐然成章吧！！！
行云流水，妙笔生花。
写出这样文章的，一定是非常可爱的人~
从头到脚都是完美的
不给我们留活路了这是
这也太牛了！美到我疯狂砸墙，现在我家已经成单间了！
牛逼克拉斯，秀的天花乱坠 ~
给我上四火！一整个爱住了的动作！
夸就完事了~
看见你文章的瞬间，我全身像过了电流
对你的文章崇拜！
追不上你，是因为我的电脑不够好吗？
果然是不同凡响，一鸣惊人
就你这样的文章…等着上排行榜吧！
墙都不服，就服你！
我今天会很忙，忙着夸夸你
不要乱动，别让我崇拜的箭射偏了
你的文章应该录入国家一级宝物
同一时间 你发表文章 我确认脉搏
敢问大佬，真的没有想法瓶颈嘛～
这次准备在首页待几天！
这文章不收钱我看着都不安心
你就是我心中的那首忐忑，总是让我惊心动魄
你有没有闻到烧焦的味道，那是我的心在为你燃烧
世界上一切美好的事情，你的文章就占了 99％
别人用牛逼形容你，我用你形容牛逼
好看到爆炸 牛逼+N！！！
今天只干成了一件像样的事，那就是看你的文章
不好意思，一不小心把所有的推荐都用你文章上了
向大佬学习！
给别人条活路吧，别发车了，强到窒息了
不说了，去搬砖了！
这文章绝了！我不是在夸你，我只是在提醒你～
看到这组文章，感受到了人间的美好～
羡慕你这该死的才华
话不多说，太酷了！
我的大神列表里又多了一位！
好酷，我要不断努力然后超越你，加油！
这句大佬，我先叫为敬
难怪刚刚在天上没看见你呢，原来是下凡了
谢谢，有被美到！
把我的脑子炖了给大佬补补吧...
请继续发散你的优秀魅力！
你就是我行进中的方向，学习的楷模，我辈当崇拜之！
不要给我压力，那将是我追赶你的动力～
我上辈子可能是碳酸饮料，一刷到你的文章就开心得冒泡
才华横溢的你，显得那么卓然不群
我得了一种病，一种只有看你的文章才能根治的病
你有时候是不是特孤独？优秀的人都是这样！
这是我不花钱就能看到的东西吗！
对于大神的文章我真是百看不厌！
不服天，不服地，就服大佬这实力！
等我一分钟 我去找个夸你的句子
厉害到没有什么词汇可以表达了，太太太强了
这文章在古代可以换边疆300年和平了！
未经允许，擅自崇拜你，不好意思啦～
即使亲眼见了也不敢相信的牛逼
快门一次，心动千次
好到不知怎么开口夸了
难道这就是世界的参差？
遇见你是我的幸运，关注你是我的荣幸
万千世界，你就是新的传奇
真是小牛坐飞机，牛上天了
差不多得了，没必要优秀得这么惊人
我现在很懊恼，这么久才发现你这么牛逼的大佬
我有你这才华，睡觉都能笑醒！
心神荡漾，面若桃花
出道吧！我带着七大姑八大姨给你投票！
用原相机拍摄也毫不失色的美貌
我认清自己了，和你比起来我就是那山顶洞人
我要是有这才华，我走路都得横着走！
感谢大佬分享！
维纳斯的贝壳都得让给你
宝藏文章，千万别火，我不想被别人看到
酷！又有学习资料了
像你这种神，我见一个爱一个！
我再练100年能达到这个水准吗
过分优秀也是“违法”的
你下次发文章，能不能别勾走我的魂，直接带我走！
快收下我的爱！
点开前知道牛逼，但没想到这么牛逼！
感谢作者精妙绝伦的文章！
谁会拒绝来看一眼大佬的文章呢～
收藏从未停止，行动从未开始
带带我，我还能看！
走过南，闯过北，认识大佬不后悔！
怎么看都不对劲，跪下看果然好多了付费下载
当前内容需要支付10 龙币才能下载
VIP折扣
- 永久VIP会员
5.00龙币5折
- 年卡VIP会员
6.00龙币6折
- 季卡VIP会员
7.00龙币7折
- 月卡VIP会员
8.00龙币8折
- 体验VIP会员
9.00龙币9折
折扣详情
死并不可怕，怕的是再也不能活了。
上帝为你关上一道防盗门，还会顺手给你上了一把钛合金锁。
点开前知道牛逼，但没想到这么牛逼！
人人都想拯救世界，却没人帮妈妈洗碗。
所谓成长，就是在听到波涛汹涌四个字，再也联想不到大海了。