演示

JS代码

<!--鼠标点击文字--> 
<script type="text/javascript">
/* 鼠标特效 */
var a_idx = 0;
jQuery(document).ready(function($) {
    $("body").click(function(e) {
        var a = new Array( "富强", "民主", "文明", "和谐", "自由", "平等", "公正" ,"法治", "爱国", "敬业", "诚信", "友善");
        var $i = $("<span />").text(a[a_idx]);
        a_idx = (a_idx + 1) % a.length;
        var x = e.pageX,
        y = e.pageY;
        $i.css({
            "z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
            "top": y - 20,
            "left": x,
            "position": "absolute",
            "font-weight": "bold",
            "color": "#ff6651"
        });
        $("body").append($i);
        $i.animate({
            "top": y - 180,
            "opacity": 0
        },
        1500,
        function() {
            $i.remove();
        });
    });
});
</script>
<!--鼠标点击文字-->

演示

CSS代码

.posts-item.card {
    padding: 35px 10px 10px 10px!important;
}
    .posts-item {
    position: relative !important;
}
    .posts-item.card::before {
    content: "";
    display: block;
    background: #fc625d;
    top: 13px;
    left: 15px;
    border-radius: 50%;
    width: 9px;
    height: 9px;
    box-shadow: 16px 0 #fdbc40, 32px 0 #35cd4b;
    margin: 0px 2px -7px;
    z-index: 1000;
    position: absolute;
}

打开你网页目录 /wp-content/themes/zibll/js 里的 svg-ico.js 文件
第63行，找到 zib_svgs[‘user-auth’] 

然后修改SVG样式
zib_svgs[‘user-auth’] = ‘你的SVG代码’;
当然这篇文章讲的是仿bilibili的认证图标，类似这样：

这个图标的SVG代码是：

<path d="M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z" fill="#FFFFFF" p-id="4885"/><path d="M512 512m-418.909091 0a418.909091 418.909091 0 1 0 837.818182 0 418.909091 418.909091 0 1 0-837.818182 0Z" fill="#4AC7FF" p-id="4886"/><path d="M474.112 763.950545a33.28 33.28 0 0 1-14.056727 4.049455 21.038545 21.038545 0 0 1-21.317818-20.805818 19.549091 19.549091 0 0 1 1.210181-5.864727l40.494546-187.438546-167.656727 0.325818a21.224727 21.224727 0 0 1-21.876364-20.805818 20.433455 20.433455 0 0 1 9.495273-16.849454l250.181818-255.767273c4.608-2.792727 9.541818-4.747636 14.661818-4.794182a21.131636 21.131636 0 0 1 21.364364 20.852364 19.968 19.968 0 0 1-2.792728 9.774545l-40.215272 184.32h167.842909a21.178182 21.178182 0 0 1 21.643636 20.852364 20.293818 20.293818 0 0 1-9.495273 16.942545l-249.483636 255.208727z" fill="#FFFFFF" p-id="4887"/>

第一款【最新版本】最为简单添加代码一步到位

这次优化了可以自定义添加多个样式，加了总消费金额等

演示

代码

以下PHP代码放置于主题目录下的funtions.php或func.php

第二款【旧版本】需要分几步添加代码才能完成

免费Zibll子比主题美化 – 用户中心添加UID/用户名/邮箱按钮点击带有复制功能

1年前

341812

教程

在你的 functions.php 文件中，添加以下代码，定义一个自定义 Walker 类，用于处理分类项目并在其后面显示文章数量。

在你的 zib_menu_items 函数中，使用自定义 Walker 类来生成导航菜单：

函数位于/inc/functions/zib-header.php 搜索zib_menu_items($location = 'topmenu', $echo = true)

将整个函数替换为

CSS代码

CSS代码

CSS代码

CSS代码