二维码动态Border跑马灯效果
/*底部板块三图片border*/
.footer-miniimg {
p{
position: relative;
&:hover {
filter: contrast(1.1);
}
&:active {
filter: contrast(0.9);
}
&::before,
&::after{
content: "";
border: 2px solid;
border-image: linear-gradient(45deg, gold, deeppink) 1;
position: absolute;
top: -5px;
left: -5px;
right: -5px;
bottom: -5px;
animation: clippath 3s infinite ;
}
&::before{
animation: clippath 3s infinite -1.5s linear;
}
}
}
@keyframes clippath {
0%,
100% {
clip-path: inset(0 0 96% 0);
filter: hue-rotate(0deg);
}
25% {
clip-path: inset(0 96% 0 0);
}
50% {
clip-path: inset(96% 0 0 0);
filter: hue-rotate(360deg);
}
75% {
clip-path: inset(0 0 0 96%);
}
}拦截灌水评论正则验证代码
最近都能看到垃圾评论，纯英文有些还附带网址，现在每天几条虽然不多，但以后很难说。每次都要到后台删也是很麻烦的，又不喜欢装插件，就给子比加个正则验证吧，限制评论纯数字/纯英文/纯表情
将代码放到/wp-content/themes/zibll/func.php文件即可。注意 此方法评论必须带中文 禁止了纯数字、纯字母和纯表情。
//屏蔽纯英文评论
function refused_english_comments($incoming_comment) {
// 获取评论内容
$comment_content = $incoming_comment['comment_content'];
// 去除评论内容中的 [g=xxx] xxx为任意字符串
$comment_content = preg_replace('/\[g=[^\]]*\]/', '', $comment_content);
// 检查评论内容是否为空
if (empty($comment_content)) {
wp_die('{"error":1,"ys":"danger","msg":"评论不能是纯表情内容 <br/>Comments cannot be purely emoji content"}');
}
// 检查评论内容是否包含中文
$pattern = '/[一-龥]/u';
// 禁止全英文评论
if (!preg_match($pattern, $comment_content)) {
wp_die('{"error":1,"ys":"danger","msg":"评论必须包括中文 <br/>Comments must include Chinese"}');
}
return $incoming_comment;
}
add_filter('preprocess_comment', 'refused_english_comments');置顶角标美化
css代码：
.posts-item badge.img-badge.left.jb-red {
position: absolute;
top: 10px;
right: -50px;
z-index: 1;
width: 140px;
height: 20px;
background: var(--theme-color);
color: #fff;
line-height: 20px;
transform: rotate(45deg);
text-align: center;
font-size: 12px;
left: auto;
border-radius: 0 50px 50px 0;
}如果需要修改背景颜色或修改为图片只需要将var(–theme-color)改成想要的颜色或图片即可，默认跟随主题色。
侧边栏广告小工具模块代码
非常实用的一个侧边栏美化，可以在侧边栏添加抽奖，赞助，广告，提醒等内容，引导会员开通及浏览页面，喜欢的朋友自行下载测试。
抽奖中心小工具模块代码：
<style>
.countdown-activity {
padding: 20px;
background-color: #3e516d;
background-image: linear-gradient(75deg, #2f3b42 0%, #3e516d 39%, #222538 100%);
color: #fff;
justify-content: center;
display: flex;
font-size: 18px;
line-height: 1.4;
justify-content: space-evenly !important;
}
.activity-title {
font-size: 1.5em;
font-weight: bold;
}
.ztw-bg {
background-color: #3e516d;
background-image: linear-gradient(75deg, #2f3b42 0%, #3e516d 39%, #222538 100%);
color: #fff;
--this-bg: linear-gradient(75deg, #2f3b42 0%, #3e516d 39%, #222538 100%);
}
</style>
<div class="ztw-bg zib-widget mb10-sm ztw-bg" style="margin: -15px; margin-bottom: -30px;"><div class="colorful-make" style="transform: rotate(-9deg) scale(0.7);"></div>
<div class="flex ab c jsb"><div class=""><div class="flex ac"><b class="em14">在线抽奖中心</b></div>
<div style="" class="em09 opacity8">没有积分？在这里试试运气吧！</div>
<a href="/choujiang" data-onclick="[href=#user-tab-product]" class="mt6 but radius jb-cyan px12 p2-10">点击抽奖<i style="margin:0 0 0 6px;" class="fa fa-angle-right em12"></i></a>
</div>
<span class="avatar-img mr10 mt3" style="--this-size: 59px;"><svg class="icon" style="font-size: 5em;vertical-align: middle;fill: currentColor;overflow: hidden;margin-top: -15px;" viewBox="0 0 1024 1024"><path d="M628.128 85.44c84.8-48.96 183.104-45.504 219.68 17.92 30.208 52.288 4.032 121.44-55.296 171.744l-6.048 4.96-39.872-50.048c41.696-33.216 57.952-73.632 45.792-94.688-14.944-25.888-74.24-27.968-132.256 5.568-56 32.32-83.872 82.176-72.384 108.896l1.408 2.88-55.424 32c-36.576-63.392 9.6-150.24 94.4-199.2z" fill="#5DE1C8" p-id="14455"></path><path d="M417.28 85.44c-84.8-48.928-183.104-45.472-219.68 17.92-31.104 53.824-2.464 125.344 60.256 175.84l6.176 4.832 38.624-51.008c-44.288-33.568-62.24-75.84-49.632-97.696 14.944-25.888 74.24-27.968 132.288 5.568 55.968 32.32 83.84 82.176 72.384 108.896l-1.44 2.88 55.424 32c36.576-63.36-9.6-150.24-94.4-199.2z" fill="#5DE1C8" p-id="14456"></path><path d="M896 229.056H128a96 96 0 0 0-96 96v96a96 96 0 0 0 96 96h768a96 96 0 0 0 96-96v-96a96 96 0 0 0-96-96z m-768 64h768a32 32 0 0 1 32 32v96a32 32 0 0 1-32 32H128a32 32 0 0 1-32-32v-96a32 32 0 0 1 32-32z" fill="#1890FF" p-id="14457"></path><path d="M224 976.576a96 96 0 0 1-95.84-90.368L128 880.576v-384a32 32 0 0 1 28.256-31.808L160 464.576h704a32 32 0 0 1 31.776 28.256l0.224 3.744v77.248a32 32 0 0 1-63.776 3.712L832 573.824v-45.28H192v352a32 32 0 0 0 28.256 31.808l3.744 0.224h307.2c41.216 0 42.624 59.648 4.288 63.776l-4.256 0.224H224z" fill="#1890FF" p-id="14458"></path><path d="M800 648c-100.544 0-184 33.376-184 88s83.456 88 184 88 184-33.376 184-88-83.456-88-184-88z m0 48c76.192 0 136 23.904 136 40s-59.808 40-136 40c-76.192 0-136-23.904-136-40s59.808-40 136-40z" fill="#FF7272" p-id="14459"></path><path d="M960 801.6a24 24 0 0 1 24 24c0 54.624-83.456 88-184 88s-184-33.376-184-88a24 24 0 0 1 48 0c0 16.096 59.808 40 136 40 76.192 0 136-23.904 136-40a24 24 0 0 1 24-24z" fill="#FF7272" p-id="14460"></path><path d="M960 891.2a24 24 0 0 1 24 24c0 54.624-83.456 88-184 88s-184-33.376-184-88a24 24 0 0 1 48 0c0 16.096 59.808 40 136 40 76.192 0 136-23.904 136-40a24 24 0 0 1 24-24z" fill="#FF7272" p-id="14461"></path></svg></span></div>
</div>赞助会员小工具模块代码（自动弹窗购买页面）：
<style>
.countdown-activity {
padding: 20px;
background-color: #3e516d;
background-image: linear-gradient(75deg, #2f3b42 0%, #3e516d 39%, #222538 100%);
color: #fff;
justify-content: center;
display: flex;
font-size: 18px;
line-height: 1.4;
justify-content: space-evenly !important;
}
.activity-title {
font-size: 1.5em;
font-weight: bold;
}
.ztw-bj {
background-color: #d9534f;
background-image: linear-gradient(#fc423c 33.19%, #f6f1f1 71.01%, #25a6a2);
color: #fff;
--this-bj: linear-gradient(75deg, #2f3b42 0%, #3e516d 39%, #222538 100%);
}
</style>
<div class="ztw-bj zib-widget mb10-sm ztw-bj" style="margin: -15px; margin-bottom: -30px;"><div class="colorful-make" style="transform: rotate(-9deg) scale(0.7);"></div>
<div class="text-center"><div class=""><div class="ac"><b class="em14">99赞助永久会员-全站任意下载</b></div>
<div style="" class="em09 opacity8">每日更新资源，精选配图，站长任意搬</div> <br>
<a href="javascript:;" data-onclick="[href=#user-tab-product]" class="mt6 but radius jb-red px12 p2-10 pay-vip">立即查看<i style="margin:0 0 0 6px;" class="fa fa-angle-right em12"></i></a>
</div>
</span></div>
</div>支付时效侵权等各种提示按钮小工具模块代码：
<div style="margin: -15px;">
<a target="_blank" class=" btn-block btn-no btn-lg em12 but jb-yellow" href="mailto:邮箱地址"
rel="nofollow noopener noreferrer">支付或链接失效问题反馈（24小时内答复）</a><a target="_blank"
class="btn-block btn-no btn-lg em12 but jb-green" href="" rel="nofollow noopener noreferrer">及提供大家学习和研究，本站不提供任何技术支持</a><a
target="_blank" class="btn btn-info btn-block btn-no em12" href="/newposts"
rel="nofollow noopener noreferrer">资源分享（投稿赚取分成）</a><a target="_blank" class="btn-block btn-no btn-lg but b-purple"
href="/about" rel="nofollow noopener noreferrer">如果遇到链接失效请大家反馈</a><a
target="_blank" class="btn btn-primary btn-block btn-no em12" href="mailto:邮箱地址"
rel="nofollow noopener noreferrer">侵权举报</a></div>首页分类栏目标题美化
/*分类栏目美化*/
.index-tab ul>li.active {
color: #ffffff00!important;
background-color: #ffffff00!important;
border-radius: 6px;
z-index: 1;
position: relative;
height: 39px;
line-height: 44px;
background: url(图片链接) repeat;
-webkit-background-size: 91px 39px;
-moz-background-size: 91px 39px;
background-size: 91px 39px;
}
.index-tab ul>li {
display: inline-block;
padding: 2px 17px;
font-weight: 500;
border-radius: 20px;
margin: 0 1px;
}添加闪动IPv6标识效果
很多网站都支持IPv6，但是对于很多网站想要一个标识的效果给自己的网站，此效果本站在底部，可以查看，非常美观的一个闪动Pv6标识。
![图片[1] - 子比主题美化教程 - 鹿泽笔记](https://www.bailuze.com/wp-content/uploads/2025/07/202507180004.gif)
HTML
<span class="tengfei_ipv6 tag_ipv6">IPv6</span>CSS
.tengfei_ipv6{display: inline; padding: 0.2em 0.6em; margin: 0px 5px; border-radius: 0.25em; background: rgb(92, 184, 92); color: rgb(255, 255, 255); font-size: 12px; font-weight: 200; line-height: 20px; vertical-align: baseline;}
.tag_ipv6{display:inline!important;float:none!important;padding:.2em .6em;margin:0 5px;position:relative!important;overflow:hidden;outline:none;border-radius:.25em;background:#5cb85c;color:#fff;font-size:12px;font-weight:200;line-height:20px;vertical-align:super;animation:blink 1s linear infinite;-webkit-animation:blink 1s linear infinite;-moz-animation:blink 1s linear infinite;-ms-animation:blink 1s linear infinite;-o-animation:blink 1s linear infinite;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.tag_ipv6,.tag_ipv6 a,.tag_ipv6 a:hover,.tag_ipv6:hover{text-decoration:none!important}.tag_ipv6:after{background:#5cb85c;-moz-transform:translateX(-50%) translateY(-50%) rotate(-25deg);-ms-transform:translateX(-50%) translateY(-50%) rotate(-25deg);-webkit-transform:translateX(-50%) translateY(-50%) rotate(-25deg);transform:translateX(-50%) translateY(-50%) rotate(-25deg)}@keyframes blink{0%{opacity:1;border:1px solid #fff;background-color:transparent;transition:all .4s ease-in-out}50%{opacity:.9;border:1px solid #5cb85c}to{opacity:.9;border:1px solid #fff}}@-webkit-keyframes blink{0%{opacity:1}50%{opacity:.9}to{opacity:1}}@-moz-keyframes blink{0%{opacity:1}50%{opacity:.9}to{opacity:1}}@-ms-keyframes blink{0%{opacity:1}50%{opacity:.9}to{opacity:1}}@-o-keyframes blink{0%{opacity:1}50%{opacity:.9}to{opacity:1}}.tag_ipv6:after{content:"";height:100%;width:100%;position:absolute;display:inline;margin:0;top:0;left:0;z-index:-1;animation:pulsate 1s ease-out;animation-iteration-count:infinite;animation-delay:1.1s}@keyframes pulsate{0%{transform:scale(.1);opacity:0;filter:alpha(opacity=0)}50%{opacity:1;filter:none}to{transform:scale(1.2);opacity:0;filter:alpha(opacity=0)}}👋 感谢您的观看！
© 版权声明
THE END