文字广告位10/月 文字广告位10/月 文字广告位10/月 文字广告位10/月 文字广告位10/月
文字广告位10/月 文字广告位10/月 文字广告位10/月 文字广告位10/月 文字广告位10/月
文字广告位10/月 文字广告位10/月 文字广告位10/月 文字广告位10/月 文字广告位10/月
文字广告位10/月 文字广告位10/月 文字广告位10/月 文字广告位10/月 文字广告位10/月
文字广告位10/月 文字广告位10/月 文字广告位10/月 文字广告位10/月 文字广告位10/月

温馨提示：请在上面搜索| 查找更多免费资源，如需广告位请联系站长 QQ 656336268

子比主题美化教程（持续更新中…）

01569
转载请注明来源、保留版权，谢谢合作！

教程收集于互联网 非本人原创，有的找不到转载来源，发布这篇文章最主要也是给自己做一个备份，避免升级网站找不到教程了，如未加您的版权可联系胖猫添加，敬请谅解！！！

子比主题美化教程（持续更新中…）-胖猫营销网

子比主题美化 – 网站右下角弹窗公告代码

子比主题美化教程（持续更新中…）-胖猫营销网

将下方代码放在主题文件目录下的 footer.php 中的 body 尾部

文章自动添加关键词链接，优化内页SEO，提升网站收录效果

子比主题美化教程（持续更新中…）-胖猫营销网

本文介绍了一种有效的SEO策略——文章中自动添
加关键词链接。通过智能识别文章内容，自动为关键词添加内部链接，不仅有助于提升用户体验，还能协助搜索引擎更好地理解和收录网站内页，从而实现内页SEO的优化。

介绍：

在写文章的时候，发布之前你会设置很多标签，比如模板啊，源码，等等，这些关键词，往往需要搜索才能找到，这里给大家分享这个是只要你的文章中包含了你网站已经添加过的关键词，就会自动添加超链接，也是更好的协助网站收录优化，提高内页收录。

代码部署：

网站底部添加【我也是有底线的】

子比主题美化教程（持续更新中…）-胖猫营销网

在 zibll 主题目录下 themes/zibll/footer.php 文件中的“第一行
”下面添加下面的代码：

用户中心添加UID、注册时间等-教程及代码

来自：李初一

子比主题美化教程（持续更新中…）-胖猫营销网

使用方法：

在主题根目录新建func.php，并在最顶部填上<?php，然后再粘贴下面代码（推荐，在线更新主题不会丢失）

或者直接将以下代码添加到主题根目录的function.php最底部（更新主题会丢失）

  此处内容已隐藏，请评论后刷新页面查看.

文字广告位 by：温若寒

子比主题美化教程（持续更新中…）-胖猫营销网
  此处内容已隐藏，请评论后刷新页面查看.
[/hidecontent]

给页脚第三板块二维码增加动态border

子比主题美化教程（持续更新中…）-胖猫营销网

将代码放置于自定义CSS内，由于是SCSS代码，看不懂请不要轻易修改，也不要在控制台修改

By.李初一

  此处内容已隐藏，请评论后刷新页面查看.

给子比主题博客加个好看底部导航 by夕阳

子比主题美化教程（持续更新中…）-胖猫营销网

在functions.php加上下面这段代码

图片是站长放在自己腾讯云里的，这里我就删除了，请自行添加自己的图片(//弹窗提醒)

//获取评论数量
function zfunc_comments_users($postid=0,$which=0) {
  $comments = get_comments('status=approve&type=comment&post_id='.$postid); //获取文章的所有评论
  if ($comments) {
    $i=0; $j=0; $commentusers=array();
    foreach ($comments as $comment) {
      ++$i;
      if ($i==1) { $commentusers[] = $comment->comment_author_email; ++$j; }
      if ( !in_array($comment->comment_author_email, $commentusers) ) {
        $commentusers[] = $comment->comment_author_email;
        ++$j;
      }
    }
    $output = array($j,$i);
    $which = ($which == 0) ? 0 : 1;
    return $output[$which]; //返回评论人数
  }
  return 0; //没有评论返回0
};
// 随机文章
function random_posts(
    $posts_num=5,$before='<li>',$after='</li>'){
    global $wpdb;
    $sql = "SELECT ID, post_title,guid
            FROM $wpdb->posts
            WHERE post_status = 'publish' ";
    $sql .= "AND post_title != '' ";
    $sql .= "AND post_password ='' ";
    $sql .= "AND post_type = 'post' ";
    $sql .= "ORDER BY RAND() LIMIT 0 , $posts_num ";
    $randposts = $wpdb->get_results($sql);
    $output = '';
    foreach ($randposts as $randpost) {
        $post_title = stripslashes($randpost->post_title);
        $permalink = get_permalink($randpost->ID);
        $output .= $before.'<a class="item-foot" href="'
            . $permalink . '"  rel="bookmark" data-toggle="tooltip" data-original-title="随机文章：';
        $output .= $post_title . '"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-lianjie"></use></svg><span id="wz">' . $post_title . '</span></a>';
        $output .= $after;
    }
    echo '<div id="footgundong" class="wz"><ul>'.$output.'</ul></div>';
}

//弹窗提醒
function dorzs() {  
echo '<script src="https://21lhz.cn/cdn/js/sweetalert.min.js"></script>';
echo '<script src="https://21lhz.cn/cdn/css/sweetalert.css"></script>'; 
echo '<script>$(document).on("click","#dorzs",function(){swal({title:"发工资啦",text:"哇！夕阳超级开心的！！",icon:"https://4bot.cn/wp-content/uploads/2024/10/20241025162758341-打赏.svg",buttons:{weixin:{text:"微信",value:"weixin",},zfb:{text:"支付宝",value:"zfb",},dsmd:{text:"打赏名单",value:"dsmd",},},}).then(function(value){if(value=="weixin"){swal({title:"感谢打赏！",text:"感谢您的微信打赏，我会努力做得更好！",button:false,icon:"https://4bot.cn/wp-content/uploads/2024/10/20241025162636274-QQ_1729844769783.png"});}else if(value=="zfb"){swal({title:"感谢打赏！",text:"感谢您的支付宝打赏，我会努力做得更好！",button:false,icon:"https://4bot.cn/wp-content/uploads/2024/10/20241025162514277-支付宝.png"});}else if(value=="dsmd"){swal({title:"打赏名单",text:"【打赏名单未开放】",icon:"https://4bot.cn/wp-content/uploads/2024/10/20241025162927906-学术文章赞助.svg",button:false,});}});});</script>';  
}  
add_action( 'wp_footer', 'dorzs', 100 );

//点赞统计
function dz($post_id){
    global $wpdb;
    $sql = "SELECT SUM(`meta_value`) as num FROM `wp_postmeta` WHERE `meta_key`='like' AND `post_id`=$post_id";
    $results = $wpdb->get_results($sql);
    echo  $results[0]->num;
}

引入阿里巴巴矢量库的图标，也可以自行修改

因为前面搞错东西了，后面查了下才发现问题，把下面的js跟css引入到你的网站即可

  此处内容已隐藏，请评论后刷新页面查看.

在footer.php里加上下面这段代码，自行修改

<!--底部导航-->
<style>
#footgundong{margin-left:20px;overflow: overlay;display: inline-flex;text-align: right;}.item-foot{color: var(--minor);height: 45px;line-height: 45px;transition: color 0.35s;white-space: nowrap;}.swal-footer{text-align:center;}.swal-button {font-size: 20px;}.count>svg,.count>text{display:none;}
</style>
<div class="footwaveline">
<i style="background-image: url(https://xyblog-1259307513.cos.ap-guangzhou.myqcloud.com/wp-content/uploads/2021/11/362a2c8cc4a0.png);display: inline-block;width: 210px;height: 120px;position: fixed;bottom: 0;z-index: 110;background-size: 100%;"></i>
<div class="footwavewave" style="background: url(https://xyblog-1259307513.cos.ap-guangzhou.myqcloud.com/wp-content/uploads/2021/11/9855fd529028.png) 0 0 repeat-x;height: 3px;width: 100%;position: fixed;background-size: 10px 3px;z-index: 98;bottom: 40px;"></div>
    <div id="shi" style="position: fixed;bottom: 0;margin-left: 200px;z-index: 99;">
       <h4 class="my-face" style="font-size:13px;margin:0 5px 2px 5px;color:#797979;margin-bottom: 10px;">夕阳无别事，等风也等你</h4>
    </div>
<div style="width: 100%;height: 40px;position: fixed;bottom: 0;z-index: 97;box-shadow: 0 -2px 10px rgb(0 0 0 / 10%);background:#fff;">
    <nav class="joe_header__below-logon" style="float: right;margin-right: 50px;">
        <?php if (is_home()) {
              echo'<style>@media (max-width:1200px){#shi{display:none;}}.pl,.fx{display:none;}.dz{display:none !important;}</style>';
              echo random_posts();
            }elseif (is_page()) {
                echo'<style>@media (max-width:1200px){#shi{display:none;}}.pl,.fx{display:none;}.dz{display:none !important;}</style>';
            }
        ?>    
            <span style="margin-left:20px;" class="pl">
                <a href="javascript:(scrollTo('#comments',-100));" data-toggle="tooltip" data-original-title="评论">
                    <svg class="icon" aria-hidden="true"><use xlink:href="#icon-pinglun"></use></svg><span style="color:var(--minor);">评论(<count><?php echo zfunc_comments_users($post->ID); ?></count>)</span>
                </a>
           </span>                
            <span class="dz" style="margin-left:20px;display: inline-block;">
                <a href="javascript:(scrollTo('#comments',-1000));" data-toggle="tooltip" data-original-title="点赞">
                    <svg class="icon" aria-hidden="true"><use xlink:href="#icon-dianzan"></use></svg>点赞(<?php echo dz($post->ID)?>)
                </a>
            </span>
            <span style="margin-left:20px;line-height: 45px;" class="fx">
                <a class="bds simg" data-toggle="modal" href="#modal_poster" title="分享">
                    <svg class="icon" aria-hidden="true"><use xlink:href="#icon-fenxiang"></use></svg>分享
                </a>
            </span>
            <span style="margin-left:20px;line-height: 45px;" class="zs">
                <a id="dorzs" data-toggle="tooltip" data-original-title="赞赏">
                    <svg class="icon" aria-hidden="true"><use xlink:href="#icon-qianbao"></use></svg>赞赏
                </a>
            </span>
        <span style="margin-left:20px;line-height: 45px;" class="sc">
            <a href="javascript:void(0);" id="shoucang" data-toggle="tooltip" data-original-title="收藏">
                <svg class="icon" aria-hidden="true"><use xlink:href="#icon-xihuan"></use></svg>收藏
            </a>
        </span>
        <a style="margin-left:20px;" href="javascript:(scrollTo());" id="percentage" data-toggle="tooltip" data-original-title="返回顶部">
            <svg class="icon" aria-hidden="true"><use xlink:href="#icon-dingwei"></use></svg>0%
        </a>
  </nav>
</div>
</div>

<?php dorzs();?>
<script>
var btn =document.getElementById("shoucang");
btn.onclick = function() {layer.msg('<p style="font-weight:700;margin:5px;">在键盘上按<span style="padding:5px 10px;background:#f0e7e2;border-radius:8px;color:#202020;margin:0 5px;">Ctrl</span>+<span style="padding:5px 10px;background:#f0e7e2;border-radius:8px;color:#202020;margin:0 5px;">D</span>即可<br>喜欢本站的话记得常来哦！</p>', function(){});};
</script>
<!--底部导航-->

CSS代码

这段css其实是文字的抖动跟适应手机屏幕隐藏底部导航栏(可用可不用，不过@media这段建议保留)

/* start */
 .my-face {
    animation: my-face 5s infinite ease-in-out;
    color: #00f1ff;
    display: inline-block;
    margin: 0 5px;
}
@-webkit-keyframes my-face {
    2%, 24%, 80% {
        -webkit-transform: translate(0, 1.5px) rotate(1.5deg);
        transform: translate(0, 1.5px) rotate(1.5deg)
    }
    4%, 68%, 98% {
        -webkit-transform: translate(0, -1.5px) rotate(-.5deg);
        transform: translate(0, -1.5px) rotate(-.5deg)
    }
    38%, 6% {
        -webkit-transform: translate(0, 1.5px) rotate(-1.5deg);
        transform: translate(0, 1.5px) rotate(-1.5deg)
    }
    8%, 86% {
        -webkit-transform: translate(0, -1.5px) rotate(-1.5deg);
        transform: translate(0, -1.5px) rotate(-1.5deg)
    }
    10%, 72% {
        -webkit-transform: translate(0, 2.5px) rotate(1.5deg);
        transform: translate(0, 2.5px) rotate(1.5deg)
    }
    12%, 64%, 78%, 96% {
        -webkit-transform: translate(0, -.5px) rotate(1.5deg);
        transform: translate(0, -.5px) rotate(1.5deg)
    }
    14%, 54% {
        -webkit-transform: translate(0, -1.5px) rotate(1.5deg);
        transform: translate(0, -1.5px) rotate(1.5deg)
    }
    16% {
        -webkit-transform: translate(0, -.5px) rotate(-1.5deg);
        transform: translate(0, -.5px) rotate(-1.5deg)
    }
    18%, 22% {
        -webkit-transform: translate(0, .5px) rotate(-1.5deg);
        transform: translate(0, .5px) rotate(-1.5deg)
    }
    20%, 36%, 46% {
        -webkit-transform: translate(0, -1.5px) rotate(2.5deg);
        transform: translate(0, -1.5px) rotate(2.5deg)
    }
    26%, 50% {
        -webkit-transform: translate(0, .5px) rotate(.5deg);
        transform: translate(0, .5px) rotate(.5deg)
    }
    28% {
        -webkit-transform: translate(0, .5px) rotate(1.5deg);
        transform: translate(0, .5px) rotate(1.5deg)
    }
    30%, 40%, 62%, 76%, 88% {
        -webkit-transform: translate(0, -.5px) rotate(2.5deg);
        transform: translate(0, -.5px) rotate(2.5deg)
    }
    32%, 34%, 66% {
        -webkit-transform: translate(0, 1.5px) rotate(-.5deg);
        transform: translate(0, 1.5px) rotate(-.5deg)
    }
    42% {
        -webkit-transform: translate(0, 2.5px) rotate(-1.5deg);
        transform: translate(0, 2.5px) rotate(-1.5deg)
    }
    44%, 70% {
        -webkit-transform: translate(0, 1.5px) rotate(.5deg);
        transform: translate(0, 1.5px) rotate(.5deg)
    }
    48%, 74%, 82% {
        -webkit-transform: translate(0, -.5px) rotate(.5deg);
        transform: translate(0, -.5px) rotate(.5deg)
    }
    52%, 56%, 60% {
        -webkit-transform: translate(0, 2.5px) rotate(2.5deg);
        transform: translate(0, 2.5px) rotate(2.5deg)
    }
    58% {
        -webkit-transform: translate(0, .5px) rotate(2.5deg);
        transform: translate(0, .5px) rotate(2.5deg)
    }
    84% {
        -webkit-transform: translate(0, 1.5px) rotate(2.5deg);
        transform: translate(0, 1.5px) rotate(2.5deg)
    }
    90% {
        -webkit-transform: translate(0, 2.5px) rotate(-.5deg);
        transform: translate(0, 2.5px) rotate(-.5deg)
    }
    92% {
        -webkit-transform: translate(0, .5px) rotate(-.5deg);
        transform: translate(0, .5px) rotate(-.5deg)
    }
    94% {
        -webkit-transform: translate(0, 2.5px) rotate(.5deg);
        transform: translate(0, 2.5px) rotate(.5deg)
    }
    0%, 100% {
        -webkit-transform: translate(0, 0) rotate(0);
        transform: translate(0, 0) rotate(0)
    }
}
@keyframes my-face {
    2%, 24%, 80% {
        -webkit-transform: translate(0, 1.5px) rotate(1.5deg);
        transform: translate(0, 1.5px) rotate(1.5deg)
    }
    4%, 68%, 98% {
        -webkit-transform: translate(0, -1.5px) rotate(-.5deg);
        transform: translate(0, -1.5px) rotate(-.5deg)
    }
    38%, 6% {
        -webkit-transform: translate(0, 1.5px) rotate(-1.5deg);
        transform: translate(0, 1.5px) rotate(-1.5deg)
    }
    8%, 86% {
        -webkit-transform: translate(0, -1.5px) rotate(-1.5deg);
        transform: translate(0, -1.5px) rotate(-1.5deg)
    }
    10%, 72% {
        -webkit-transform: translate(0, 2.5px) rotate(1.5deg);
        transform: translate(0, 2.5px) rotate(1.5deg)
    }
    12%, 64%, 78%, 96% {
        -webkit-transform: translate(0, -.5px) rotate(1.5deg);
        transform: translate(0, -.5px) rotate(1.5deg)
    }
    14%, 54% {
        -webkit-transform: translate(0, -1.5px) rotate(1.5deg);
        transform: translate(0, -1.5px) rotate(1.5deg)
    }
    16% {
        -webkit-transform: translate(0, -.5px) rotate(-1.5deg);
        transform: translate(0, -.5px) rotate(-1.5deg)
    }
    18%, 22% {
        -webkit-transform: translate(0, .5px) rotate(-1.5deg);
        transform: translate(0, .5px) rotate(-1.5deg)
    }
    20%, 36%, 46% {
        -webkit-transform: translate(0, -1.5px) rotate(2.5deg);
        transform: translate(0, -1.5px) rotate(2.5deg)
    }
    26%, 50% {
        -webkit-transform: translate(0, .5px) rotate(.5deg);
        transform: translate(0, .5px) rotate(.5deg)
    }
    28% {
        -webkit-transform: translate(0, .5px) rotate(1.5deg);
        transform: translate(0, .5px) rotate(1.5deg)
    }
    30%, 40%, 62%, 76%, 88% {
        -webkit-transform: translate(0, -.5px) rotate(2.5deg);
        transform: translate(0, -.5px) rotate(2.5deg)
    }
    32%, 34%, 66% {
        -webkit-transform: translate(0, 1.5px) rotate(-.5deg);
        transform: translate(0, 1.5px) rotate(-.5deg)
    }
    42% {
        -webkit-transform: translate(0, 2.5px) rotate(-1.5deg);
        transform: translate(0, 2.5px) rotate(-1.5deg)
    }
    44%, 70% {
        -webkit-transform: translate(0, 1.5px) rotate(.5deg);
        transform: translate(0, 1.5px) rotate(.5deg)
    }
    48%, 74%, 82% {
        -webkit-transform: translate(0, -.5px) rotate(.5deg);
        transform: translate(0, -.5px) rotate(.5deg)
    }
    52%, 56%, 60% {
        -webkit-transform: translate(0, 2.5px) rotate(2.5deg);
        transform: translate(0, 2.5px) rotate(2.5deg)
    }
    58% {
        -webkit-transform: translate(0, .5px) rotate(2.5deg);
        transform: translate(0, .5px) rotate(2.5deg)
    }
    84% {
        -webkit-transform: translate(0, 1.5px) rotate(2.5deg);
        transform: translate(0, 1.5px) rotate(2.5deg)
    }
    90% {
        -webkit-transform: translate(0, 2.5px) rotate(-.5deg);
        transform: translate(0, 2.5px) rotate(-.5deg)
    }
    92% {
        -webkit-transform: translate(0, .5px) rotate(-.5deg);
        transform: translate(0, .5px) rotate(-.5deg)
    }
    94% {
        -webkit-transform: translate(0, 2.5px) rotate(.5deg);
        transform: translate(0, 2.5px) rotate(.5deg)
    }
    0%, 100% {
        -webkit-transform: translate(0, 0) rotate(0);
        transform: translate(0, 0) rotate(0)
    }
}
/* end */
/*底部导航*/
@media (max-width: 800px){.footwaveline{display: none;}}

JS代码

这段js代码是用来触发滚动条显示百分比的

  <!--滚动进度条百分比-->
$(function(){var $this=$("#footgundong");var scrollTimer;$this.hover(function(){clearInterval(scrollTimer)},function(){scrollTimer=setInterval(function(){scrollNews($this)},2000)}).trigger("mouseleave");function scrollNews(obj){var $self=obj.find("ul");var lineHeight=$self.find("li:first").height();$self.animate({"marginTop":-lineHeight+"px"},500,function(){$self.css({marginTop:0}).find("li:first").appendTo($self)})}})
window.onscroll = function() {
  let scrollNow = window.pageYOffset;
  let pageClientHeight = document.documentElement.clientHeight;
  let scrollHeight = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight, document.body.offsetHeight, document.documentElement.offsetHeight, document.body.clientHeight, document.documentElement.clientHeight) - pageClientHeight;
  let fullWindowHeightInPercentage = Math.round((scrollNow / scrollHeight) * 100);
  let percentage = document.getElementById('percentage');
  percentage.innerHTML = '<svg class="icon" aria-hidden="true"><use xlink:href="#icon-dingwei"></use></svg> ' + fullWindowHeightInPercentage + '%';
  if (fullWindowHeightInPercentage == 0) percentage.innerHTML = '<svg class="icon" aria-hidden="true"><use xlink:href="#icon-dingwei"></use></svg> 到顶啦';
  if (fullWindowHeightInPercentage == 100) percentage.innerHTML = '<svg class="icon" aria-hidden="true"><use xlink:href="#icon-jiasu1"></use></svg> 到底啦';
}
</script>

更新

元旦子比主题更新到了6.1版本，分享按钮代码发生了变动，这里我们也做一下修改：

<a class="share-btn poster" poster-share="<?php the_ID();?>" title="海报分享" href="javascript:;">
    <svg class="icon" aria-hidden="true"><use xlink:href="#icon-fenxiang"></use></svg>分享
</a>

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

子比主题美化教程（持续更新中…）-胖猫营销网
  1. 首先需要准备两个文件，这两个文件我直接放在上方，大家自行下载即可！
  2. 将这两个文件上传到你的网站目录，你也可以在根目录创建一个目录，例如：cdn，那么访问地址就是：你的网站/api/xx文件（为什么强调这个，因为你需要修改后面的代码中的文件地址，不要使用我的，我加了限制，会使用不了）
  3. 进入/wp-content/themes/zibll/目录，新建func.php文件，粘贴以下代码：
<?php
// 夸夸功能
function kuakua(){
    echo'<link rel="stylesheet" type="text/css" href="https://4bot.cn/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://21lhz.cn/cdn/api/yiyanapi.php?encode=kuakua",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://4bot.cn/cdn/kuakua.css替换为你的kuakua.css文件路径

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

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

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

  此处内容已隐藏，请评论后刷新页面查看.

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

下载

上面的文件下载在根目录创建/cdn 放入

子比主题美化 – 昵称抖音风格字体美化代码

子比主题美化教程（持续更新中…）-胖猫营销网

css代码放到子比主题自定义css即可。

/*昵称*/.display-name{    text-shadow: -2px 0 rgba(0, 255, 255, .5), 2px 0 rgba(255, 0, 0, .5);    animation: shake-it .5s reverse infinite cubic-bezier(0.68, -0.55, 0.27, 1.55);}@keyframes shake-it{    0%{        text-shadow: 0 0 rgba(0, 255, 255, .5), 0 0 rgba(255, 0, 0, .5);    }    25%{        text-shadow: -2px 0 rgba(0, 255, 255, .5), 2px 0 rgba(255, 0, 0, .5);    }    50%{        text-shadow: -5px 0 rgba(0, 255, 255, .5), 3px 0 rgba(255, 0, 0, .5);    }    100%{        text-shadow: 3px 0 rgba(0, 255, 255, .5), 5px 0 rgba(255, 0, 0, .5);    }}/*1*/

子比主题美化 – 主题右侧新版悬浮导航美化版本修正版本

子比主题美化教程（持续更新中…）-胖猫营销网

添加教程第一步首先就是添加CSS，zibll主题设置—全局功能—自定义代码—自定义CSS样式添加以下CSS代码

.gotop {
  position: fixed;
    bottom: 20%;
    right: 1%;
    z-index: 999;
}
.gotop-box{
    box-shadow: 0 4px 23px rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    background: #fff;
}
.gotop .gotop-item{
    color: rgba(23,23,24,0.8);
    text-align: center;
    cursor: pointer;
    width: 54px;
    padding-bottom: 10px;
    box-sizing: initial;
    align-items: center;
    display: block;
}
.gotop .gotop-item i{
  font-size: 22px!important;
    z-index: 2;
    position: relative;
    color: #171718;
}
.gotop .gotop-item a{
    color: rgba(23,23,24,0.8);
    font-size: 12px;
  text-decoration: none;
}
.gotop .gotop-item a:hover{
    color: var(--primary-color)!important;
}
.gotop .gotop-item img{
    width: 24px;
}
.gotop .gotop-item p.text{
    font-size: 12px;
    margin-top: 5px;
}
.gotop .gotop-item:hover p.text{
    color: var(--primary-color)!important;
}
.gotop .gotop-item.gotops{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
}
.ceo-pt-wx{
    width: 300px;
}
.ceo-pt-wx img{
    height: 200px;
}
.gotop .activity{
    background: transparent;
    position: relative;
    height: 128px;
    padding-bottom: 0;
}
.gotop .activity a{
    display: block;
}
.gotop .activity .a1{
    width: 100%;
    height: 100%;
    border-radius: 7px 7px 0px 0px;
}
.gotop .activity .a2{
    position: absolute;
    bottom: 10px;
    left: 10px;
    width: 33px;
    height: 43px;
    animation: red-envelope-shake 0.8s linear infinite;
    transition: all .3s;
}
@keyframes red-envelope-shake {
    0% { transform: rotate(-7deg) }
    50%  { transform: rotate(7deg) }
    100% {transform: rotate(-7deg) }
}
@keyframes turnX{
    0%{transform:rotateX(0deg);}
    100%{transform:rotateX(360deg);}
}
.gotop .activity .popover {
    position: absolute;
    width: 251px;
    height: 128px;
    right: 0;
    left: -196px;
    bottom: 0;
    display: none;
}
.gotop .activity:hover .popover {
    display: block;
}
.gotop-box .gotop-vip{
    background: linear-gradient(10deg,#fedd92,#fef6e1);
    color: #803300;
    padding-top: 10px;
    margin-bottom: 10px;
}
.gotop-box .gotop-vip a{
    color: #803300!important;
}
.gotop-box .gotop-vip:hover p.text{
    color: #803300!important;
    font-weight: 600;
}
.gotop-service{
    position: relative;
}
.gotop-service:hover .gotop-service-box {
  display: block;
  transition: all .3s;
}
.gotop-service-box {
    display: none;
    position: absolute;
    z-index: 999;
    right: 55px;
    bottom: 0px;
    width: 150px;
    padding: 20px;
    text-align: center;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 3px 1px rgba(0,0,0,.05);
    box-shadow: 0 0 3px 1px rgba(0,0,0,.05);
    transition: all .3s;
    background: #fff;
}
.gotop-service-box .tops{
    text-align: center;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #edf1f2;
}
.gotop-service-box .tops img{
}
.gotop-service-box .tops a{
    display: block;
    height: 26px;
    line-height: 26px;
    margin: 15px auto 10px auto;
    border: 1px solid #b5b9bc;
    font-size: 12px;
    border-radius: 4px;
}
.gotop-service-box .tops a:hover{
    background:#fff0;
    color: var(--primary-color)!important;
    border: 1px solid var(--primary-color)!important;
}
.gotop-service-box .tops p{
    font-size: 13px;
}
.gotop-service-box .btms{
    text-align: center;
}
.gotop-service-box .btms em{
    font-size: 14px;
    color: #5f6575;
    font-weight: 500;
    margin-bottom: 10px;
    height: 20px;
    line-height: 20px;
    display: block;
}
.gotop-service-box .btms p{
    height: 25px;
    font-weight: 500;
    line-height: 25px;
    font-size: 18px;
    color: #4775FF;
    margin-bottom: 10px;
    display: inline-block;
}
.gotop-service-box .btms span{
    height: 25px;
    line-height: 25px;
    overflow: hidden;
    font-size: 12px;
    color: #FF5151;
    margin-bottom: 10px;
}
.gotop-wx-box {
    margin-bottom: 15px;
}
.gotop-wx-box .boxs p{
    font-size: 14px;
    color: #5f6575;
    font-weight: 500;
    margin-bottom: 10px;
    height: 20px;
    line-height: 20px;
}
.gotop-wx-box .boxs img {
    width: 100%;
    height: 100%;
    display: block;
    margin-top: 10px;
    padding: 5px;
    border: 1px solid var(--border-color);
    margin: 10px auto 0px auto;
}
.gotop-ma{
    position: relative;
}
.gotop-ma:hover .gotop-ma-box {
  display: block;
  transition: all .3s;
}
.gotop-ma-box {
    display: none;
    position: absolute;
    z-index: 999;
    right: 54px;
    bottom: 0px;
    width: 170px;
    padding: 10px;
    text-align: center;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 3px 1px rgba(0,0,0,.05);
    box-shadow: 0 0 3px 1px rgba(0,0,0,.05);
    transition: all .3s;
    background: var(--primary-color);
}
.gotop-ma-box i{
    display: block;
    width: 31px;
    height: 5px;
    margin: 0 auto 10px;
    border-radius: 2px;
    background: #6f96ff;
}
.gotop-ma-box em{
    display: block;
    margin: 10px auto 0;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    background: #6f96ff;
}
.gotop-ma-box .tops{
    padding: 10px;
    background: #fff;
    border-radius: 4px;
    text-align: center;
}
.gotop-ma-box .tops p{
    font-size: 12px;
    color: #5f6575;
    overflow: hidden;
    height: 23px;
    line-height: 23px;
}
.gotop-ma-box .tops img {
    width: 100%;
    height: 100%;
    display: block;
    margin-top: 10px;
    margin: 10px auto 0px auto;
}
@media screen and (max-width: 767px) {
    .gotop {
        display: none !important;
    }
}

第二步骤就是在zibll主题设置—全局功能—自定义代码—自定义底部HTML代码添加以下代码

<div class="gotop">
    <div class="gotop-box">
        <div class="gotop-item activity">
            <a href="/user/rebate">
                <img src="/images/zbfox-follow-activity-1.png" alt="activity" class="a1">
                <img src="/images/zbfox-follow-activity-2.png" alt="activity" class="a2">
                <div class="popover" style="background: url(图片链接) no-repeat center/cover;"></div>
            </a>
        </div>
        <div class="gotop-item gotop-vip">
            <a class="vip-buy vip-btn pay-vip" vip-level="2" data-toggle="tooltip" data-placement="top" href="javascript:;" data-original-title="开通会员">
                <img src="/images/zbfox-follow-vip.svg" alt="会员">
                <p class="text">会员</p>
            </a>
        </div>
        <div class="gotop-item">
            <a href="javascript:;" class="toggle-theme toggle-radius">
                <i class="fa fa-toggle-theme">　</i>
            </a>
            <p id="themeText" class="text">昼夜</p>
        </div>
        <div class="gotop-item">
            <a class="initiate-checkin" href="javascript:;" form-action="user_checkin" ed-text="每日签到">
                <img src="/images/zbfox-follow-sign.gif" alt="签到">
                <p class="text">签到</p>
            </a>
        </div>
        <div class="gotop-item">
            <a href="/choujiang">
                <img src="/images/zbfox-choujiang.svg" alt="抽奖">
                <p class="text">抽奖</p>
            </a>
        </div>
        <div class="gotop-item gotop-service">
            <img src="/images/zbfox-kefu.svg" alt="客服">
            <p class="text">客服</p>
            <div class="gotop-service-box">
                <div class="tops">
                    <img src="/images/zbfox-follow-service-qq.png" alt="点击联系站长">
                    <a href="http://wpa.qq.com/msgrd?v=3&uin=1427145484&site=qq&menu=yes" class="topsqq" rel="noreferrer nofollow">点击联系站长</a>
                    <p>在线时间<br>12:00 - 22:00</p>
                </div>
                <div class="gotop-wx-box">
                    <div class="boxs">
                        <p>关注微信公众号</p>
                        <img src="图片链接" alt="关注微信公众号">
                    </div>
                </div>
                <div class="btms">
                    <em>交流QQ群</em>
                    <p>00000000</p>
                    <em>站长邮箱</em>
                    <span>admin@h-an.cn</span>
                </div>
            </div>
        </div>
        <div class="gotop-item gotops hide-on-scroll" id="gotops" style="display: none;">
            <a href="javascript:(scrollTo());">
                <img src="/images/zbfox-follow-gotop.png" alt="TOP">
                <p>TOP</p>
            </a>
        </div>
    </div>
</div>
<script>
// 当页面加载完成后执行
jQuery(document).ready(function($) {
    // 获取返回顶部按钮
    var $gotop = $('.gotop-item.gotops');
    // 监听滚动事件
    $(window).scroll(function() {
        // 如果滚动超过了200px，显示返回顶部按钮，否则隐藏
        if ($(this).scrollTop() > 200) {
            $gotop.fadeIn();
        } else {
            $gotop.fadeOut();
        }
    });
    // 返回顶部按钮点击事件
    $gotop.click(function() {
        $('html, body').animate({ scrollTop: 0 }, 800);
        return false;
    });
});
</script>

记得本地化一下图片，在网站根目录新建名叫“images”的文件夹，并把压缩包放进去解压即可

图片下载：下载:https://yunmonet.lanzn.com/iNTTn27i8xwb 密码:mryt

子比主题美化-右下角提示美化

美化前:

子比主题美化教程（持续更新中…）-胖猫营销网

美化后：

子比主题美化教程（持续更新中…）-胖猫营销网
  此处内容已隐藏，请评论后刷新页面查看.

子比主题美化-添加文章评论常用语功能

子比主题美化教程（持续更新中…）-胖猫营销网

在后台 >> Zibll主题设置 >> 全局&功能 >> 自定义代码 >> 自定义CSS样式，添加如下CSS代码：

/*常用语样式*/
.wiiuii-words-li{margin:5px auto;padding:5px;background:var(--body-bg-color);border-radius:var(--main-radius)}
.wiiuii-words-li:hover{background:var(--float-btn-bg)}

在后台 >> Zibll主题设置 >> 全局&功能 >> 自定义代码 >> 自定义javascript代码，添加如下jQuery代码：

// 评论常用语
$('.wiiuii-words-li').on('click', function() {
   var $wiiuii_comment = $('#comment');
    var wiiuii_com_text = $(this).find('span').text();
    var wiiuii_com_original = $wiiuii_comment.val();
    $wiiuii_comment.val(wiiuii_com_original ? wiiuii_com_original + '  ' + wiiuii_com_text : wiiuii_com_text);
    $('.wiui_words').removeClass('open');
});

第一步：在“../zibll/template/comments.php”子比主题的 template 目录下“comments.php”文件，搜索 smilie 在上方位置添加如下代码：

子比主题美化教程（持续更新中…）-胖猫营销网
// 常用语函数
if (_pz('comment_words', true)) {
echo zib_get_input_expand_but('wiui_words');
}

第二步：在“../zibll/inc/functions/functions.php”子比主题的template目录下“functions.php”文件，搜索 smilie 在“表情”上方位置添加如下代码：

子比主题美化教程（持续更新中…）-胖猫营销网
  此处内容已隐藏，请评论后刷新页面查看.

子比主题美化-会员开通引导区块

!
也想出现在这里？ 联系我们吧
执笔博客

代码放至顶部全区块或文章内容上方、文章页顶部全区块——自定义 HTML：

<div class="n_banner_inner">
  <div class="img-info">!
    <div class="info">也想出现在这里？
      <a rel="nofollow noopener noreferrer" href="https://4bot.cn/?golink=aHR0cHM6Ly9xbS5xcS5jb20vcS9TdkNkU1lMbVVp"  target="_blank">联系我们</a>吧</div>
  </div>
  <a class="pay-vip" href="javascript:;">
    <div class="Banner-adTag">广告</div>
    <img class="tirr" src="https://bu.dusays.com/2024/05/27/665488ab063a6.gif" alt="执笔博客">
  </a>
</div>
<style>
    /*定位*/
    .n_banner_inner {
        position: relative;
    }
    /*提示信息*/
    .n_banner_inner .img-info {
        position: absolute;
        right: 12px;
        top: 9px;
        padding: 0;
        text-align: right;
        color: #fff;
    }
    .n_banner_inner .img-info i {
        position: relative;
        display: inline-block;
        color: #007bff;
        font-size: 20px;
        line-height: 19px;
        text-align: center;
        z-index: 9;
        font-style: inherit;
    }
    .n_banner_inner .img-info .info {
        position: absolute;
        bottom: 5px;
        right: 0;
        width: 0;
        padding: 5px 0;
        overflow: hidden;
        background: #007bff;
        border-radius: 10px;
        line-height: 10px;
        text-align: center;
        font-size: 10px;
        color: #fff;
        white-space: nowrap;
        -webkit-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important;
        -moz-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important;
        -ms-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important;
        -o-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important;
        transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important;
    }
    .n_banner_inner .img-info .info a {
        color: #fff;
    }
    .n_banner_inner .tirr {
        max-width: 100%;
        height: auto;
        transition: 0.5s;
        border-radius: 5px;
    }
    /*触发 Hover*/
    .n_banner_inner:hover .info {
        width: auto;
        padding: 5px 23px 5px 12px;
        -webkit-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important;
        -moz-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important;
        -ms-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important;
        -o-transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important;
        transition: all 0.2s cubic-bezier(0, 0.34, 0.71, 1.26) !important;
        font-size: 12px;
        z-index: 1;
    }
    .n_banner_inner img:hover {
        filter: brightness(50%);
    }
    /*出发声明 hover*/
    .n_banner_inner .info:hover a {
        color: red;
        text-decoration: none;
    }
    /*左下角广告*/
    .n_banner_inner .Banner-adTag {
        position: absolute;
        left: 5px;
        bottom: 5px;
        width: 50px;
        border: 1px solid #ebebeb;
        border-radius: 3px;
        color: #ebebeb;
        opacity: 0.5;
        font-size: 12px;
        line-height: 20px;
        text-align: center;
    }
    @media screen and (max-width: 768px) {
        .n_banner_inner .img-info {
            display: none;
        }
    }
  .container {
    width: 100%;
}
.zib-widget {
    clear: both;
    background: #fff0;
    padding: 0px;
    box-shadow: 0 0 0px var(--main-shadow);
    border-radius: var(--main-radius);
    margin-bottom: 20px;
}
</style>

上面代码会导致网站登录变透明 下方为优化:

子比主题美化-会员开通引导区块_修改版-胖猫营销网
子比主题美化-会员开通引导区块_修改版-胖猫营销网
免费子比主题美化-会员开通引导区块_修改版
PangMao_Pro的头像-胖猫营销网合伙人PangM
0616

用户中心-添加扩展中心

子比主题美化教程（持续更新中…）-胖猫营销网
  此处内容已隐藏，请评论后刷新页面查看.

只需要将上述代码放置于后台的自定义javascript代码内即可实现在用户中心侧边栏插入一个扩展入口

原理代码

$(function(){      $('.col-sm-3 .sidebar-user').prepend('这里面放你的html'); });

这段代码是一段使用 jQuery 编写的 JavaScript 代码

主要用于在网页上动态地添加一些元素

具体来说，这段代码的功能是在具有 .col-sm-3 .sidebar-user 类的元素内部添加一些链接（<a> 标签）

每个链接都有一个描述性的图标和文本

代码解析如下：

  1. $(function(){ ... });：这是一个 jQuery 的文档就绪函数，意味着当 HTML 文档完全加载和解析完成后，里面的函数就会被执行。
  2. $('.col-sm-3 .sidebar-user').prepend('<div class="zib-widget padding-6">... </div>');：这一行使用 jQuery 的 prepend 方法在具有 .col-sm-3 .sidebar-user 类的元素内部的最开始处添加一段 HTML 代码。
  3. 在添加的 HTML 代码中，有几个 <a> 标签，每个都包含一个图标和一段描述性的文本。这些链接被添加到一个名为 .zib-widget 的 div 中，添加zib-widget的目的是调用子比主题小工具的css

值得一提的是，在很久之前我所发布的头像框代码教程也是使用这种方式在头像之前添加一个头像框进行覆盖

也就是说只要你能够准确的表明需要插入内容的css，这段代码就能够将你所编写的html插入其中

代码内的prepend也是支持更改的，prepend的含义是在选中的div内部插入

你也可以修改为after、before、hover等

其中after为在区块后面插入

而before则是在区块前面插入

hover这个更是老演员了，悬浮时显示

大家可以参考我的代码自行修改内容，不过html代码需要压缩后才能够放在里面。

子比主题美化-评论、搜索框打字粒子特效

子比主题美化教程（持续更新中…）-胖猫营销网

子比主题设置——全局&功能——自定义代码——自定义javascript代码

其实所有WP站点都可以用，直接复制就行，如果用在其他主题或者其他位置，记得加<script>标签

<!--彩色粒子特效-->
(function webpackUniversalModuleDefinition(a, b) {
    if (typeof exports === "object" && typeof module === "object") {
        module.exports = b()
    } else {
        if (typeof define === "function" && define.amd) {
            define([], b)
        } else {
            if (typeof exports === "object") {
                exports["POWERMODE"] = b()
            } else {
                a["POWERMODE"] = b()
            }
        }
    }
})(this, function() {
    return (function(a) {
        var b = {};
 
        function c(e) {
            if (b[e]) {
                return b[e].exports
            }
            var d = b[e] = {
                exports: {},
                id: e,
                loaded: false
            };
            a[e].call(d.exports, d, d.exports, c);
            d.loaded = true;
            return d.exports
        }
        c.m = a;
        c.c = b;
        c.p = "";
        return c(0)
    })([function(c, g, b) {
        var d = document.createElement("canvas");
        d.width = window.innerWidth;
        d.height = window.innerHeight;
        d.style.cssText = "position:fixed;top:0;left:0;pointer-events:none;z-index:999999";
        window.addEventListener("resize", function() {
            d.width = window.innerWidth;
            d.height = window.innerHeight
        });
        document.body.appendChild(d);
        var a = d.getContext("2d");
        var n = [];
        var j = 0;
        var k = 120;
        var f = k;
        var p = false;
        o.shake = true;
 
        function l(r, q) {
            return Math.random() * (q - r) + r
        }
        function m(r) {
            if (o.colorful) {
                var q = l(0, 360);
                return "hsla(" + l(q - 10, q + 10) + ", 100%, " + l(50, 80) + "%, " + 1 + ")"
            } else {
                return window.getComputedStyle(r).color
            }
        }
        function e() {
            var t = document.activeElement;
            var v;
            if (t.tagName === "TEXTAREA" || (t.tagName === "INPUT" && t.getAttribute("type") === "text")) {
                var u = b(1)(t, t.selectionStart);
                v = t.getBoundingClientRect();
                return {
                    x: u.left + v.left,
                    y: u.top + v.top,
                    color: m(t)
                }
            }
            var s = window.getSelection();
            if (s.rangeCount) {
                var q = s.getRangeAt(0);
                var r = q.startContainer;
                if (r.nodeType === document.TEXT_NODE) {
                    r = r.parentNode
                }
                v = q.getBoundingClientRect();
                return {
                    x: v.left,
                    y: v.top,
                    color: m(r)
                }
            }
            return {
                x: 0,
                y: 0,
                color: "transparent"
            }
        }
        function h(q, s, r) {
            return {
                x: q,
                y: s,
                alpha: 1,
                color: r,
                velocity: {
                    x: -1 + Math.random() * 2,
                    y: -3.5 + Math.random() * 2
                }
            }
        }
        function o() {
            var t = e();
            var s = 5 + Math.round(Math.random() * 10);
            while (s--) {
                n[j] = h(t.x, t.y, t.color);
                j = (j + 1) % 500
            }
            f = k;
            if (!p) {
                requestAnimationFrame(i)
            }
            if (o.shake) {
                var r = 1 + 2 * Math.random();
                var q = r * (Math.random() > 0.5 ? -1 : 1);
                var u = r * (Math.random() > 0.5 ? -1 : 1);
                document.body.style.marginLeft = q + "px";
                document.body.style.marginTop = u + "px";
                setTimeout(function() {
                    document.body.style.marginLeft = "";
                    document.body.style.marginTop = ""
                }, 75)
            }
        }
        o.colorful = false;
 
        function i() {
            if (f > 0) {
                requestAnimationFrame(i);
                f--;
                p = true
            } else {
                p = false
            }
            a.clearRect(0, 0, d.width, d.height);
            for (var q = 0; q < n.length; ++q) {
                var r = n[q];
                if (r.alpha <= 0.1) {
                    continue
                }
                r.velocity.y += 0.075;
                r.x += r.velocity.x;
                r.y += r.velocity.y;
                r.alpha *= 0.96;
                a.globalAlpha = r.alpha;
                a.fillStyle = r.color;
                a.fillRect(Math.round(r.x - 1.5), Math.round(r.y - 1.5), 3, 3)
            }
        }
        requestAnimationFrame(i);
        c.exports = o
    }, function(b, a) {
        (function() {
            var d = ["direction", "boxSizing", "width", "height", "overflowX", "overflowY", "borderTopWidth", "borderRightWidth", "borderBottomWidth", "borderLeftWidth", "borderStyle", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "fontStyle", "fontVariant", "fontWeight", "fontStretch", "fontSize", "fontSizeAdjust", "lineHeight", "fontFamily", "textAlign", "textTransform", "textIndent", "textDecoration", "letterSpacing", "wordSpacing", "tabSize", "MozTabSize"];
            var e = window.mozInnerScreenX != null;
 
            function c(k, l, o) {
                var h = o && o.debug || false;
                if (h) {
                    var i = document.querySelector("#input-textarea-caret-position-mirror-div");
                    if (i) {
                        i.parentNode.removeChild(i)
                    }
                }
                var f = document.createElement("div");
                f.id = "input-textarea-caret-position-mirror-div";
                document.body.appendChild(f);
                var g = f.style;
                var j = window.getComputedStyle ? getComputedStyle(k) : k.currentStyle;
                g.whiteSpace = "pre-wrap";
                if (k.nodeName !== "INPUT") {
                    g.wordWrap = "break-word"
                }
                g.position = "absolute";
                if (!h) {
                    g.visibility = "hidden"
                }
                d.forEach(function(p) {
                    g[p] = j[p]
                });
                if (e) {
                    if (k.scrollHeight > parseInt(j.height)) {
                        g.overflowY = "scroll"
                    }
                } else {
                    g.overflow = "hidden"
                }
                f.textContent = k.value.substring(0, l);
                if (k.nodeName === "INPUT") {
                    f.textContent = f.textContent.replace(/\s/g, "\u00a0")
                }
                var n = document.createElement("span");
                n.textContent = k.value.substring(l) || ".";
                f.appendChild(n);
                var m = {
                    top: n.offsetTop + parseInt(j["borderTopWidth"]),
                    left: n.offsetLeft + parseInt(j["borderLeftWidth"])
                };
                if (h) {
                    n.style.backgroundColor = "#aaa"
                } else {
                    document.body.removeChild(f)
                }
                return m
            }
            if (typeof b != "undefined" && typeof b.exports != "undefined") {
                b.exports = c
            } else {
                window.getCaretCoordinates = c
            }
        }())
    }])
});
POWERMODE.colorful = true;
POWERMODE.shake = false;
document.body.addEventListener("input", POWERMODE);
<!--彩色粒子特效结束-->

子比主题美化-文章版权声明样式美化

子比主题美化教程（持续更新中…）-胖猫营销网

子比主题：WordPress后台 >> 主题设置 >> 文章&列表 >> 文章页面 >> 将代码添加到“版权提示内容”中

需要看样式请在下方隐藏内查看

  此处内容已隐藏，请评论后刷新页面查看.

子比主题美化 – 网站展示新注册用户和会员用户模块代码

子比主题美化教程（持续更新中…）-胖猫营销网

无需覆盖主题源文件，只需要在你需要显示的位置添加此段代码即可

代码会自动适配你的主题颜色（全局功能==》显示布局==》全局主题色），基本无需改动，鼠标放在头像上会旋转

此功能默认只在电脑端显示，手机端不显示

部署教程

  此处内容已隐藏，请评论后刷新页面查看.
  • 使用方法
  • 把上面代码放到index.php文件里面，我这里提供了两个位置，其他的自行研究

1、首页全宽度放在 子比主题根目录的index.php文件里面 下方代码的下面保存即可

<main role="main" class="container">

2、首页内容顶部放在 子比主题根目录的index.php文件里面 下方代码的下面保存即可

<div class="content-layout">
温馨提示： 本文最后更新于2024-11-17 11:11:39，某些文章具有时效性，若有错误或已失效，请在下方 留言或联系 胖猫营销网 。
转载请注明来源、保留版权，谢谢合作！

加入QQ群图标 加入QQ群 微信公众号图标 微信公众号 联系我们图标 联系我们 请求更新图标 请求更新
© 版权声明
本文链接：
文章作者
胖猫营销网
隐私政策
政策
用户协议
协议
赞助我们
赞助
THE END
WordPress子比|Zibll最新发布最新资讯
# WordPress# 子比# 子比美化# zibll# 子比主题# 美化插件
喜欢就支持一下吧
点赞9赞赏 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容

广告位
默认头像

在线用户

dy抖音直播间采集软件 多线程多直播间采集-胖猫营销网
387人已阅读
dy抖音直播间采集软件 多线程多直播间采集
TOP1
任推邦APP轻松兼职赚钱攻略，日均收益600+，新手必备详细教程，稳定长期收入-胖猫营销网
任推邦APP轻松兼职赚钱攻略，日均收益600+，新手必备详细教程，稳定长期收入
2个月前267人已阅读
TOP2
最新剪映VIP免费版破解不收费-胖猫营销网
最新剪映VIP免费版破解不收费
5个月前196人已阅读
TOP3
宝子哥无人直播助手 无需付费版-胖猫营销网
宝子哥无人直播助手 无需付费版
2个月前196人已阅读
TOP4
智能AI语音阿里云语音合成-胖猫营销网
智能AI语音阿里云语音合成
4个月前195人已阅读
TOP5
子比主题美化教程（持续更新中...）-胖猫营销网
子比主题美化教程（持续更新中…）
3个月前156人已阅读
TOP6
点击在线投稿
投稿邮箱：botcn@hotmail.com
交流 QQ：656336268

胖猫の工具

 
胖猫推荐，安全有保障
立即进入