子比主题腾飞博客发布的评论区勋章背景添加教程

在主题目录下新建func.php文件，把以下代码填进去(记得加PHP头)：

//评论ID背景
function wxs_footer_info_add_img_bill($info, $comment, $depth)
{
    $user_ip = $comment->comment_author_IP;
    if ($user_ip) {
         //$user_ip_name = convertip(get_comment_author_ip());
        // $replyText_html = '<span class="reply-link">' .'' . '</span><span style="cursor:pointer" data-toggle="tooltip" alt="IP：'.$user_ip.'" data-original-title="IP地址：'.$user_ip_name.'">'.mb_substr($user_ip_name,-3,3,"utf-8").'</span>';
         $img_list = array('https://img.alicdn.com/imgextra/i4/4035900312/O1CN016TmVKl1EAwW3NPMSX_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i1/4035900312/O1CN0139FbhL1EAwW14dL3J_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i3/4035900312/O1CN01X4x5Cf1EAwW2YBV2G_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i1/4035900312/O1CN0131eSAA1EAwW1w4lLk_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i3/4035900312/O1CN01ZpISzi1EAwW1w5lkq_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i1/4035900312/O1CN01sQURys1EAwVyCHopJ_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i1/4035900312/O1CN01cccPpj1EAwW57vqpJ_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i4/4035900312/O1CN01JqPFUY1EAwW0EMtSg_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i3/4035900312/O1CN01lSv5gm1EAwW4TxVoo_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i2/4035900312/O1CN01jWDVeI1EAwW0HZ4Nb_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i1/4035900312/O1CN01Bh2rvI1EAwW0PyV0m_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i1/4035900312/O1CN01LjwcVV1EAwW14bauc_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i2/4035900312/O1CN01qAc8Ux1EAwW2YAMHF_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i2/4035900312/O1CN01kJhEBv1EAwW3kP1tx_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i4/4035900312/O1CN0129Wrqx1EAwW1w2YA2_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i2/4035900312/O1CN01W360ua1EAwW0Q0yqx_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i3/4035900312/O1CN01yAWzww1EAwVsiPKz3_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i1/4035900312/O1CN01bWTXbW1EAwW0EOMxh_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i1/4035900312/O1CN01Za5Kc21EAwVyZrXQj_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i1/4035900312/O1CN01fJizYG1EAwW3NOM5o_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i2/4035900312/O1CN010lWiCj1EAwW3kMY4J_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i1/4035900312/O1CN01nbEDzD1EAwW0Q1Ryk_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i2/4035900312/O1CN01kLnN0h1EAwVyZssbV_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i4/4035900312/O1CN01wn3nCX1EAwVyCLmCc_!!4035900312.png
', 'https://img.alicdn.com/imgextra/i3/4035900312/O1CN01Q1VzM11EAwW14cjaw_!!4035900312.png
');
         $color_list = array("rgb(138, 154, 247)", "rgb(187, 103, 138)","rgb(166, 236, 149)","rgb(172, 170, 94)","rgb(240, 88, 88)","rgb(182, 117, 243)","rgb(219, 96, 157)","rgb(245, 107, 72)"
         ,"rgb(196, 167, 104)","rgb(221, 42, 42)","rgb(240, 158, 226)","rgb(243, 200, 98)","rgb(248, 155, 200)","rgb(114, 153, 238)","rgb(214, 207, 107)","rgb(192, 127, 235)","rgb(197, 184, 30)","rgb(245, 155, 210)","rgb(231, 197, 152)","rgb(98, 98, 119)","rgb(221, 200, 173)","rgb(110, 175, 187)","rgb(137, 141, 190)","rgb(166, 152, 238)","rgb(104, 192, 207)","rgb(216, 124, 152)");
         $img_res=array_rand($img_list);
         $color_res=array_rand($color_list);
          
         $bill_html = '<div class="bili-dyn-item__ornament"><div class="bili-dyn-ornament"><div class="bili-dyn-ornament__type--3"><img  src="https://www.zibll.top/wp-content/themes/zibll/img/thumbnail.svg" data-src="' . $img_list[$img_res]. '" ><span style="color:' . $color_list[$color_res] . '">'.str_pad($comment->user_id,5,"0",STR_PAD_LEFT).'</span></div></div></div>';
            $info = $info .$bill_html;
        // $info = $info .$replyText_html .$bill_html;
    }
    return $info;
}
add_filter('comment_footer_info', 'wxs_footer_info_add_img_bill', 10, 3);

然后把如下代码放到子比主题的自定义CSS即可：

/*网站评论美化*/
.bili-dyn-item__ornament {
    position: sticky;
    /*right: 48px;*/
    top: 18px;
    margin-top: -10px;
    float: right;
}
.bili-dyn-ornament__type--3 {
    height: 44px;
    width: 146px;
}
.bili-dyn-ornament img {
    height: 100%;
    width: 100%;
}
.bili-dyn-ornament__type--3 span {
    font-family: num !important;
    font-size: 12px;
    position: absolute;
    right: 54px;
    top: 15px;
    transform: scale(.88);
    transform-origin: right;
}
  @font-face {
                font-family: num;
                src: url('data:font/ttf;base64,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AGMAbwBtAFIAZQBlAEoAaQAtAEIAaQBnAFIAdQBpAHgAYQBpAG4ALQBCAGwAYQBjAGsARwBCAFYAMQAuADAAQwBvAHAAeQByAGkAZwBoAHQAKABjACkAIAAyADAAMQA1ACAAUgBFAEUASgBJACAAlQAQAFsAVwBdAOUAYgA/AA0ACgBTAGgAYQBuAGcAIABoAGEAaQAgAFIAdQBpACAAWABpAGEAbgAgAEMAcgBlAGEAdABpAHYAZQAgAEQAZQBzAGkAZwBuACAAQwBvAC4AIABMAHQAZAAuAP8ADAANAAoATgAKAG0AdwCVABAAfgC/AFIAGwBhAA8AiwC+AIsAoQBnAAkAlgBQAFEAbABTAPgADQAKAHcAdwB3AC4AcgBlAGUAagBpAC4AYwBvAG0ADQAKAFEAUQA6ADIANwA3ADAAOAA1ADEANwAzADMADQAKAE0AYQBpAGwAOgBSAGUAZQBqAGkAZgBvAG4AdABAAG8AdQB0AGwAbwBvAGsALgBjAG8AbQACAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOAA4AAAARABMAFAAVABYAFwAYABkAGgAbABwAMQAyAAA=');
            }
/*手机适配*/
@media (max-width: 420px){
.bili-dyn-ornament__type--3 {
    width: 11rem !important;
}
}