子比主题评论区添加夸夸随机一言

前言：

很多用户在评论的时候不知道说什么，而子比主题又没有夸夸功能，于是我们可以通过一言的模式来接入子比主题，实现夸夸功能，用户只需要点击一次，即可自动的生成一段评语，用户点击评论即可，实现方法十分的简单，可以参考下面的教程，效果可以参考下图，也可以直接前往评论区尝试

教程：

本次使用yy.sunzishaokao.comAPI作为演示

1. 首先需要准备两个文件，这两个文件我直接放在上方，大家自行下载即可！
2. 将这两个文件上传到你的网站目录，你也可以在根目录创建一个目录，例如：api，那么访问地址就是：你的网站/api/xx文件（为什么强调这个，因为你需要修改后面的代码中的文件地址，不要使用我的，我加了限制，会使用不了）
3. 进入/wp-content/themes/zibll/目录，新建func.php文件，粘贴以下代码：

   <?php
   // 夸夸功能
   function kuakua(){
       echo'<link rel="stylesheet" type="text/css" href="https://www.sunzishaokao.com/cdn/kuakua.css">
       <a class="but btn-input-expand input-image mr6" id="kuakua" href="javascript:;">
         <svg class="icon" aria-hidden="true"><use xlink:href="#icon-kuakua"></use></svg><span class="hide-sm">夸夸</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-kuakua"></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://yy.sunzishaokao.com/",function(data){
               $(".kuakua-comment").html(data.quote);
               $("#comment").text(data.quote);
             });
           });
         });
         $(".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://yy.sunzishaokao.com/",function(data){
             $(".kuakua-comment").html(data.quote);
             $("#comment").text(data.quote);
           });
           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>';
   }
   ?>

   把https://www.sunzishaokao.com/cdn/kuakua.css替换为你的kuakua.css文件路径

4. 进入网站后台 => Zibll主题设置 => 全局&功能 => 自定义HTML代码 => 自定义底部HTML代码 中引入js文件（其中的地址也是需要替换为自己的路径）

   <script src="https://xx.com/font_2827587_zt5tfqudn5.js"></script>

5. 修改主题路径/wp-content/themes/zibll/template/comments.php里87行处添加代码

   <?php kuakua()?>

   然后保存，最后到文章页面刷新即可看到效果

参考：https://blog.wmbk.net/652.html