1.热搜
两个版本分两个文件，定位：/wp-content/themes/zibll/pages 目录下，自己创建一个文件后缀php就行，我这里的是 hottop.php 文件，自己创建一个新文件，话不多说直接上附件代码！直接将下面的代码上传到pages下面，两个版本文件名字一样，喜欢哪个就上传哪个！
上传之后到：WP后台–>>页面–>>新建页面–>>选择你上传的版本
热搜
2.子比主题 – 文本超链接美化样式
![图片[1]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-1024x472.png)
子比主题–>>自定义CSS样式即可！
@font-face {
font-family: 'tengfei-font';
src: url('//at.alicdn.com/t/c/font_4823557_nwo4uyriby.woff2?t=1741491889382') format('woff2'),
url('//at.alicdn.com/t/c/font_4823557_nwo4uyriby.woff?t=1741491889382') format('woff'),
url('//at.alicdn.com/t/c/font_4823557_nwo4uyriby.ttf?t=1741491889382') format('truetype');
}
.wp-posts-content a:not([class]),.wp-block-list a:not([class]) {
color: var(--focus-color);
line-height: 1.15em;
padding: .1em .35em;
font-size: max(.75rem,.75em);
border-radius: 2em;
background: var(--focus-color-opacity1) linear-gradient(var(--focus-shadow-color) 0 0) no-repeat 100% 100%/0 100% border-box;
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
transition: .7s cubic-bezier(.6,.1,0,1),background-position 0s;
word-break: break-all;
display: inline-flex;
align-items: center;
transform: translateY(-1.15px)
}
.wp-posts-content a:not([class]):hover,.wp-block-list a:not([class]):hover {
color: #fff;
background-position-x: 0;
background-size: 100% 100%
}
.wp-posts-content a:not([class]):before,.wp-block-list a:not([class]):before {
content: "\ec7f";
font-family: 'tengfei-font';
height: 1.15em;
display: -webkit-inline-flex;
display: inline-flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
aspect-ratio: 1;
margin: 0 0 0 -.3em;
background: var(--focus-shadow-color);
border-radius: 50%;
color: #fff;
transition: inherit
}
.wp-posts-content a:not([class]):hover:before,.wp-block-list a:not([class]):hover:before {
background: #fff;
color: var(--focus-color);
rotate: 45deg;
scale: .9
}3.子比主题美化 – 小工具标题美化
![图片[2]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-2-1024x317.png)
HTML代码，放进后台的自定义头部HTML代码
<div class="file-format" data-v-2775696c=""><span id="index-xtips" class="txt-file-format" data-v-2775696c="">超强生产力，动力足！</span> <span class="file-format-icons" data-v-2775696c=""><i class="icon_ps" data-v-2775696c=""></i> <i class="icon_ai" data-v-2775696c=""></i> <i class="icon_sketch" data-v-2775696c=""></i> <i class="icon_3dMax" data-v-2775696c=""></i> <i class="icon_cdr" data-v-2775696c=""></i> <i class="icon_c4d" data-v-2775696c=""></i> <i class="icon_blender" data-v-2775696c=""></i></span></div>CSS代码
/*小工具副标题美化*/
.file-format {
padding: 0 20px;
height: 38px;
background: linear-gradient(224deg, rgba(255, 110, 144, .08), rgba(208, 147, 255, .08) 42%, rgba(105, 105, 255, .08) 100%, rgba(105, 105, 255, .08) 0);
border-radius: 28px;
display: flex;
align-items: center;
justify-content: center;
}
span.txt-file-format {
font-size: 13px;
font-weight: 700;
color: #424866;
line-height: 18px;
margin-right: 17px;
}
i.icon_ai[data-v-2775696c], i.icon_ps[data-v-2775696c] {
width: 26px;
height: 26px;
display: inline-block;
vertical-align: middle;
}
i.icon_ps[data-v-2775696c] {
background: url(https://www.macgf.com/img/icon-ps.svg) no-repeat 50% / 100%;
}
.stay-tuned-box .file-format .file-format-icons i[data-v-2775696c] {
margin-right: 9px;
}
i.icon_ai[data-v-2775696c] {
background: url(https://www.macgf.com/img/icon-ai.svg) no-repeat 50% / 100%;
}
i.icon_sketch[data-v-2775696c] {
width: 26px;
height: 26px;
display: inline-block;
background: url(https://www.macgf.com/img/icon-sketch.svg) no-repeat 50% / 100%;
vertical-align: middle;
}
.stay-tuned-box .file-format .file-format-icons i[data-v-2775696c] {
margin-right: 9px;
}
i.icon_3dMax[data-v-2775696c], i.icon_blender[data-v-2775696c] {
width: 26px;
height: 26px;
display: inline-block;
vertical-align: middle;
}
i.icon_3dMax[data-v-2775696c] {
background: url(https://www.macgf.com/img/icon-3dMax.svg) no-repeat 50% / 100%;
}
.stay-tuned-box .file-format .file-format-icons i[data-v-2775696c] {
margin-right: 9px;
}
i.icon_c4d[data-v-2775696c], i.icon_cdr[data-v-2775696c] {
width: 26px;
height: 26px;
display: inline-block;
vertical-align: middle;
}
i.icon_cdr[data-v-2775696c] {
background: url(https://www.macgf.com/img/icon-cdr.svg) no-repeat 50% / 100%;
}
.stay-tuned-box .file-format .file-format-icons i[data-v-2775696c] {
margin-right: 9px;
}
i.icon_c4d[data-v-2775696c] {
background: url(https://www.macgf.com/img/icon-c4d.svg) no-repeat 50% / 100%;
}
i.icon_blender[data-v-2775696c] {
background: url(https://www.macgf.com/img/icon-blender.svg) no-repeat 50% / 100%;
}
i.icon_3dMax[data-v-2775696c], i.icon_blender[data-v-2775696c] {
width: 26px;
height: 26px;
display: inline-block;
vertical-align: middle;
}
/*小工具副标题美化*/4.子比主题功能增强 – 文章列表标题自定义文字或图标前缀（初一小盏版）
![图片[3]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-3.png)
代码放在 functions.php 下或 func.php
CSF::createMetabox('DearLicy_titles', array(
'title' => '标题前缀',
'post_type' => 'post',
'context' => 'advanced',
'data_type' => 'unserialize',
'priority' => 'high',
));
CSF::createSection( 'DearLicy_titles', array(
'fields' => array(
array(
'id' => 'titles_moshi',
'type' => 'radio',
'title' => '模式选择',
'desc' => '选择图片或自定义文字',
'inline' => true,
'options' => array(
'img' => '图片',
'text' => '文字',
),
'default' => 'img', // 默认选择图片模式
),
array(
'id' => 'text',
'type' => 'text',
'title' => '文字模式',
'desc' => '建议两个字',
'dependency' => array( 'titles_moshi', '==', 'text' ), // 依赖关系：当模式选择为文字时显示
),
array(
'id' => 'text_bg_color',
'type' => 'palette',
'title' => '背景颜色',
'desc' => '部分颜色带有文字颜色，其余默认白色',
'class' => 'compact skin-color',
'default' => "jb-vip2",
'options' => CFS_Module::zib_palette(array(), array('jb')),
'dependency' => array( 'titles_moshi', '==', 'text' ), // 依赖关系：当模式选择为文字时显示
),
array(
'id' => 'img',
'type' => 'palette',
'title' => '选择一个图片',
'desc' => '固定使用以下几款SVG图标',
'class' => 'compact skin-color',
'default' => "jb-vip2",
'options' => DearLicy_Module::DearLicy_imgtitle(),
'dependency' => array( 'titles_moshi', '==', 'img' ), // 依赖关系：当模式选择为图片时显示
),
),
));
class DearLicy_Module
{
public static function DearLicy_imgtitle($palette = array())
{
$palette = array_merge($palette, array(
'shice' => array('url(https://www.vxras.com/wp-content/plugins/DearLicy/assets/img/shice.svg);width: 50px;'),
'dujia' => array('url(https://www.vxras.com/wp-content/plugins/DearLicy/assets/img/10002.svg);width: 50px;'),
'shoufa' => array('url(https://www.vxras.com/wp-content/plugins/DearLicy/assets/img/10001.svg);width: 50px;'),
));
return $palette;
}
}
function apply_dearlicy_prefixes_to_title($title, $id = null) {
// 只有在前端，并且非单个页面，才对标题进行更改
if (!is_admin() && !is_single() && $id) {
// 先获取meta box中的设置项
$prefixes_setting = get_post_meta($id, 'titles_moshi', true);
if($prefixes_setting == 'img') {
$selected_img = get_post_meta($id, 'img', true);
$img_url ='';
switch ($selected_img) {
case 'shice':
$img_url = 'https://www.vxras.com/wp-content/plugins/DearLicy/assets/img/shice.svg';
break;
case 'shoufa':
$img_url = 'https://www.vxras.com/wp-content/plugins/DearLicy/assets/img/10001.svg';
break;
case 'dujia':
$img_url = 'https://www.vxras.com/wp-content/plugins/DearLicy/assets/img/10002.svg';
break;
}
if(!empty($img_url)) {
$title = "<img src='$img_url' alt='$img_url' style=' height: 20px; pointer-events: none;margin-right: 3px;'/>" . $title;
}
} else {
// 对保存的文字前缀进行处理
$prefix_text = get_post_meta($id, 'text', true);
$prefix_bg_color = get_post_meta($id, 'text_bg_color', true);
if (!empty($prefix_text)) {
$title = "<span class='DearLicy_prefix ". esc_attr($prefix_bg_color) ."'>" . esc_html($prefix_text) . "</span> " . $title;
}
}
}
return $title;
}
add_filter('the_title', 'apply_dearlicy_prefixes_to_title', 10, 2);CSS代码
.DearLicy_prefix{
position: relative;
overflow: hidden;
display: inline-flex;
align-items: center;
border-radius: 5px;
padding: 5px 4px;
margin-right: 3px;
height: 19px;
font-size: 12px;
top: -3px;
clip-path: polygon(7% 0, 99% 0, 93% 100%, 0 100%);
}
.DearLicy_prefix:after, .DearLicy_prefix:after {
position: absolute;
content: " ";
display: block;
left: -100%;
top: -5px;
width: 15px;
height: 145%;
background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
animation: sweepTitle 3s ease-in-out infinite;
transform: rotate(28deg);
}
@keyframes sweepTitle {
0% {
left: -100%
}
100% {
left: 100%
}
}5.子比主题美化 右上角炫彩会员背景修改
![图片[4]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-4.png)
复制下方代码添加到后台 自定义代码 css样式中就可以了
.pay<a target="_blank" href="https://vip.lzzcc.cn/tag/vip" title="View all posts in vip">vip</a>-icon{color: #ffffff;--this-color: #ffffff;background:linear-gradient(135deg,#ff7faf91 10%,#43b2ff 100%);}.<a href="https://vip.lzzcc.cn/tag/vip" title="更多关于 vip 的文章-大海资源库" target="_blank">vip</a>-theme1{background:linear-gradient(135deg,#ff7faf91 10%,#43b2ff 100%);}.vip-theme2{background:linear-gradient(43deg,#ff6ac3 0%,#465dff 46%,#72e699 100%);color:#e4e2fb;}![图片[5]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-5-1024x513.png)
教程如下：
首先我们要知道这个页面一共有2两个文件的代码，一个是CSS和一个PHP也就是子比PHP文件
我先说一下教程，我们将PHP文件放到/wp-content/themes/zibll/pages这个目录下面，然后你们打开上传的php文件，找到底部引入的CSS目录，请将目录改成你的即可，我直接分享文件，我就不放代码了！
子比主题美化 – 添加一个VIP会员详情页面
6.子比主题 – 用户中心添加UID、注册时间功能
![图片[6]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-6-1024x567.png)
将下面的代码放到 /wp-content/themes/zibll/functions.php 或者 func.php 文件即可
/*
* 定义用于显示用户ID的函数
* 'but'是配合函数赋予class样式'but'在子比主题内通常是按钮样式可配合c-blue或jb-pink赋予色彩
* c系列为透明背景，颜色有c-blue、c-blue-2、c-cyan、c-gray、c-green、c-green-2、c-purple、c-purple-2、c-red、c-red-2、c-theme、c-white、c-yellow、c-yellow-2
* jb系列为非透明渐变色背景，颜色有pay-tag、jb-red、jb-pink、jb-yellow、jb-blue、jb-cyan、jb-green、jb-purple、jb-vip1、jb-vip2
*/
function ZbTool_user_id_to_desc($desc, $user_id) {
// 初始化变量
$day = true; // 可以根据需要进行动态设置
$uid = true; // 可以根据需要进行动态设置
$pay_price = true; // 可以根据需要进行动态设置
$demo = true; // 可以根据需要进行动态设置
// 初始化输出变量
$output = [];
// 判断 uid 为 true
if ($uid) {
$icon = '<svg class="icon" aria-hidden="true"><use xlink:href="#icon-tag-color"></use></svg>'; // 图标 可自行更换
$but = 'UID：' . esc_html($user_id);
$class = 'c-red';
$output[] = '<span class="but ' . esc_attr($class) . '">' . $icon . $but . '</span>';
}
// 判断 day 为 true
if ($day) {
$icon = ''; // 图标 如果有需要的话
$but = zib_get_user_join_day_desc($user_id, 'but c-cyan'); // 获取用户加入天数描述
$class = '';
$output[] = $but;
}
// 判断 pay_price 为 true
if ($pay_price) {
$icon = ''; // 图标 可自行更换
$but = zibpay_get_user_pay_price($user_id, 'pay_price');
$class = 'jb-vip2';
$output[] = '<span class="but ' . esc_attr($class) . '">总消费：' . esc_html($but) . '</span>';
}
// 判断 demo 为 true
if ($demo) {
$icon = ''; // 图标 可自行更换
$but = '我是添加样式的演示~';
$class = 'c-purple';
$output[] = '<span class="but ' . esc_attr($class) . '">' . esc_html($but) . '</span>';
}
// 将生成的内容添加到原始描述
$desc = implode(' ', $output) . ' ' . $desc;
return $desc;
}
// 添加过滤器
add_filter('user_page_header_desc', 'ZbTool_user_id_to_desc', 10, 2);
add_filter('author_header_identity', 'ZbTool_user_id_to_desc', 10, 2);7.子比美化 – 灵动岛美化样式
![图片[7]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-7-1024x474.png)
CSS
.dynamic-island:hover img {width:30px; height:30px;;}
.bars {display:flex;align-items:center; justify-content:flex-end; gap:3px;}
.bar {width:2px;height:13px;background-color:green;animation:bounce 1s infinite ease-in-out;animation-direction:alternate;}
.bar:nth-child(1) {animation-duration:1s;}
.bar:nth-child(2) {animation-duration:0.9s;}
.bar:nth-child(3) {animation-duration:0.8s;}
.bar:nth-child(4) {animation-duration:0.7s;}
.bar:nth-child(5) {animation-duration:0.6s;}
.bar:nth-child(6) {animation-duration:0.9s;}
.bar:nth-child(7) {animation-duration:0.7s;}
.dynamic-island {position:fixed;top:80px;left:50%;transform:translateX(-50%) scale(0); transform-origin:center;width:auto;max-width:80%;height:40px;background-color:#000;border-radius:25px; color:white;display:flex;align-items:center;justify-content:space-between; transition:transform 0.4s ease-in-out,height 0.6s ease-in-out,border-radius 0.6s ease-in-out,box-shadow 0.5s ease-in-out,opacity 0.5s ease-in-out;overflow:visible; z-index:1000;padding-left:35px; padding-right:20px; opacity:0;box-shadow:0 0px 10px rgba(0,0,0,0.45);;}
.dynamic-island.active {transform:translateX(-50%) scale(1); opacity:1;}
.dynamic-island.inactive {transform:translateX(-50%) scale(0); opacity:0;}
.island-content {opacity:0;transition:opacity 0.9s ease-in-out,filter 0.8s ease-in-out; font-weight:bold; flex-grow:1; text-align:right; width:100%;}
.dynamic-island.active .island-content {opacity:1;}
.dynamic-island img {position:absolute;left:10px; width:20px; height:20px; object-fit:cover; transition:height 0.8s ease-in-out,width 0.8s ease-in-out,filter 0.8s ease-in-out;}
.dynamic-island:hover {height:60px;border-radius:50px;}
@keyframes bounce {0% {transform:scaleY(0.3);background-color:green;}
50% {transform:scaleY(1);background-color:orange;}
100% {transform:scaleY(0.3);background-color:green;}
;}自定义html
<div class="dynamic-island inactive" id="dynamicIsland" style="opacity: 0;">
<img src="https://img.alicdn.com/imgextra/i1/2210123621994/O1CN01lajerM1QbIl9aoHcJ_!!2210123621994.png" alt="通知图标" width="30" height="30">
<div class="island-content">
<div class="bars" style="line-height: 50px; margin: 0;">
<p style="line-height: 50px; margin: 0; font-size: 12px; padding-right: 10px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"> 欢迎访问***博客</p>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
</div>
</div>
</div>func.php
function add_dynamic_island_script() {
?>
<script type="text/javascript">
window.onload = function() {
triggerIsland();
let title;
const currentUrl = window.location.pathname;
if (currentUrl.includes('/message/')) {
document.querySelector('.bars p').innerText = "正在访问消息页面";
} else if (currentUrl.includes('/user/')) {
document.querySelector('.bars p').innerText = "欢迎来到用户中心";
} else if (document.body.classList.contains('home') || document.body.classList.contains('front-page')) {
document.querySelector('.bars p').innerText = "欢迎来到<?php echo get_bloginfo('name'); ?>";
} else if (document.body.classList.contains('single')) {
title = "<?php echo addslashes(html_entity_decode(get_the_title())); ?>";
document.querySelector('.bars p').innerText = "正在访问：" + title;
} else if (document.body.classList.contains('category')) {
const category = "<?php echo addslashes(html_entity_decode(get_queried_object()->name)); ?>";
document.querySelector('.bars p').innerText = "正在访问：" + category + " 分类";
} else if (document.body.classList.contains('page')) {
title = "<?php echo addslashes(html_entity_decode(get_the_title())); ?>";
document.querySelector('.bars p').innerText = "正在访问：" + title;
} else {
document.querySelector('.bars p').innerText = "欢迎来到<?php echo get_bloginfo('name'); ?>";
}
}
;
function triggerIsland() {
const island = document.getElementById('dynamicIsland');
if (island) {
island.style.opacity = 1;
island.classList.add('active')
island.classList.remove('inactive');
setTimeout(() => {
closeIsland();
}
, 4000);
}
}
function closeIsland() {
const island = document.getElementById('dynamicIsland')
if (island) {
island.classList.remove('active');
island.classList.add('inactive');
setTimeout(() => {
island.style.opacity = 0;
}
, 600);
}
}
</script>
<?php
}
add_action('wp_footer', 'add_dynamic_island_script');8.子比美化 – 文章卡片下载按钮样式美化
![图片[8]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-8-1024x583.png)
首先一共三步，有两行php代码和一个css代码，话不多说直接开始教程
第一个PHP代码放到子比文件：/wp-content/themes/zibll/inc/functions/zib-posts-list.php的大概268行。
//获取文章列表的底部meta
function zib_get_posts_list_meta($show_author = true, $is_card = false, $post = null)
{在这个代码后边添加
$get_permalink = get_permalink();//添加文章链接第二个php代码放在大概310行，
$html = '<div class="item-meta muted-2-color flex jsb ac">';
$html .= $meta_left;
$html .= $meta_right;
$html .= '</div>';这个代码后添加
$html = '<a class="down" target="_blank" href="' . $get_permalink . '">下载</a>';//添加下载按钮最后CSS代码，直接放到子比主题=>>自定义CSS样式即可！
background: linear-gradient(to right, #4f6dee, #67bdf9);这个是颜色，自己需求改。
/*文章卡片下载按钮*/
a.down {
display: inline-block;
width: 100%;
height: 30px;
line-height: 30px;
border-radius: 15px;
background: linear-gradient(to right, #4f6dee, #67bdf9);
color: #fff;
text-align: center;
cursor: pointer
text-shadow: none;
border: none;
outline: none;
box-shadow: none;
padding: 0;
margin: 0;
}9.子比美化丨好看的评论区美化代码
![图片[9]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-9.png)
代码放置位置：子比主题设置==》全局功能==》自定义css样式
/** 评论框美化 开始**/
body{--acg-color:#fff8fa;--acg-color2:#f8fdff;}.dark-theme{--acg-color:#323335;--acg-color2:#323335;}#postcomments .commentlist .comment{border-top:1px solid rgb(50 50 50 / 0%);border-radius:15px;margin:0 15px 15px;border:1px solid;display:flow-root;background-image:url(https://www.aiik.cn/api/img/pl_blue.png);border-color:#71baff80;background-color:var(--acg-color2);}#postcomments .commentlist .comment+.comment{border-top:1px solid rgb(50 50 50 / 0%);padding:0 0 15px 0;border-radius:15px;margin:0 15px 15px;border:1px solid;display:flow-root;padding:10px;}#postcomments .commentlist .comment+.comment:nth-child(odd){background-image:url(https://www.aiik.cn/api/img/pl_red.png);border-color:#ff8bb5;background-color:var(--acg-color);}#postcomments .commentlist .comment+.comment:nth-child(even){background-image:url(https://www.aiik.cn/api/img/pl_blue.png);border-color:#71baff80;background-color:var(--acg-color2);}#postcomments .children{background:rgb(116 116 116 / 0%);margin-bottom:6px;border-radius:15px;display:flow-root;}#postcomments .children:nth-child(even){background-image:url(https://www.aiik.cn/api/img/pl_blue.png);border-color:#71baff80;}#postcomments .children:nth-child(odd){background-image:url(https://www.aiik.cn/api/img/pl_red.png);border-color:#ff8bb5;background-color:var(--acg-color);}
/** 评论框美化 结束**/10.子比主题丨给文章列表加一个浮动动态效果
将下面代码放到子比主题=>自定义CSS即可，我默认的是白色的，颜色可以调，rgba(255,255,255,0.35)，这是rgb颜色代码，是白色的代码，如果需要其他颜色可以去网上找rgb网站代码然后把下面的里面的数字替换即可！！
/*列表加载<a target="_blank" href="https://vip.lzzcc.cn/tag/%e7%89%b9%e6%95%88" title="View all posts in 特效">特效</a>dahkk.cn*/
.tab-content .posts-item:not(article),.posts-row .posts-item:not(article){transition:all 0.2s}@keyframes index-link-active{0%{transform:perspective(2000px) rotateX(0) rotateY(0) translateZ(0)}16%{transform:perspective(2000px) rotateX(10deg) rotateY(5deg) translateZ(32px)}100%{transform:perspective(2000px) rotateX(0) rotateY(0) translateZ(65px)}}.tab-content .posts-item:not(article):hover,.posts-row .posts-item:not(article):hover{opacity:1;z-index:1;border-radius:20px;box-shadow:0 8px 10px rgba(255,255,255,0.35);animation:index-link-active 1s cubic-bezier(0.315,0.605,0.375,0.925) forwards}11.子比主题头像晃动代码–腾飞https://www.tfbkw.com/73.html
![图片[10]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/O1CN010YDeXw1QbInHWyRVy_2210123621994.gif)
将下面的代码放到：子比主题–>>自定义CSS样式即可！
/*小工具头像晃动 huliku.com*/
.user-avatar .avatar-img, .img-ip:hover, .w-a-info img {
-webkit-animation: swing 3s .4s ease both;
-moz-animation: swing 3s .4s ease both;
}
@-webkit-keyframes swing {
20%, 40%, 60%, 80%, 100% {
-webkit-transform-origin:top center
}
20% {
-webkit-transform:rotate(15deg)
}
40% {
-webkit-transform:rotate(-10deg)
}
60% {
-webkit-transform:rotate(5deg)
}
80% {
-webkit-transform:rotate(-5deg)
}
100% {
-webkit-transform:rotate(0deg)
}
}
@-moz-keyframes swing {
20%, 40%, 60%, 80%, 100% {
-moz-transform-origin:top center
}
20% {
-moz-transform:rotate(15deg)
}
40% {
-moz-transform:rotate(-10deg)
}
60% {
-moz-transform:rotate(5deg)
}
80% {
-moz-transform:rotate(-5deg)
}
100% {
-moz-transform:rotate(0deg)
}
}12.子比主题 – 文章详情页带Tab切换美化——–已移除
![图片[11]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/tengfei_down-1024x434.gif)
一共两个代码，一个是PHP代码，一个是CSS代码，PHP代码里面我已经引入了CSS文件，你可以引入文件也可以放到：子比主题–>>自定义CSS样式即可！
记得关闭：子比主题–>>文章页面–>>作者信息板块，要不然不美观
PHP代码
定位：/wp-content/themes/zibll/inc/functions/zib-single.php文件，我们找到下面的函数，如下图
![图片[12]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/tengfei_down-1.jpg)
然后我们将一整块替换我下面的代码，直接替换我修改过的代码
function zib_single() {
zib_single_header();
do_action('zib_single_before');
wp_enqueue_style('tengfei-single-top-style', '/wp-content/themes/ZibTF/css/tengfei/single_top.css', array(), '1.0.0');
echo '<article class="article main-bg theme-box box-body radius8 main-shadow">';
echo '
<div class="tabs">
<div class="tab active" data-target="#postsposcontent"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 详情</div>
<div class="tab" data-target="#commentscontent"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-comment"></use></svg> 评论</div>
<div class="tab" data-target="#accordionhelpcontent"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-like"></use></svg> 问答</div>
</div>';
echo '<div id="postsposcontent" style="display: block;">';
zib_single_box_header();
zib_single_box_content();
echo '</div>';
echo '<div id="commentscontent" style="display: none;">';
if (_pz('post_authordesc_s') && !is_single()) {
$args = array(
'user_id' => get_the_author_meta('ID'),
'show_button' => false,
'show_img_bg' => false,
'class' => 'author',
);
zib_get_user_card_box($args, true);
}
echo '</div>';
echo '
<div id="accordionhelpcontent" class="tab2_content" style="display: none;">
<div class="wp-block-zibllblock-collapse">';
$faq_list = [
'如何下载资源？' => '您可以通过搜索或浏览分类列表来寻觅您期望下载的资源。随后，点击资源介绍页右侧的下载链接按钮，依据提示信息进行操作即可。',
'是否需要充值才能下载？' => '大部分资源可积分免费下载，部分资源须付费才能下载。',
'下载的资源是否有版权？' => '本网站提供的下载资源均为网络搜集，仅供个人学习和交流使用。对于版权问题，请用户自行判断并承担相应责任。',
];
$i = 1;
foreach ($faq_list as $title => $content) {
echo '<div class="panel" data-theme="panel" data-isshow="true">
<div class="panel-heading collapsed" href="#collapse_'.$i.'" data-toggle="collapse" aria-expanded="false">
<i class="fa fa-plus"></i>
<strong class="biaoti">'.$title.'</strong>
</div>
<div class="collapse" id="collapse_'.$i.'">
<div class="panel-body">
<p>'.$content.'</p>
</div>
</div>
</div>';
$i++;
}
echo '</div></div>';
echo '
<script>
document.addEventListener("DOMContentLoaded", function () {
document.querySelectorAll(".tab").forEach(tab => {
tab.addEventListener("click", function () {
document.querySelectorAll(".tab").forEach(t => t.classList.remove("active"));
document.querySelectorAll("#postsposcontent, #commentscontent, #accordionhelpcontent").forEach(c => c.style.display = "none");
this.classList.add("active");
document.querySelector(this.dataset.target).style.display = "block";
});
});
document.querySelectorAll(".panel-heading").forEach(panel => {
panel.addEventListener("click", function () {
let targetId = panel.getAttribute("href");
let target = document.querySelector(targetId);
if (!target) return;
let icon = panel.querySelector(".fa");
let isCollapsed = target.classList.contains("in");
document.querySelectorAll(".collapse").forEach(c => {
c.classList.remove("in");
c.previousElementSibling.classList.add("collapsed");
c.previousElementSibling.querySelector(".fa").style.transform = "rotate(-45deg)";
});
if (!isCollapsed) {
target.classList.add("in");
panel.classList.remove("collapsed");
icon.style.transform = "rotate(0deg)";
}
});
});
});
</script>';
echo '</article>';
do_action('zib_single_after');
}CSS代码
.panel-heading .fa{transition:transform 0.3s ease;transform:rotate(-45deg);padding:5px;color:#556af1;}.panel-heading:not(.collapsed) .fa{transform:rotate(0deg);}.question-container{border-radius:6px;border:solid 1px var(--main-border-color);overflow:hidden;border-bottom:solid 0px rgba(50,50,50,0);}.question{cursor:pointer;position:relative;margin-bottom:10px;padding:2.5rem 4rem;margin-bottom:0;border-bottom:solid 1px var(--main-border-color);}.question i{position:absolute;right:0;top:50%;transform:translateY(-50%);}.question.active i.fa.fa-plus{display:none;}.question.active i.fa.fa-minus{display:inline-block;}.answer.active{display:unset;background-color:var(--focus-color);flex:1 1 auto;min-height:1px;color:#fff !important;padding:2.5rem 4.5rem;display:block;}@keyframes bounce{0%{transform:scaleY(0.3);background-color:green;}50%{transform:scaleY(1);background-color:orange;}100%{transform:scaleY(0.3);background-color:green;};}.tab2_content.active{display:block;}.tab2_content.active{display:block;}#accordionhelp-content{margin-bottom:20px;}.tab-container{width:80%;margin:auto;}.tabs{display:flex;cursor:pointer;padding:20px 0;}.tab{padding:10px 15px;transition:background-color 0.3s;border-radius:10px;background:var(--muted-bg-color);margin:0px 5px;font-size:14px;}.tab.active{color:#fff;background-color:#556af1;transform:scale(1.05);box-shadow:0 6px 12px rgba(0,0,0,0.3);transition:all 0.3s ease;}.tab-content{position:relative;overflow:hidden;}.tab2_content{display:none;}.button{display:inline-block;padding:10px 20px;font-size:16px;font-weight:bold;text-align:center;text-decoration:none;cursor:pointer;border:none;border-radius:5px;background-color:#556af1;color:#fff;box-shadow:0 4px 8px rgba(0,0,0,0.2);transition:all 0.3s ease;}.button:hover{background-color:#3e53c4;box-shadow:0 6px 12px rgba(0,0,0,0.3);}13.子比主题 – 外链Go页面样式代码
喜欢哪一款直接替换：/wp-content/themes/zibll/go.php这个文件的所有代码即可！
![图片[13]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/tengfei_down-1-1024x631.gif)
<?php
// 安全防护
if (
strlen($_SERVER['REQUEST_URI']) > 384 ||
strpos($_SERVER['REQUEST_URI'], "eval(") ||
strpos($_SERVER['REQUEST_URI'], "base64")
) {
@header("HTTP/1.1 414 Request-URI Too Long");
@header("Status: 414 Request-URI Too Long");
@header("Connection: Close");
@exit;
}
@session_start();
$t_url = '';
if (!empty($_SESSION['GOLINK'])) {
$t_url = $_SESSION['GOLINK'];
} elseif (isset($_GET['url'])) {
$t_url = $_GET['url'];
} elseif (preg_match('/^url=(.*)$/i', $_SERVER["QUERY_STRING"], $m)) {
$t_url = $m[1];
}
if (!empty($t_url)) {
if ($t_url == base64_encode(base64_decode($t_url))) {
$t_url = base64_decode($t_url);
}
$t_url = htmlspecialchars(urldecode($t_url));
preg_match('/^(http|https|thunder|qqdl|ed2k|Flashget|qbrowser):\/\//i', $t_url, $matches);
$wiiui_title = function_exists('get_bloginfo') ? get_bloginfo('name') : '本站';
if ($matches) {
$url = $t_url;
} else {
preg_match('/\./i', $t_url, $matche);
if ($matche) {
$url = 'http://' . $t_url;
} else {
$url = 'http://' . $_SERVER['HTTP_HOST'];
}
}
} else {
$wiiui_title = function_exists('get_bloginfo') ? get_bloginfo('name') : '本站';
$url = 'http://' . $_SERVER['HTTP_HOST'];
}
$url = str_replace('&', '&', $url);
$site_url = (isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] == 'on' ? 'https://' : 'http://') . $_SERVER['HTTP_HOST'];
?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>安全跳转 - <?php echo $wiiui_title; ?></title>
<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.5.2/css/all.min.css">
<style>
body {
width: 100%;
height: 100vh;
background: linear-gradient(135deg, #0f0c29, #302b63, #24243e);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
overflow: hidden;
margin: 0;
}
.main {
width: 100vw;
min-height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 20px;
z-index: 10;
position: relative;
}
.card {
background: rgba(255,255,255,0.05);
backdrop-filter: blur(10px);
border-radius: 20px;
border: 1px solid rgba(255,255,255,0.1);
padding: 30px;
max-width: 500px;
width: 100%;
text-align: center;
box-shadow: 0 15px 35px rgba(0,0,0,0.2);
margin-bottom: 30px;
position: relative;
z-index: 2;
}
.card h2 {
color: #fff;
margin-bottom: 25px;
font-weight: 600;
font-size: 28px;
text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
}
.loader-container {
position: relative;
margin: 30px 0;
}
.circle {
display: flex;
justify-content: center;
align-items: center;
width: 200px;
height: 200px;
margin: 0 auto;
background-image: linear-gradient(0deg,
rgb(47,102,255),
rgb(153,64,255) 30%,
rgb(238,55,255) 60%,
rgb(255,0,76) 100%);
border-radius: 50%;
animation: rotate 1.5s linear infinite;
box-shadow: 0 0 50px rgba(153,64,255,0.5);
position: relative;
}
.circle::before {
content: "";
position: absolute;
width: 200px;
height: 200px;
left: 0;
top: 0;
background-image: linear-gradient(0deg,
rgb(47,102,255),
rgb(153,64,255) 30%,
rgb(238,55,255) 60%,
rgb(255,0,76) 100%);
border-radius: 50%;
filter: blur(35px);
opacity: 0.7;
z-index: 1;
}
.circle::after {
content: "";
position: absolute;
left: 25px; top: 25px;
width: 150px;
height: 150px;
background: rgba(15,12,41,0.82);
border-radius: 50%;
z-index: 2;
}
.countdown {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
color: #fff;
font-size: 42px;
font-weight: 700;
z-index: 5;
text-shadow: 0 0 10px rgba(255,255,255,0.5);
}
.info-box {
background: rgba(0,0,0,0.2);
border-radius: 12px;
padding: 15px;
margin: 20px 0 10px 0;
}
.info-box p {
color: #fff;
margin: 8px 0;
font-size: 16px;
}
.info-box .url {
color: #6cff6c;
font-weight: 500;
word-break: break-all;
font-size: 14px;
}
.security-info {
display: flex;
justify-content: center;
align-items: center;
margin-top: 20px;
color: #ffc107;
}
.security-info i {
margin-right: 10px;
font-size: 20px;
}
.tips {
color: rgba(255,255,255,0.85);
font-size: 14px;
margin-top: 10px;
line-height: 1.6;
}
.btn-cancel {
background: rgba(255,255,255,0.1);
border: 1px solid rgba(255,255,255,0.2);
color: #fff;
padding: 10px 25px;
border-radius: 50px;
font-weight: 500;
margin-top: 24px;
transition: all 0.3s ease;
cursor: pointer;
outline: none;
border: none;
font-size: 16px;
position: relative;
z-index: 9; /* 保证按钮在最上层 */
}
.btn-cancel:hover, .btn-cancel:focus {
background: rgba(255,255,255,0.2);
transform: translateY(-2px);
}
.footer {
color: rgba(255,255,255,0.6);
text-align: center;
font-size: 14px;
margin-top: 12px;
z-index:2;
position: relative;
}
@keyframes rotate {
0% { transform: rotate(0deg);}
100% { transform: rotate(360deg);}
}
.particles {position: absolute;top:0;left:0;width:100vw;height:100vh;z-index:1;}
.particle {position:absolute;border-radius:50%;background:rgba(255,255,255,0.07);}
@media (max-width: 576px) {
.card {padding: 15px;}
.circle {width: 120px;height: 120px;}
.circle::before {width: 120px;height: 120px;}
.circle::after {width: 85px;height: 85px;left: 17.5px;top: 17.5px;}
.countdown {font-size: 28px;}
}
</style>
</head>
<body>
<div class="particles" id="particles"></div>
<div class="main">
<div class="card">
<h2><i class="fas fa-shield-alt"></i> 安全跳转页面</h2>
<div class="loader-container" style="height:220px;">
<div class="circle"></div>
<div class="countdown" id="second">3s</div>
</div>
<div class="info-box">
<p><i class="fas fa-exclamation-triangle"></i> 网络交易需谨慎，正在跳转到目标网址</p>
<p>目标网址：<span class="url" id="targetUrl"><?php echo $url;?></span></p>
</div>
<div class="security-info">
<i class="fas fa-lock"></i>
<span>安全检测通过，此跳转经过安全验证</span>
</div>
<p class="tips">
请注意：该跳转由第三方网站提供，请仔细核对网址，确保访问的是您信任的网站。
如有疑问，请勿继续访问。
</p>
<button type="button" class="btn-cancel" id="cancelBtn">
<i class="fas fa-ban"></i> 取消跳转
</button>
</div>
<div class="footer">
<p>安全跳转系统 © <?php echo date('Y');?> | 保护您的网络安全</p>
</div>
</div>
<script>
// 粒子背景
(function () {
const container = document.getElementById('particles');
for(let i=0;i<44;i++){
let p = document.createElement('div');
p.classList.add('particle');
let size = Math.random()*5+2;
let posX = Math.random()*100,posY=Math.random()*100;
p.style.width = size+"px";p.style.height = size+"px";
p.style.left = posX+"vw";p.style.top = posY+"vh";
let duration = Math.random()*20+10;
p.style.animation = `float ${duration}s linear infinite`;
container.appendChild(p);
}
})();
// 跳转与按钮
var timeNum = 3, timer = null, jumped = false;
var turl = <?php echo json_encode($url); ?>;
document.addEventListener("DOMContentLoaded", function(){
// 确保按钮层级最高
var btn = document.getElementById('cancelBtn');
btn.style.position = 'relative';
btn.style.zIndex = 99;
// 倒计时逻辑
var sec = document.getElementById("second");
var i = timeNum;
sec.innerHTML = i + "s";
timer = setInterval(function(){
--i;
sec.innerHTML = i + "s";
if(i <= 0){
clearInterval(timer);
if(jumped)return;
jumped = true;
window.location.href = turl;
}
},1000);
// 绑定取消按钮
btn.addEventListener('click', function(e){
e.preventDefault();
if(jumped)return;
jumped = true;
clearInterval(timer);
sec.innerHTML = "已取消";
setTimeout(function () {
var ref = document.referrer, cur = location.href;
var site_url = <?php echo json_encode($site_url); ?>;
if(ref && ref !== cur && (ref.indexOf(location.host)!==-1 || ref.indexOf("http")===0)){
window.location.href = ref;
} else if(window.history.length > 1){
window.history.back();
} else if(window.opener){
window.close();
} else {
window.location.href = site_url;
}
}, 420);
}, false);
// 补充目标url显示
document.getElementById('targetUrl').textContent = turl;
});
</script>
</body>
</html>14.子比主题美化 – 新发布文章列表角标（NEW） 已剔除
![图片[14]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-10.png)
在主题目录 func.php 文件添加如下代码。
（func.php = functions.php）看过狐狸以前的文章应该都懂，以后就不解释了。
文件路径：/www/wwwroot/baicaima.com/wp-content/themes/zibll/functions.php
/*新文章发布角标 */
function add_zbfox_new_post_label($title, $id) {
if (!is_admin() && !is_single()) {
$post_time = get_the_time('U', $id);
if (time() - $post_time <= 24 * 60 * 60) {
$title .= ' <div class="zbfox_new_post_label">NEW</div>';
}
}
return $title;
}
add_filter('the_title', 'add_zbfox_new_post_label', 10, 2);最新版CSS代码添加到子比主题后台设置->自定义代码->自定义CSS样式
/*新文章发布图标样式 */
.posts-item{
position: relative;
overflow: visible;
}
.zbfox_new_post_label{
position: absolute;
top: 15px;
right: 0;
padding: 5px 10px;
background: #4f15ff;
box-shadow: -1px 2px 4px rgba(0, 0, 0, 0.5);
/*url: huliku.com*/
color: #fff;
font-size: 13px;
font-weight: 900;
border-radius: 5px 0 0 5px;
}
.posts-item:hover .zbfox_new_post_label {
opacity: 0;
transition: opacity 0.5s ease;
}
.zbfox_new_post_label:before {
position: absolute;
content: " ";
display: block;
width: 7px;
height: 110%;
padding: 0 0 7px;
top: 0;
right: -7px;
background: inherit;
border-radius: 0 5px 5px 0;
}
.zbfox_new_post_label:after {
position: absolute;
content: " ";
display: block;
width: 5px;
height: 5px;
background: rgba(0, 0, 0, 0.35);
bottom: -3px;
right: -5px;
border-radius: 0 5px 5px 0;
}15.子比美化 – 自定义右键菜单
![图片[15]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-11.png)
将下面的代码放到：子比主题–>>自定义底部HTML代码即可，或者也可以放到footer.php文件里面也可以！
记得修改一下里面的网站地址，要不然用的话都是本站的地址！
我选择的是网站自定义底部，不用去到服务器修改，后台选择即可
<!-- 右键美化 -->
<style type="text/css">
a {text-decoration: none;}
div.usercm{background-repeat:no-repeat;background-position:center center;background-size:cover;background-color:#fff;font-size:13px!important;width:130px;-moz-box-shadow:1px 1px 3px rgba
(0,0,0,.3);box-shadow:0px 0px 15px #333;position:absolute;display:none;z-index:10000;opacity:0.9; border-radius: 8px;}
div.usercm ul{list-style-type:none;list-style-position:outside;margin:0px;padding:0px;display:block}
div.usercm ul li{margin:0px;padding:0px;line-height:35px;}
div.usercm ul li a{color:#666;padding:0 15px;display:block}
div.usercm ul li a:hover{color:#fff;background:rgba(170,222,18,0.88)}
div.usercm ul li a i{margin-right:10px}
a.disabled{color:#c8c8c8!important;cursor:not-allowed}
a.disabled:hover{background-color:rgba(255,11,11,0)!important}
div.usercm{background:#fff !important;}
</style>
<div class="usercm" style="left: 199px; top: 5px; display: none;">
<ul>
<li><a href="javascript:void(0);" rel="external nofollow" rel="external nofollow" onclick="getSelect();"><i class="fa fa-copy fa-fw"></i><span>复制</span></a></li>
<li><a href="javascript:window.location.reload();" rel="external nofollow" ><i class="fa fa-refresh fa-fw"></i><span>刷新</span></a></li>
<li><a href="/" rel="external nofollow" ><i class="fa fa-home fa-fw"></i><span>首页</span></a></li>
<li><a href="javascript:history.go(1);" rel="external nofollow" ><i class="fa fa-arrow-right fa-fw"></i><span>前进</span></a></li>
<li><a href="javascript:history.go(-1);" rel="external nofollow" ><i class="fa fa-arrow-left fa-fw"></i><span>后退</span></a></li>
<li><a href="/%e5%8f%8b%e6%83%85%e9%93%be%e6%8e%a5/"><i class="fa fa-copyright"></i><span>友情链接</span></a></li>
<li><a href="/wp-sitemap.xml"><i class="fa fa-copyright"></i><span>网站地图</span></a></li>
</ul>
</div>
<script type="text/javascript">
(function(a) {
a.extend({
mouseMoveShow: function(b) {
var d = 0,
c = 0,
h = 0,
k = 0,
e = 0,
f = 0;
a(window).mousemove(function(g) {
d = a(window).width();
c = a(window).height();
h = g.clientX;
k = g.clientY;
e = g.pageX;
f = g.pageY;
h + a(b).width() >= d && (e = e - a(b).width() - 5);
k + a(b).height() >= c && (f = f - a(b).height() - 5);
a("html").on({
contextmenu: function(c) {
3 == c.which && a(b).css({
left: e,
top: f
}).show()
},
click: function() {
a(b).hide()
}
})
})
},
disabledContextMenu: function() {
window.oncontextmenu = function() {
return !1
}
}
})
})(jQuery);
function getSelect() {
"" == (window.getSelection ? window.getSelection() : document.selection.createRange().text) ? layer.msg("请选择需要百度的内容！") : document.execCommand("Copy")
}
function baiduSearch() {
var a = window.getSelection ? window.getSelection() : document.selection.createRange().text;
"" == a ? layer.msg("请选择需要搜索的内容！") : window.open("https://daixm.daixb.top/?s=" + a)
}
$(function() {
for (var a = navigator.userAgent, b = "Android;iPhone;SymbianOS;Windows Phone;iPad;iPod".split(";"), d = !0, c = 0; c < b.length; c++) if (0 < a.indexOf(b[c])) {
d = !1;
break
}
d && ($.mouseMoveShow(".usercm"), $.disabledContextMenu())
});
</script>
<!-- 右键结束 -->16.子比美化 – 用户中心头像圆形美化
![图片[16]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-12.png)
将下面代码复制，放在子比设置后台的自定义CSS
/*用户中心头像圆形开始*/
.author-header .avatar-img {
--this-size: 95px;
}
.author-header .avatar-img .avatar {
border-radius: 50px;
}
.item-meta .avatar-mini {
transform: translateY(-6px);
right: -3px;
}
.forum-posts {
--this-padding: 15px 20px;
padding: var(--this-padding);
display: flex;
transition: .3s;
position: relative;
margin-left: 6px;
}
.user-info {
margin-left: 10px;
}
/*用户中心头像圆形结尾*/17.子比美化-分页按钮美化
![图片[17]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-13.png)
把下面代码放到后台自定义CSS
/*页码样式微调*/
.pagenav .current, .pagenav .page-numbers, .pagenav a {
border: 0;
padding: 8px 14px;
background: linear-gradient(148deg, hsla(0, 0%, 100%, 0), var(--main-bg-color));
-webkit-box-shadow: 0 0 8px 0 rgba(95, 95, 95, .15);
box-shadow: 0 0 8px 0 rgba(95, 95, 95, .15);
border-radius: 6px;
}18.子比美化-图片圆角展示
![图片[18]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-14.png)
下面的图片是圆角，代码很简单，直接将代码放到后台-自定义代码-自定义CSS即可
最后面13px是圆角的大小，可根据自己喜欢设置大小
.wp-posts-content img {border-radius: 13px};19.页脚
![图片[19]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-15-1024x247.png)
将一下代买替换footeh
将一下css放到/wp-content/themes/zibll/css
将一下图片文件放在你自定义的文件夹修改一下里面的路径即可
页脚
提取码:9k9y
//获取评论数量
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="/wp-content/themes/zibll/jstop/sweetalert.min.js"></script>';
echo '<script src="/wp-content/themes/zibll/csstop/sweetalert.css"></script>';
echo '<script>$(document).on("click","#dorzs",function(){swal({title:"发工资啦",text:"哇！懒人超级开心的！！",icon:"/wp-content/themes/zibll/tp/涨工资.jpg",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:"
图片链接"});}else if(value=="zfb"){swal({title:"感谢打赏！",text:"感谢您的支付宝打赏，我会努力做得更好！",button:false,icon:"图片链接"});}else if(value=="dsmd"){swal({title:"打赏名单",text:"【打赏名单暂未开放】",icon:"图片链接",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;
}将以上代码放入function 或者func文件即可
20.文章顶部信息
![图片[20]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-17-1024x251.png)
将下面插件安装在后台即可
提取码:9k9y
21.给网站顶端加一个
![图片[21]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-18-1024x261.png)
放进去function 或者func
<?php
// 注册小工具
Zib_CFSwidget::create('custom_homepage_widget', [
'title' => ' A首页推荐卡片',
'zib_show' => true,
'description' => '滚动图标推荐卡片，包括标题、分类按钮和关于我。',
'callback' => 'custom_homepage_widget',
'fields' => [
['id' => 'title_line1', 'type' => 'text', 'title' => '标题第一行'],
['id' => 'title_line2', 'type' => 'text', 'title' => '标题第二行'],
['id' => 'subtitle', 'type' => 'text', 'title' => '副标题', 'default' => 'WWW.DAIXB.TOP'],
['id' => 'category_text_1', 'type' => 'text', 'title' => '第一个样式按钮文本'],
['id' => 'category_id_1', 'type' => 'number', 'title' => '第一个样式分类ID', 'default' => 0],
['id' => 'category_text_2', 'type' => 'text', 'title' => '第二个样式按钮文本'],
['id' => 'category_id_2', 'type' => 'number', 'title' => '第二个样式分类ID', 'default' => 0],
['id' => 'category_text_3', 'type' => 'text', 'title' => '第三个样式按钮文本'],
['id' => 'category_id_3', 'type' => 'number', 'title' => '第三个样式分类ID', 'default' => 0],
[
'id' => 'about_items',
'type' => 'group',
'title' => '关于我卡片列表',
'button' => '添加一个关于我条目',
'repeatable' => true,
'fields' => [
['id' => 'title', 'type' => 'text', 'title' => '标题'],
['id' => 'image', 'type' => 'upload', 'title' => '图片', 'preview' => true],
['id' => 'link', 'type' => 'text', 'title' => '按钮链接'],
]
],
// 三个单独字段，id唯一
['id' => 'extra_input_1', 'type' => 'text', 'title' => '左下角文字'],
['id' => 'extra_input_2', 'type' => 'text', 'title' => '按钮名字'],
['id' => 'extra_input_3', 'type' => 'text', 'title' => '按钮跳转'],
]
]);
// ✅ 添加这个回调函数到 functions.php 或当前主题文件
function custom_homepage_widget($args, $instance) {
// echo $args['before_widget'];
?>
<div class="content-wrap">
<div class="content-layout">
<div class="content-layout">
<div id="home_top">
<div class="recent-top-post-group" id="recent-top-post-group">
<div class="recent-post-top" id="recent-post-top">
<div id="bannerGroup">
<div id="banners">
<div class="banners-title">
<div class="banners-title-big"><?php echo esc_html($instance['title_line1']); ?></div>
<div class="banners-title-big"><?php echo esc_html($instance['title_line2']); ?></div>
<div class="banners-title-small"><?php echo esc_html($instance['subtitle']); ?></div>
</div>
<div class="tags-group-all">
<div class="tags-group-wrapper">
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#989bf8"><img title="AfterEffects"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/20239df3f66615b532ce571eac6d14ff21cf072602.png!cover"></div>
<div class="tags-group-icon" style="background:#fff"><img
src="https://p.zhheo.com/2023e0ded7b724a39f12d59c3dc8fbdc7cbe074202.png!cover" title="Sketch"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png"">
</div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#57b6e6"><img title="Docker"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/20231108a540b2862d26f8850172e4ea58ed075102.png!cover"></div>
<div class="tags-group-icon" style="background:#4082c3"><img
src="https://p.zhheo.com/2023e4058a91608ea41751c4f102b131f267075902.png!cover"
title="Photoshop"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png"">
</div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#fff"><img
src="https://p.zhheo.com/20233e777652412247dd57fd9b48cf997c01070702.png!cover"
title="FinalCutPro"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
data-ll-status="loading"></div>
<div class="tags-group-icon" style="background:#fff"><img
src="https://p.zhheo.com/20235c0731cd4c0c95fc136a8db961fdf963071502.png!cover" title="Python"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png"">
</div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#eb6840"><img title="Swift"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
src="https://p.zhheo.com/202328bbee0b314297917b327df4a704db5c072402.png!cover"
data-ll-status="loading"></div>
<div class="tags-group-icon" style="background:#8f55ba"><img title="Principle"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/2023f76570d2770c8e84801f7e107cd911b5073202.png!cover"></div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#f29e39"><img title="illustrator"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
src="https://p.zhheo.com/20237359d71b45ab77829cee5972e36f8c30073902.png!cover"
data-ll-status="loading"></div>
<div class="tags-group-icon" style="background:#2c51db"><img
src="https://p.zhheo.com/20237c548846044a20dad68a13c0f0e1502f074602.png!cover" title="CSS3"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
data-ll-status="loading"></div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#f7cb4f"><img title="JS"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
src="https://cloud-image-host.oss-cn-beijing.aliyuncs.com/img/banners/git.webp"
data-ll-status="loading"></div>
<div class="tags-group-icon" style="background:#e9572b"><img title="HTML"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
src="https://p.zhheo.com/202372b4d760fd8a497d442140c295655426070302.png!cover"
data-ll-status="loading"></div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#df5b40"><img title="Git"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
src="https://p.zhheo.com/2023ffa5707c4e25b6beb3e6a3d286ede4c6071102.png!cover"
data-ll-status="loading"></div>
<div class="tags-group-icon" style="background:#1f1f1f"><img title="Rhino"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
src="https://p.zhheo.com/20231ca53fa0b09a3ff1df89acd7515e9516173302.png!cover"
data-ll-status="loading"></div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#989bf8"><img title="AfterEffects"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/20239df3f66615b532ce571eac6d14ff21cf072602.png!cover"></div>
<div class="tags-group-icon" style="background:#fff"><img title="Sketch"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/2023e0ded7b724a39f12d59c3dc8fbdc7cbe074202.png!cover"></div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#57b6e6"><img title="Docker"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/20231108a540b2862d26f8850172e4ea58ed075102.png!cover"></div>
<div class="tags-group-icon" style="background:#4082c3"><img title="Photoshop"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/2023e4058a91608ea41751c4f102b131f267075902.png!cover"></div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#fff"><img title="FinalCutPro"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/20233e777652412247dd57fd9b48cf997c01070702.png!cover"></div>
<div class="tags-group-icon" style="background:#fff"><img title="Python"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/20235c0731cd4c0c95fc136a8db961fdf963071502.png!cover"></div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#eb6840"><img title="Swift"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/202328bbee0b314297917b327df4a704db5c072402.png!cover"></div>
<div class="tags-group-icon" style="background:#8f55ba"><img title="Principle"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/2023f76570d2770c8e84801f7e107cd911b5073202.png!cover"></div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#f29e39"><img title="illustrator"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/20237359d71b45ab77829cee5972e36f8c30073902.png!cover"></div>
<div class="tags-group-icon" style="background:#2c51db"><img title="CSS3"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png""
class="entered exited"
src="https://p.zhheo.com/20237c548846044a20dad68a13c0f0e1502f074602.png!cover"></div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#f7cb4f"><img
src="https://p.zhheo.com/2023786e7fc488f453d5fb2be760c96185c0075502.png!cover" title="JS"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png"">
</div>
<div class="tags-group-icon" style="background:#e9572b"><img
src="https://p.zhheo.com/202372b4d760fd8a497d442140c295655426070302.png!cover" title="HTML"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png"">
</div>
</div>
<div class="tags-group-icon-pair">
<div class="tags-group-icon" style="background:#df5b40"><img
src="https://p.zhheo.com/2023ffa5707c4e25b6beb3e6a3d286ede4c6071102.png!cover" title="Git"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png"">
</div>
<div class="tags-group-icon" style="background:#1f1f1f"><img
src="https://cloud-image-host.oss-cn-beijing.aliyuncs.com/img/banners/Java.webp" title="Rhino"
onerror="this.onerror=null,this.src="https://bu.dusays.com/2023/03/03/6401a79030db5.png"">
</div>
</div>
</div>
</div> <a id="banner-hover" href="https://www.mnsin.com/go?random" rel="external nofollow"> <i
class="heofont icon-right"></i> <span class="bannerText">随便逛逛<svg class="icon" aria-hidden="true"><use xlink:href="#icon-jiantou"></use></svg></span> </a>
</div>
<div class="categoryGroup">
<?php
// 获取所有分类链接（只查一次）
$all_categories = get_categories(array(
'hide_empty' => true,
));
$category_links = array_map(function($cat) {
return get_category_link($cat->term_id);
}, $all_categories);
$classes = ['wniui_one', 'wniui_two', 'wniui_three'];
$icons = ['icon-star-smile-fill', 'icon-fire-fill', 'icon-book-mark-fill'];
for ($i = 1; $i <= 3; $i++) {
$category_text = !empty($instance['category_text_' . $i]) ? trim($instance['category_text_' . $i]) : '';
$category_id = !empty($instance['category_id_' . $i]) ? absint($instance['category_id_' . $i]) : 0;
// 获取链接逻辑：指定 ID 优先，否则随机选一个
if ($category_id) {
$link = get_category_link($category_id);
} elseif (!empty($category_links)) {
$random_key = array_rand($category_links);
$link = $category_links[$random_key];
} else {
$link = '#'; // 没有分类也兜底
}
// 赋值 class 和 icon
$class = $classes[$i - 1];
$icon = $icons[$i - 1];
?>
<div class="categoryItem">
<a class="categoryButton <?php echo esc_attr($class); ?>" href="<?php echo esc_url($link); ?>" rel="external nofollow">
<span class="categoryButtonText"><?php echo esc_html($category_text ?: '分类按钮' . $i); ?></span>
<i class="heofont <?php echo esc_attr($icon); ?>"></i>
</a>
</div>
<?php
}
?>
</div>
</div>
<?php
$about_items = isset($instance['about_items']) ? $instance['about_items'] : [];
$extra_input_1 = isset($instance['extra_input_1']) ? $instance['extra_input_1'] : '';
$extra_input_2 = isset($instance['extra_input_2']) ? $instance['extra_input_2'] : '';
$extra_input_3 = isset($instance['extra_input_3']) ? $instance['extra_input_3'] : '';
?>
<?php if (!empty($about_items)) : ?>
<div class="topGroup">
<div class="todayCard" id="todayCard" style="z-index: 1;" data-autoplay-delay="4000">
<div class="todayCard-info">
<div class="todayCard-tips"><?php echo esc_html($extra_input_1); ?></div> <!-- 左下角文字 -->
<div class="todayCard-title"></div>
</div>
<div class="todayCard-cover-slides" style="position: relative; overflow: hidden;">
<div class="todayCard-slides-wrapper">
<?php foreach ($about_items as $item) :
$img = esc_url($item['image']);
$link = esc_url($item['link']);
?>
<a href="<?php echo $link; ?>" target="_blank" class="todayCard-slide-item"
style="background-image: url('<?php echo $img; ?>');">
<span class="slide-link-area"></span>
</a>
<?php endforeach; ?>
</div>
<div class="todayCard-indicators">
<?php foreach ($about_items as $index => $item) : ?>
<span class="indicator-dot <?php echo $index === 0 ? 'active' : ''; ?>" data-idx="<?php echo $index; ?>"></span>
<?php endforeach; ?>
</div>
</div>
<div class="banner-button-group">
<a class="banner-button" href="<?php echo esc_url($extra_input_3); ?>" rel="external nofollow">
<span class="banner-button-text"><?php echo esc_html($extra_input_2); ?></span> <!-- 按钮名字 -->
</a>
</div>
<!-- 左右箭头 SVG ... （保持原样） -->
<span class="todayCard-arrow todayCard-arrow-left">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="15 18 9 12 15 6"></polyline>
</svg>
</span>
<span class="todayCard-arrow todayCard-arrow-right">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="9 18 15 12 9 6"></polyline>
</svg>
</span>
</div>
</div>
<?php endif; ?>
</div>
</div>
</div>
</div>
<style>
@font-face {
font-family: 'iconfont'; /* Project id 4947646 */
src: url('//at.alicdn.com/t/c/font_4947646_wmdj39jlurm.woff2?t=1749717765959') format('woff2'),
url('//at.alicdn.com/t/c/font_4947646_wmdj39jlurm.woff?t=1749717765959') format('woff'),
url('//at.alicdn.com/t/c/font_4947646_wmdj39jlurm.ttf?t=1749717765959') format('truetype');
}
.heoblogIcon {
font-family: "heoblogIcon" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.zib-widget.widget_ziy51_banner_widget {
padding: 0!important;
border: none!important;
background: transparent!important;
box-shadow: none!important;
margin-bottom: 20px!important
}
#home_top {
max-width: 1400px;
margin: auto;
margin-top: .5rem;
padding: 0 .5rem;
width: 100%;
background: transparent!important
}
@media screen and (max-width: 768px) {
#home_top {
padding:0;
margin-top: 0
}
}
.recent-top-post-group {
border-radius: 12px;
overflow: hidden;
overflow-x: auto;
width: 100%;
margin-bottom: 0
}
.recent-post-top {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
width: 100%;
overflow-x: scroll
}
.recent-post-top::-webkit-scrollbar {
display: none
}
.recent-post-top .recent-post-item {
display: flex;
width: 200px;
flex-direction: column;
align-items: flex-start;
margin-left: .5rem;
background: #fff;
border-radius: 12px;
overflow: hidden;
min-width: 200px;
height: 164px;
max-height: 164px;
border: var(--style-border-always);
transition: .3s;
position: relative;
box-shadow: var(--heo-shadow-border)
}
@media screen and (max-width: 768px) {
.recent-post-top .recent-post-item {
border-radius:8px;
box-shadow: none;
clip-path: inset(0 0 0 0 round 8px)
}
.recent-post-top .recent-post-item:last-child {
margin-right: 1rem
}
}
@media screen and (min-width: 1200px) {
.recent-post-top .recent-post-item {
margin-right:0;
margin-bottom: .5rem
}
.recent-post-top .recent-post-item:active {
transform: scale(.97)
}
.recent-post-top {
overflow-x: visible
}
.recent-top-post-group {
overflow: visible;
overflow-x: visible
}
}
span.recent-post-top-text {
position: absolute;
top: 0;
left: -40px;
display: flex;
z-index: 1;
background: #425aef;
color: #fff;
padding: 2px 8px;
font-size: .6rem;
border-radius: 12px 0;
transition: .3s;
cursor: pointer
}
.recent-post-item:hover .recent-post-top-text {
left: 0
}
@media screen and (max-width: 1200px) {
#home_top {
display:none
}
}
@media screen and (min-width: 1200px) {
.recent-post-top .recent-post-item:hover {
border:var(--style-border-hover);
box-shadow: var(--bywind-shadow-main);
transform: scale(1.03)
}
.recent-post-top .recent-post-item:active {
transform: scale(.97)
}
}
@media screen and (max-width: 768px) {
.recent-top-post-group {
border-radius:0;
background: var(--bywind-background)
}
.recent-post-top-text {
display: none!important
}
.recent-post-top .recent-post-item .post_cover img {
border-radius: 8px 8px 0 0!important
}
}
.recent-post-top .recent-post-item .post_cover a {
height: 100px;
overflow: hidden;
display: flex
}
.recent-post-top .recent-post-item .post_cover img {
object-fit: cover;
width: 100%;
background: var(--bywind-secondbg);
border-radius: 12px 12px 0 0
}
.recent-post-top .recent-post-item:hover .post_cover img {
transform: scale(1)
}
.recent-post-top .recent-post-item .recent-post-info {
padding: .3rem .5rem .3rem .5rem!important;
transition: .3s
}
.recent-post-top .recent-post-item:hover .recent-post-info a {
color: var(--bywind-fontcolor)
}
@media screen and (max-width: 1200px) {
.recent-post-top .recent-post-item:hover .recent-post-info a {
transition:.3s
}
}
.recent-post-top .recent-post-item .recent-post-info .article-title {
-webkit-line-clamp: 2;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
line-height: 1.5;
justify-content: center;
align-items: flex-end;
align-content: center;
padding-top: .5rem;
font-weight: 700;
font-size: .8rem!important;
padding: 0!important
}
.categoryItem {
overflow: hidden;
transform: scale(1);
transition: all .8s cubic-bezier(.65,.15,.37,1.19);
height: 48%;
border-radius: 12px
}
a.categoryButton {
height: 100%;
width: 100%;
background: rgba(255,255,255,.67);
border-radius: 12px;
display: inline-block;
text-align: left;
line-height: 4em;
font-weight: 800;
font-size: 16px;
color: #fff;
transition: all .8s cubic-bezier(.39,.575,.565,1);
transform: scale(1);
overflow: hidden
}
a.categoryButton i {
transform: scale(1) rotate(15deg)
}
@media screen and (min-width: 1200px) {
a.categoryButton:active {
transform:scale(.97)
}
}
@media screen and (max-width: 768px) {
a.categoryButton {
border-radius:8px
}
.categoryItem {
border-radius: 0;
height: 47%;
box-shadow: none!important
}
}
a.categoryButton:after {
top: 45px;
width: 1rem;
left: 21px;
height: 2px;
background: #fff;
content: "";
border-radius: 1px;
position: absolute
}
.categoryButtonText {
padding-left: 21px
}
a.categoryButton i {
font-size: 12rem;
opacity: .3;
position: absolute;
right: 15px;
top: 10%;
transition: .3s;
width: 100px;
text-align: center;
filter: blur(2px)
}
@media screen and (max-width: 768px) {
a.categoryButton i {
display:none
}
.recent-post-top .categoryGroup {
min-width: 130px!important;
margin-bottom: .5rem;
margin-left: 1rem;
max-height: 164px;
overflow: hidden;
position: relative
}
}
.topGroup {
display: flex
}
#bannerGroup {
display: flex
}
div#banners {
display: none
}
.topGroup .todayCard {
display: none
}
@media screen and (min-width: 1200px) {
.topGroup {
/* display:flex; */flex-direction:row;
flex-wrap: wrap;
justify-content: flex-end;
height: calc(328px + .5rem);
align-content: space-between;
width: calc(600px + 1.5rem);
position: relative
}
div#bannerGroup {
width: calc(100% - 600px - 2rem);
margin-right: .5rem;
height: calc(328px + .5rem);
display: flex;
flex-direction: column;
justify-content: space-between
}
div#banners {
display: flex;
width: 100%;
height: 76%;
background: var(--bywind-card-bg);
margin-bottom: .5rem;
border: var(--style-border);
border-radius: 12px;
overflow: hidden;
position: relative;
box-shadow: var(--bywind-shadow-border);
flex-direction: column;
transition: .3s;
clip-path: inset(0 0 0 0 round 12px)
}
div#banners:hover {
box-shadow: var(--bywind-shadow-main)
}
#banners.flink {
margin-bottom: .5rem
}
#banners .banner-button-group {
position: absolute;
right: 2rem;
top: 2rem;
display: flex
}
#banners .banner-button {
padding: 8px 12px;
background: var(--bywind-fontcolor);
border-radius: 12px;
color: var(--bywind-card-bg);
display: flex;
align-items: center;
z-index: 1;
transition: .3s;
cursor: pointer;
box-shadow: var(--bywind-shadow-black)
}
#banners .banner-button.secondary {
background: var(--bywind-secondbg);
border: var(--style-border-always);
color: var(--bywind-lighttext);
margin-right: 1rem;
box-shadow: var(--bywind-shadow-border)
}
.banner-button:hover {
background: #425aef
}
#banners .banner-button i {
margin-right: 8px;
font-size: 1rem
}
.banners-title {
top: 2rem;
left: 1.5rem;
position: absolute;
display: flex;
flex-direction: column
}
.banners-title-big {
font-size: 36px;
line-height: 1;
font-weight: 700;
margin-bottom: 8px
}
.banners-title-small {
font-size: 12px;
line-height: 1;
color: var(--bywind-secondtext);
margin-top: 8px;
margin-bottom: .5rem
}
#banner-hover {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
backdrop-filter: blur(15px)!important;
padding-left: .5rem;
display: flex;
flex-direction: column;
justify-content: center;
opacity: 0;
transition: cubic-bezier(.71,.15,.16,1.15) .6s
}
.bannerText {
color: #fff;
font-size: 4rem;
line-height: 4rem;
font-weight: 700;
margin-top: 20px
}
#banner-hover .icon-right:before {
font-family: 'iconfont'!important;
content: '\e6c1' !important;
color: #fff
}
.banner-righticon {
font-size: 4rem;
opacity: .6
}
#banners:hover #banner-hover {
opacity: 1;
padding-left: 2rem;
background: #4259efc9;
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
-webkit-backface-visibility: hidden;
-webkit-transform-style: preserve-3d;
transition: .3s;
background-size: 200%;
cursor: pointer
}
#banners #banner-hover i {
font-size: 80px;
opacity: .4
}
.topGroup .todayCard {
position: absolute;
width: calc(600px + 1rem);
height: 100%;
z-index: 1;
top: 0;
left: 0;
background: var(--bywind-card-bg);
border-radius: 12px;
margin-left: .5rem;
overflow: hidden;
transition: .3s;
display: flex;
cursor: pointer;
pointer-events: all
}
.topGroup .todayCard:after {
position: absolute;
content: '';
width: 100%;
height: 100%;
top: 0;
left: 0
}
.topGroup .todayCard.hide {
opacity: 0;
pointer-events: none
}
.topGroup .todayCard .todayCard-info {
position: absolute;
bottom: 2rem;
left: 2rem;
z-index: 2;
max-width: 60%;
transition: .3s
}
.topGroup .todayCard.hide .todayCard-info {
bottom: 1rem;
opacity: 0
}
.topGroup .todayCard .todayCard-info .todayCard-tips {
opacity: .8;
font-size: 1.6rem
}
.topGroup .todayCard .todayCard-info .todayCard-title {
font-size: 28px;
font-weight: 700;
line-height: 36px
}
.topGroup .banner-button-group {
position: absolute;
right: 2rem;
bottom: 2rem;
display: flex;
transition: .3s
}
.topGroup .todayCard.hide .banner-button-group {
bottom: 1rem
}
.topGroup .banner-button {
border-radius: 20px;
display: flex;
align-items: center;
z-index: 1;
transition: .3s;
cursor: pointer;
backdrop-filter: saturate(180%) blur(20px)!important;
-webkit-backdrop-filter: blur(20px);
transform: translateZ(0);
height: 40px;
width: 118px;
justify-content: center
}
.topGroup .banner-button i {
margin-right: 8px;
font-size: 22px
}
.todayCard-cover-slides {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
z-index: -1
}
.todayCard-slides-wrapper {
display: flex;
width: 100%;
height: 100%;
transition: transform .5s ease-in-out
}
.todayCard-slide-item {
min-width: 100%;
flex-shrink: 0;
height: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
display: block
}
.todayCard-slider-nav {
position: absolute;
top: 50%;
transform: translateY(-50%);
font-size: 2em;
color: rgba(255,255,255,.7);
cursor: pointer;
z-index: 10;
padding: 0 10px;
background-color: rgba(0,0,0,.3);
border-radius: 5px;
transition: background-color .3s ease;
user-select: none;
display: flex;
align-items: center;
justify-content: center;
height: 40px;
width: 40px
}
.todayCard-slider-nav:hover {
background-color: rgba(0,0,0,.5)
}
.todayCard-slider-nav.prev {
left: 10px
}
.todayCard-slider-nav.next {
right: 10px
}
.todayCard-slider-nav:before {
font-family: 'iconfont'!important;
font-size: inherit;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.todayCard-slider-nav.prev:before {
content: "\e604"
}
.todayCard-slider-nav.next:before {
content: "\e605"
}
.tags-group-icon {
width: 120px;
height: 120px;
border-radius: 30px
}
.tags-group-all {
display: flex;
transform: rotate(-30deg)
}
.tags-group-all.nowrapMove {
transform: rotate(0);
padding-bottom: 2rem
}
.tags-group-wrapper {
margin-top: 5rem;
display: flex;
flex-wrap: nowrap;
animation: rowup 60s linear infinite
}
.nowrapMove .tags-group-wrapper {
margin-top: 7rem;
animation: rowup 120s linear infinite
}
.tags-group-icon-pair .tags-group-icon:nth-child(even) {
margin-top: 1rem;
transform: translate(-60px)
}
.tags-group-icon-pair {
margin-left: 1rem
}
.tags-group-icon {
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-size: 66px;
font-weight: 700;
box-shadow: var(--bywind-shadow-blackdeep)
}
.nowrapMove .tags-group-icon {
border-radius: 50%
}
.tags-group-icon img {
width: 60%
}
.nowrapMove .tags-group-icon img {
min-width: 100%;
min-height: 100%;
border-radius: 50%;
object-fit: cover
}
.categoryItem:hover i {
opacity: .8;
transition: .8s;
transition-delay: .15s;
transform: scale(1.03) rotate(0);
font-size: 4rem;
filter: blur(0)
}
@media screen and (min-width: 1200px) {
.categoryItem:hover i {
transform:scale(1.03) rotate(0)
}
}
.cate-button-text {
box-shadow: var(--bywind-shadow-black)
}
.recent-post-top .categoryGroup {
display: flex;
flex-direction: column;
justify-content: space-between;
min-width: 200px
}
.categoryGroup .categoryItem:nth-child(3) {
display: none
}
@media screen and (min-width: 1200px) {
.recent-post-top .categoryGroup {
flex-direction:row;
height: 24%
}
.categoryItem {
width: calc(100%/3 - .33rem);
height: 100%;
margin-right: .5rem
}
.categoryItem:last-child {
margin-right: 0
}
.categoryItem:hover {
width: 50%
}
.categoryGroup .categoryItem:nth-child(3) {
display: flex
}
}
a.categoryButton.wniui_one {
background: linear-gradient(to right,#358bff,#15c6ff);
background-size: 200%
}
a.categoryButton.wniui_two {
background: linear-gradient(to right,#f65,#ffbf37);
background-size: 200%
}
a.categoryButton.wniui_three {
background: linear-gradient(to right,#18e7ae,#1eebeb);
background-size: 200%
}
[data-theme=dark] a.categoryButton.wniui_one {
background: linear-gradient(to right,#0653b8,#2fcbff);
background-size: 200%
}
[data-theme=dark] a.categoryButton.wniui_two {
background: linear-gradient(to right,#e22a16,#da980c);
background-size: 200%
}
[data-theme=dark] a.categoryButton.wniui_three {
background: linear-gradient(to right,#099e74,#0ea4a4);
background-size: 200%
}
a.categoryButton:hover {
background-position: 100% 0
}
@keyframes rowup {
from {
transform: translateX(0)
}
to {
transform: translateX(-50%)
}
}
#recent-post-top .recent-post-item .post_cover {
width: 100%
}
#recent-posts>.recent-post-item>.recent-post-info>.article-meta-wrap {
position: absolute;
bottom: 16px;
transition: .3s;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
width: 100%;
left: 0;
padding: 0 32px;
white-space: nowrap
}
.banner-button-text {
color: #fff
}
.banner-button-text:before {
content: '\e6a9 ';
font-family: 'iconfont';
margin-right: 10px
}
.icon-star-smile-fill:before {
content: '\e7a2';
font-family: iconfont
}
.icon-fire-fill:before {
content: '\e663';
font-family: iconfont
}
.icon-book-mark-fill:before {
content: '\e662';
font-family: iconfont
}
}
.todayCard-arrow {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 10;
background-color: rgba(0,0,0,.3);
border-radius: 50%;
color: #fff;
opacity: 0;
visibility: hidden;
transition: opacity .3s ease,visibility 0s linear .3s,background-color .3s ease,transform .3s ease
}
#todayCard:hover .todayCard-arrow {
opacity: .7;
visibility: visible;
transition-delay: 0s
}
.todayCard-arrow:hover {
background-color: rgba(0,0,0,.6);
opacity: 1;
transform: translateY(-50%) scale(1.1)
}
.todayCard-arrow-left {
left: 15px
}
.todayCard-arrow-right {
right: 15px
}
.todayCard-arrow svg {
width: 55%;
height: 55%;
stroke: currentColor;
fill: none
}
.recent-post-top {
margin-bottom: 20px
}
.todayCard-slides-wrapper a{z-index:999}.todayCard-slide-item .slide-link-area{pointer-events:none}.todayCard-slide-item .slide-link-area{display:block;width:100%;height:100%;pointer-events:none}.todayCard-cover-slides{position:relative;width:100%;height:100%;overflow:hidden;z-index:1}.todayCard-slides-wrapper{display:flex;transition:transform .8s cubic-bezier(.4,0,.2,1);will-change:transform}.todayCard-slide-item{flex:0 0 100%;background-size:cover;background-position:center;display:block;position:relative}.todayCard-slide-item .slide-link-area{display:block;width:100%;height:100%}.todayCard-indicators{position:absolute;left:0;right:0;bottom:10px;text-align:center;z-index:10;pointer-events:none}.todayCard-indicators .indicator-dot{display:inline-block;margin:0 3px;background:rgba(255,255,255,.7);transition:background .3s,border-radius .3s,width .3s,height .3s;cursor:pointer;pointer-events:auto;vertical-align:middle;width:7px;height:7px;border-radius:50%}.todayCard-indicators .indicator-dot.active{width:16px;height:6px;border-radius:3px;background:#fff}
/* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
</style>
<script>
document.addEventListener('DOMContentLoaded', () => {
const slides = document.querySelectorAll('.todayCard-slide-item');
const indicators = document.querySelectorAll('.todayCard-indicators .indicator-dot');
const prevBtn = document.querySelector('.todayCard-arrow-left');
const nextBtn = document.querySelector('.todayCard-arrow-right');
const autoplayDelay = parseInt(document.getElementById('todayCard').dataset.autoplayDelay) || 4000;
let currentIndex = 0;
let timer = null;
function updateSlide(index) {
const wrapper = document.querySelector('.todayCard-slides-wrapper');
wrapper.style.transform = `translateX(-${index * 100}%)`;
wrapper.style.transition = 'transform 0.5s ease';
indicators.forEach(dot => dot.classList.remove('active'));
if (indicators[index]) indicators[index].classList.add('active');
}
function nextSlide() {
currentIndex = (currentIndex + 1) % slides.length;
updateSlide(currentIndex);
}
function prevSlide() {
currentIndex = (currentIndex - 1 + slides.length) % slides.length;
updateSlide(currentIndex);
}
// 自动播放
function startAutoplay() {
stopAutoplay();
timer = setInterval(nextSlide, autoplayDelay);
}
function stopAutoplay() {
if (timer) clearInterval(timer);
}
// 指示点点击跳转
indicators.forEach(dot => {
dot.addEventListener('click', () => {
const index = parseInt(dot.dataset.idx);
currentIndex = index;
updateSlide(currentIndex);
startAutoplay();
});
});
// 左右箭头点击
prevBtn.addEventListener('click', () => {
prevSlide();
startAutoplay();
});
nextBtn.addEventListener('click', () => {
nextSlide();
startAutoplay();
});
updateSlide(currentIndex);
startAutoplay();
});
</script>
<?php
// echo $args['after_widget'];
}
// ✅ 随机文章功能
add_action('template_redirect', 'custom_random_post');
function custom_random_post() {
if (!isset($_GET['random'])) return;
global $wpdb;
$query = "SELECT ID FROM $wpdb->posts WHERE post_type = 'post' AND post_password = '' AND post_status = 'publish' ORDER BY RAND() LIMIT 1";
if (!empty($_GET['random_cat_id'])) {
$cat_id = absint($_GET['random_cat_id']);
$query = "SELECT DISTINCT ID FROM $wpdb->posts AS p
INNER JOIN $wpdb->term_relationships AS tr ON (p.ID = tr.object_id AND tr.term_taxonomy_id = $cat_id)
INNER JOIN $wpdb->term_taxonomy AS tt ON (tr.term_taxonomy_id = tt.term_taxonomy_id AND taxonomy = 'category')
WHERE p.post_type = 'post' AND p.post_password = '' AND p.post_status = 'publish'
ORDER BY RAND() LIMIT 1";
}
if (!empty($_GET['random_post_type'])) {
$post_type = sanitize_key($_GET['random_post_type']);
$query = "SELECT ID FROM $wpdb->posts WHERE post_type = '$post_type' AND post_password = '' AND post_status = 'publish' ORDER BY RAND() LIMIT 1";
}
$random_id = $wpdb->get_var($query);
if ($random_id) {
wp_redirect(get_permalink($random_id));
exit;
}
}22.增加一个版权
![图片[22]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-19.png)
将下面的代码放到：子比主题–>>文章&列表–>>文章页面–>>版权声明即可！
<!--九块九版权样式三-->
<head>
<style type="text/css">
.post-copyright {
box-shadow: 2px 2px 5px;
line-height: 2;
position: relative;
margin: 40px 0 10px;
padding: 10px 16px;
border: 1px solid var(--light-grey);
transition: box-shadow .3s ease-in-out;
overflow: hidden;
border-radius: 12px !important;
background-color: var(--main-bg-color);
}
.post-copyright:before {
position: absolute;
right: -26px;
top: -120px;
content: '\f25e';
font-size: 200px;
font-family: 'FontAwesome';
opacity: .2;
}
.post-copyright__title {
font-size: 22px;
}
.post-copyright_type {
font-size: 18px;
color: var(--theme-color)
}
.post-copyright .post-copyright-info {
padding-left: 6px;
font-size: 15px;
}
.post-copyright-m-info .post-copyright-a,
.post-copyright-m-info .post-copyright-c,
.post-copyright-m-info .post-copyright-u {
display: inline-block;
width: fit-content;
padding: 2px 5px;
font-size: 15px;
}
.muted-3-color {
color: var(--main-color);
}
/*手机优化*/
@media screen and (max-width:800px) {
.post-copyright-m-info {
display: none
}
}
</style>
</head>
<body>
<div class="post-copyright" style="max-width:800px;margin:0 auto;">
<div class="post-copyright__title" style="margin:10px 10px"><span class="post-copyright_title"><strong>
<script>document.write
(document.title);</script>
</strong></span></div>
<div class="post-copyright__type" style="margin:10px 10px"><span class="post-copyright_type">本文链接：
<script>var url =
window.location.href; document.write(document.URL);</script>
</span></div>
<div class="post-copyright-m">
<div class="post-copyright-m-info">
<div class="post-copyright-a">
<strong>文章作者</strong>
<div class="post-copyright-cc-info">
<strong><a href="/">九块九源码</a></strong>
</div>
</div>
<div class="post-copyright-c" style="margin:10px 20px">
<strong>隐私政策</strong>
<div class="post-copyright-cc-info">
<strong><a href="/privacy" target="_blank">PrivacyPolicy</a></strong>
</div>
</div>
<div class="post-copyright-u" style="margin:10px 20px">
<strong>用户协议</strong>
<div class="post-copyright-cc-info">
<strong><a href="/protocol" target="_blank">UseGenerator</a></strong>
</div>
</div>
<div class="post-copyright-c" style="margin:10px 20px">
<strong>许可协议 </strong>
<div class="post-copyright-cc-info">
<strong><a href="https://creativecommons.org/licenses/by-
nc-sa/4.0/" target="_blank">NC-SA 4.0</a></strong>
</div>
</div>
</div>
</div>
</div>
</body>23.卡片列表5个
![图片[23]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-20-1024x449.png)
将代码放到:WP后台->>Zibll主题设置->>全局&功能->>自定义代码->>自定义CSS样式 即可
/*文章卡片排列X5*/
@media (min-width: 700px) {
.posts-item.card {
width: calc(20% - 16px);
}
}24.私密评价
![图片[24]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-21-1024x487.png)
定位：/wp-content/themes/zibll/func.php文件，没有这个文件自己创建一个，记得加上php头，要不然会报错，将下面的代码直接丢里面即可！
// 私密评论显示逻辑
function zib_private_message_hook($comment_content, $comment) {
$comment_ID = $comment->comment_ID;
$is_private = get_comment_meta($comment_ID, '_private', true);
$email = $comment->comment_author_email;
$current_user = wp_get_current_user();
// HTML for private comment notification
$html = '<div class="hidden-box" reply-show="true" reload-hash="#hidden-box-comment"><a class="hidden-text"><i class="fa fa-exclamation-circle mr10"></i>此评论为私密评论，仅双方可见.</a></div>';
if ($is_private) {
// 安全判断：优先使用 user_id 比对
$is_comment_author = false;
$is_post_author = false;
$is_admin = current_user_can('manage_options');
if ($current_user && $current_user->ID) {
$is_comment_author = ($current_user->ID == $comment->user_id);
$is_post_author = ($current_user->ID == get_post_field('post_author', $comment->comment_post_ID));
}
// 仅允许：管理员 / 评论作者 / 文章作者 查看私密评论内容
if ($is_admin || $is_comment_author || $is_post_author) {
return '<div class="hidden-box show" id="hidden-box-comment"><div class="hidden-text">私密评论内容</div>' . $comment_content . '</div>';
}
return $html;
}
return $comment_content;
}
add_filter('get_comment_text', 'zib_private_message_hook', 10, 2);
// 添加私密按钮到评论操作列表
function zib_comments_action_add_private($lists, $comment) {
$current_user = wp_get_current_user();
$user_id = get_current_user_id();
// 仅允许管理员或评论作者看到“设为私密”选项
if (is_user_logged_in() && (is_super_admin($user_id) || $current_user->ID == $comment->user_id)) {
$comment_ID = $comment->comment_ID;
$is_private = get_comment_meta($comment_ID, '_private', true);
$private_text = empty($is_private) ? '设为私密' : '取消私密';
$action = empty($is_private) ? 'set_private' : 'del_private';
$private_but = '<a class="comment-private-link wp-ajax-submit" form-action="' . esc_attr($action) . '" form-data="' . esc_attr(json_encode(['id' => $comment_ID])) . '" href="javascript:;"><i class="fa fa-user-secret mr10" aria-hidden="true"></i>' . $private_text . '</a>';
$lists = '<li>' . $private_but . '</li>' . $lists;
}
return $lists;
}
add_filter('comments_action_lists', 'zib_comments_action_add_private', 99, 2);
// 处理更新评论私密状态的 AJAX 请求
function zib_private_comment_action() {
$response = ['reload' => true];
if (!isset($_POST['action']) || !$_POST['action']) {
zib_send_json_error(['msg' => '无效的操作类型'] + $response);
}
if (!isset($_POST['id']) || !$_POST['id']) {
zib_send_json_error(['msg' => '无效的评论ID'] + $response);
}
$comment_id = intval($_POST['id']);
$action = sanitize_text_field($_POST['action']);
$comment = get_comment($comment_id);
$post_author_id = get_post_field('post_author', $comment->comment_post_ID);
$current_user = wp_get_current_user();
// 用 user_id 判断评论作者
if (!$comment_id || !$current_user || !($current_user->ID == $comment->user_id || current_user_can('manage_options'))) {
zib_send_json_error(['msg' => '权限不足或无效的评论ID'] + $response);
}
if ($action === 'set_private') {
update_comment_meta($comment_id, '_private', 'true');
zib_send_json_success(['msg' => '评论已设为私密'] + $response);
} elseif ($action === 'del_private') {
delete_comment_meta($comment_id, '_private');
zib_send_json_success(['msg' => '评论已公开'] + $response);
} else {
zib_send_json_error(['msg' => '无效的操作类型'] + $response);
}
}
add_action('wp_ajax_set_private', 'zib_private_comment_action');
add_action('wp_ajax_del_private', 'zib_private_comment_action');25.go跳转带快照
![图片[25]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-22-1024x541.png)
定位：/wp-content/themes/zibll/go.php文件，直接将下面的代码替换即可，里面有文字和广告，自己填！
<?php
if (
strlen($_SERVER['REQUEST_URI']) > 384 ||
strpos($_SERVER['REQUEST_URI'], "eval(") !== false ||
strpos($_SERVER['REQUEST_URI'], "base64") !== false
) {
@header("HTTP/1.1 414 Request-URI Too Long");
@header("Status: 414 Request-URI Too Long");
@header("Connection: Close");
@exit;
}
@session_start();
// 处理URL参数
$t_url = !empty($_SESSION['GOLINK']) ? $_SESSION['GOLINK'] : preg_replace('/^url=(.*)$/i', '$1', $_SERVER["QUERY_STRING"]);
if (!empty($t_url)) {
if ($t_url === base64_encode(base64_decode($t_url))) {
$t_url = base64_decode($t_url);
}
$t_url = htmlspecialchars($t_url);
preg_match('/^(http|https|thunder|qqdl|ed2k|Flashget|qbrowser):\/\//i', $t_url, $matches);
$site_name = "这里修改为你的网站名";
$page_title = $site_name . ' - 网站安全验证中心';
if ($matches) {
$url = $t_url;
} else {
preg_match('/\./i', $t_url, $matche);
if ($matche) {
$url = 'http://' . $t_url;
} else {
$url = 'http://' . $_SERVER['HTTP_HOST'];
$page_title = '参数错误 - ' . $site_name;
}
}
} else {
$page_title = '参数缺失 - ' . $site_name;
$url = 'http://' . $_SERVER['HTTP_HOST'];
}
$url = htmlspecialchars($url);
$domain = parse_url($url, PHP_URL_HOST) ?: $url;
$normalizedUrl = $url;
if (!preg_match('/^https?:\/\//i', $normalizedUrl)) {
$normalizedUrl = 'http://' . $normalizedUrl;
}
$encodedUrl = rawurlencode($normalizedUrl);
$snapshotWidth = 1024;
$snapshotHeight = 768;
$snapshotQuality = 80;
$mshotsUrl = "https://s0.wp.com/mshots/v1/{$encodedUrl}?w={$snapshotWidth}&h={$snapshotHeight}&quality={$snapshotQuality}";
?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<meta name="robots" content="noindex, nofollow">
<link rel="shortcut icon" href="https://blgo.ax24.cn/wp-content/uploads/2025/08/favicon.ico" type="image/x-icon">
<title><?php echo $page_title; ?></title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
:root {
--primary: #165DFF;
--primary-light: #E8F3FF;
--primary-dark: #0E42CC;
--danger: #F53F3F;
--danger-light: #FFECE8;
--warning: #FF7D00;
--warning-light: #FFF7E8;
--success: #00B42A;
--success-light: #E8FFEA;
--gray-50: #F2F3F5;
--gray-100: #E5E6EB;
--gray-200: #C9CDD4;
--gray-300: #86909C;
--gray-400: #4E5969;
--gray-500: #1D2129;
--text: var(--gray-500);
--text-light: var(--gray-400);
--border-radius: 12px;
--border-radius-sm: 6px;
--shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
--shadow-hover: 0 8px 30px rgba(0, 0, 0, 0.12);
--transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "Inter", "Microsoft YaHei", "Segoe UI", Roboto, sans-serif;
}
body {
background-color: #F7F8FA;
color: var(--text);
line-height: 1.5;
padding: 30px 0;
font-size: 15px;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 16px;
}
.card {
background-color: #fff;
border-radius: var(--border-radius);
box-shadow: var(--shadow);
overflow: hidden;
margin-bottom: 24px;
transition: var(--transition);
}
.card:hover {
box-shadow: var(--shadow-hover);
}
.card-header {
background: linear-gradient(135deg, rgba(22, 93, 255, 0.9), rgba(22, 93, 255, 0.7));
color: #fff;
padding: 20px 24px;
font-size: 20px;
font-weight: 600;
display: flex;
align-items: center;
justify-content: space-between;
position: relative;
overflow: hidden;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.card-header::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0) 100%);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}
.card-header .content {
position: relative;
z-index: 1;
display: flex;
align-items: center;
}
.card-header .contact-buttons {
position: relative;
z-index: 1;
display: flex;
gap: 12px;
}
.contact-btn {
background-color: rgba(255, 255, 255, 0.2);
border: none;
color: white;
padding: 6px 16px;
border-radius: 20px;
font-size: 14px;
cursor: pointer;
transition: var(--transition);
display: inline-flex;
align-items: center;
gap: 6px;
text-decoration: none;
}
.contact-btn:hover {
background-color: rgba(255, 255, 255, 0.3);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.card-header .icon {
font-size: 24px;
margin-right: 12px;
}
.card-body {
padding: 24px;
}
.main-content {
display: flex;
gap: 24px;
margin-bottom: 24px;
}
.left-column {
flex: 1;
}
.right-column {
flex: 1.2;
}
.warning-notice {
background-color: var(--warning-light);
border-left: 4px solid var(--warning);
padding: 16px 20px;
margin-bottom: 24px;
border-radius: 0 var(--border-radius-sm) var(--border-radius-sm) 0;
display: flex;
align-items: center;
transition: var(--transition);
}
.warning-notice:hover {
transform: translateX(2px);
}
.warning-notice i {
color: var(--warning);
font-size: 22px;
margin-right: 12px;
flex-shrink: 0;
}
.url-display {
background-color: var(--gray-50);
border: 1px solid var(--gray-100);
border-radius: var(--border-radius-sm);
padding: 16px 20px;
margin-bottom: 24px;
word-break: break-all;
position: relative;
transition: var(--transition);
}
.url-display:hover {
border-color: var(--primary-light);
background-color: var(--primary-light);
}
.url-display::before {
content: "目标网址";
position: absolute;
top: -10px;
left: 16px;
background-color: #fff;
padding: 0 8px;
font-size: 13px;
color: var(--gray-400);
font-weight: 500;
}
.info-section {
margin-bottom: 32px;
}
.info-title {
font-size: 18px;
font-weight: 600;
margin-bottom: 16px;
padding-bottom: 10px;
border-bottom: 1px solid var(--gray-100);
display: flex;
align-items: center;
color: var(--gray-500);
}
.info-title i {
color: var(--primary);
margin-right: 10px;
font-size: 20px;
}
.snapshot-container {
border: 1px solid var(--gray-100);
border-radius: var(--border-radius);
overflow: hidden;
background-color: #fff;
margin-bottom: 24px;
transition: var(--transition);
height: 100%;
display: flex;
flex-direction: column;
}
.snapshot-container:hover {
border-color: var(--primary-light);
box-shadow: 0 2px 12px rgba(22, 93, 255, 0.08);
}
.snapshot-header {
background-color: var(--gray-50);
padding: 12px 16px;
border-bottom: 1px solid var(--gray-100);
display: flex;
align-items: center;
font-size: 14px;
}
.browser-dots {
display: flex;
gap: 6px;
margin-right: 16px;
}
.dot {
width: 10px;
height: 10px;
border-radius: 50%;
transition: var(--transition);
}
.dot-red {
background-color: #FF5A5A;
}
.dot-red:hover {
transform: scale(1.2);
}
.dot-yellow {
background-color: #FFC850;
}
.dot-yellow:hover {
transform: scale(1.2);
}
.dot-green {
background-color: #56D364;
}
.dot-green:hover {
transform: scale(1.2);
}
.snapshot-url {
color: var(--gray-400);
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-family: "Consolas", monospace;
}
.snapshot-img-container {
width: 100%;
overflow: hidden;
position: relative;
flex: 1;
min-height: 400px;
background-color: var(--gray-50);
}
.snapshot-loading {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background-color: rgba(255, 255, 255, 0.8);
z-index: 10;
transition: opacity 0.3s ease;
}
.snapshot-loading i {
font-size: 36px;
color: var(--primary);
animation: spin 1.5s linear infinite;
position: relative;
}
.snapshot-loading i::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 120%;
height: 120%;
border-radius: 50%;
border: 2px solid rgba(22, 93, 255, 0.2);
transform: translate(-50%, -50%);
animation: pulse 2s infinite;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
@keyframes pulse {
0% { transform: translate(-50%, -50%) scale(0.8); opacity: 1; }
100% { transform: translate(-50%, -50%) scale(1.5); opacity: 0; }
}
.snapshot-img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform 0.6s ease, opacity 0.4s ease;
opacity: 0;
}
.snapshot-img.loaded {
transform: scale(1);
opacity: 1;
}
.snapshot-img:hover {
transform: scale(1.03);
}
.snapshot-placeholder {
padding: 80px 20px;
text-align: center;
color: var(--gray-400);
}
.snapshot-refresh {
margin-top: 12px;
color: var(--primary);
background: none;
border: 1px solid var(--primary);
padding: 6px 18px;
border-radius: 20px;
font-size: 14px;
cursor: pointer;
transition: var(--transition);
display: inline-flex;
align-items: center;
gap: 6px;
text-decoration: none;
}
.snapshot-refresh i {
transition: transform 0.5s ease;
}
.snapshot-refresh:hover {
background-color: var(--primary);
color: white;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(22, 93, 255, 0.25);
}
.snapshot-refresh:hover i {
transform: rotate(180deg);
}
.action-buttons {
display: flex;
justify-content: center;
gap: 24px;
margin: 24px 0;
flex-wrap: wrap;
}
.btn {
padding: 14px 48px;
border-radius: var(--border-radius-sm);
font-size: 16px;
font-weight: 600;
cursor: pointer;
transition: var(--transition);
border: none;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
position: relative;
overflow: hidden;
text-decoration: none;
}
.btn::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
transition: 0.5s;
}
.btn:hover::before {
left: 100%;
}
.btn-cancel {
background-color: #fff;
color: var(--gray-500);
border: 1px solid var(--gray-100);
}
.btn-cancel:hover {
background-color: var(--gray-50);
border-color: var(--gray-200);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.btn-continue {
background-color: var(--primary);
color: #fff;
}
.btn-continue:hover {
background-color: var(--primary-dark);
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(22, 93, 255, 0.3);
}
.safety-tips {
background-color: var(--danger-light);
border-radius: var(--border-radius-sm);
padding: 16px 20px;
margin: 24px 0;
font-size: 14px;
color: var(--danger);
border-left: 4px solid var(--danger);
transition: var(--transition);
}
.safety-tips:hover {
transform: translateX(2px);
}
.safety-tips strong {
font-weight: 600;
}
.ad-section {
margin-top: 30px;
border-radius: var(--border-radius-sm);
overflow: hidden;
}
.ad-image-container {
margin-bottom: 12px;
border-radius: var(--border-radius-sm);
overflow: hidden;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
transition: var(--transition);
}
.ad-image-container:hover {
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
transform: translateY(-2px);
}
.ad-image {
width: 100%;
height: auto;
display: block;
border: none;
}
.ad-text-container {
display: flex;
gap: 12px;
}
.ad-text {
flex: 1;
background-color: var(--gray-50);
border: 1px solid var(--gray-100);
border-radius: var(--border-radius-sm);
padding: 12px 16px;
text-align: center;
color: var(--primary);
font-weight: 500;
cursor: pointer;
transition: var(--transition);
text-decoration: none;
}
.ad-text:hover {
background-color: var(--primary-light);
border-color: var(--primary);
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(22, 93, 255, 0.1);
}
.footer-info {
text-align: center;
font-size: 14px;
color: var(--gray-400);
padding: 20px 0 10px;
position: relative;
}
.footer-info::before {
content: '';
position: absolute;
top: 0;
left: 15%;
width: 70%;
height: 1px;
background-color: var(--gray-100);
}
.footer-info p {
margin-bottom: 8px;
}
@media (max-width: 992px) {
.main-content {
flex-direction: column;
}
.snapshot-img-container {
min-height: 320px;
}
}
@media (max-width: 768px) {
.action-buttons {
flex-direction: column;
gap: 12px;
padding: 0 16px;
}
.btn {
width: 100%;
padding: 14px 0;
}
.card-header {
padding: 16px 20px;
font-size: 18px;
flex-direction: column;
align-items: flex-start;
gap: 12px;
}
.card-header .contact-buttons {
width: 100%;
justify-content: flex-start;
}
.card-body {
padding: 20px;
}
.ad-text {
padding: 10px 12px;
font-size: 14px;
}
}
@media (max-width: 480px) {
body {
padding: 20px 0;
}
.card-header {
font-size: 16px;
}
.card-body {
padding: 16px;
}
.warning-notice, .safety-tips {
padding: 12px 16px;
}
.snapshot-img-container {
min-height: 240px;
}
.contact-btn {
padding: 5px 12px;
font-size: 13px;
}
.ad-text-container {
flex-direction: column;
gap: 8px;
}
}
</style>
</head>
<body>
<div class="container">
<!-- 页面标题卡片 -->
<div class="card">
<div class="card-header">
<div class="content">
<i class="fas fa-shield-alt icon"></i>
这里修改为你的网站名
</div>
<div class="contact-buttons">
<a href="这里修改为你的QQ链接"
class="contact-btn"
target="_blank"
rel="noopener noreferrer">
<i class="fab fa-qq"></i> 联系站长
</a>
<a href="mailto:这里修改为你的邮箱"
class="contact-btn">
<i class="fas fa-envelope"></i> 发送邮件
</a>
</div>
</div>
<div class="card-body">
<div class="main-content">
<!-- 左侧列 - 提示信息 -->
<div class="left-column">
<div class="warning-notice">
<i class="fas fa-exclamation-circle"></i>
<div>您即将离开当前平台，访问第三方网站。请确认该网站的安全性后再进行访问。</div>
</div>
<div class="url-display">
<?php echo $url; ?>
</div>
<!-- 安全提示 -->
<div class="safety-tips">
<strong>安全提示：</strong>请勿在陌生网站输入银行卡密码、身份证号等敏感信息。如发现虚假网站或诈骗行为，请立即举报。
</div>
<!-- 操作按钮 -->
<div class="action-buttons">
<button class="btn btn-cancel" id="cancelBtn">
<i class="fas fa-arrow-left"></i> 返回上一页
</button>
<button class="btn btn-continue" id="continueBtn">
<i class="fas fa-external-link-alt"></i> 继续访问
</button>
</div>
<!-- 广告位 -->
<div class="ad-section">
<!-- 第一行：图片广告 -->
<a href="这里修改为你需要跳转的网站链接" target="_blank" rel="noopener noreferrer" class="ad-image-container">
<img src="这里修改为你的图片地址" alt="广告图片" class="ad-image">
</a>
</div>
</div>
<!-- 右侧列 - 屏幕快照 -->
<div class="right-column">
<div class="info-section">
<h3 class="info-title">
<i class="fas fa-desktop"></i> 网站快照预览
</h3>
<div class="snapshot-container">
<div class="snapshot-header">
<div class="browser-dots">
<div class="dot dot-red"></div>
<div class="dot dot-yellow"></div>
<div class="dot dot-green"></div>
</div>
<div class="snapshot-url"><?php echo $domain; ?></div>
</div>
<div class="snapshot-img-container">
<div class="snapshot-loading" id="snapshotLoader">
<i class="fas fa-spinner fa-spin"></i>
</div>
<img src="<?php echo $mshotsUrl; ?>"
alt="网页快照"
class="snapshot-img"
loading="lazy"
onload="this.classList.add('loaded'); document.getElementById('snapshotLoader').style.opacity='0'; setTimeout(() => document.getElementById('snapshotLoader').style.display='none', 300);"
onerror="handleSnapshotError()">
</div>
<div style="text-align: center; padding: 12px;">
<button class="snapshot-refresh" onclick="refreshSnapshot()">
<i class="fas fa-sync-alt"></i> 刷新快照
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 页脚信息 -->
<div class="footer-info">
<p>安全验证中心旨在保护用户上网安全，本验证结果仅供参考</p>
<p>© 2025 这里修改为你的网站名 版权所有</p>
</div>
</div>
<script>
// 保存原始快照URL，用于刷新功能
const originalSnapshotUrl = "<?php echo $mshotsUrl; ?>";
// 取消访问按钮
document.getElementById('cancelBtn').addEventListener('click', function() {
this.innerHTML = '<i class="fas fa-spinner fa-spin"></i> 返回中...';
this.disabled = true;
// 尝试返回上一页，如果不行则跳转到首页
setTimeout(() => {
if (history.length > 1) {
history.back();
} else {
location.href = 'http://<?php echo $_SERVER['HTTP_HOST']; ?>';
}
}, 600);
});
// 继续访问按钮
document.getElementById('continueBtn').addEventListener('click', function() {
this.innerHTML = '<i class="fas fa-spinner fa-spin"></i> 跳转中...';
this.disabled = true;
setTimeout(() => {
location.replace('<?php echo $url; ?>');
}, 800);
});
// 处理快照加载错误
function handleSnapshotError() {
const container = document.querySelector('.snapshot-img-container');
container.innerHTML = `
<div class="snapshot-placeholder">
<i class="fas fa-exclamation-circle" style="font-size: 36px; margin-bottom: 12px; color: var(--danger);"></i>
<p>网页快照加载失败</p>
<button class="snapshot-refresh" onclick="refreshSnapshot()">
<i class="fas fa-sync-alt"></i> 重试
</button>
</div>
`;
}
// 刷新快照功能
function refreshSnapshot() {
const container = document.querySelector('.snapshot-img-container');
// 添加随机参数防止缓存
const randomParam = Math.random().toString(36).substring(7);
const newSnapshotUrl = originalSnapshotUrl + (originalSnapshotUrl.includes('?') ? '&' : '?') + 'rand=' + randomParam;
container.innerHTML = `
<div class="snapshot-loading" id="snapshotLoader">
<i class="fas fa-spinner fa-spin"></i>
</div>
<img src="${newSnapshotUrl}"
alt="刷新后的网页快照"
class="snapshot-img"
loading="lazy"
onload="this.classList.add('loaded'); document.getElementById('snapshotLoader').style.opacity='0'; setTimeout(() => document.getElementById('snapshotLoader').style.display='none', 300);"
onerror="handleSnapshotError()">
`;
}
// 添加页面载入动画
document.addEventListener('DOMContentLoaded', function() {
const card = document.querySelector('.card');
card.style.opacity = '0';
card.style.transform = 'translateY(20px)';
setTimeout(() => {
card.style.transition = 'opacity 0.6s ease, transform 0.6s ease';
card.style.opacity = '1';
card.style.transform = 'translateY(0)';
}, 100);
});
</script>
</body>
</html>26.子比主题 – 右下角提示美化样式
给子比主题右下角提示加一个美化的样式，比如我们登入、签到等等会在右下角有这个弹窗样式，相当于替换了子比自带的样式，话不多说直接开始，喜欢的自行部署！
![图片[26]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-23-1024x477.png)
将下面的代码放到：子比主题–>>自定义CSS样式即可！
.notyf.success {
background: linear-gradient(90deg,rgb(249 15 15 / 70%),rgba(61,189,249,.8));
border-radius: 18px 0 0 18px;
}.enlighter-default .enlighter{max-height:400px;overflow-y:auto !important;}.posts-item .item-heading>a {font-weight: bold;color: unset;}@media (max-width:640px) {
.meta-right .meta-like{
display: unset !important;
}
}27.子比主题 – 为单个文章设置有效期_到期自动下线
![图片[27]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-24.png)
可看演示图，截止时间到期之后自动删除了文章到了回收站，非常的实用的功能！
首先我们到：/wp-content/themes/zibll/func.php文件，没有这个文件自己创一个，记得加上php头，要不然会报错，将下面的代码放到里面
//文章有效期
CSF::createMetabox('post_validity_options', array(
'title' => '文章有效期',
'post_type' => ['post', 'page', 'forum_post'],
'context' => 'side',
'data_type' => 'unserialize',
));
CSF::createSection('post_validity_options', array(
'fields' => array(
array(
'id' => 'post_validity_time',
'type' => 'date',
'desc' => '设置内容的有效期，请确保格式正确，例如：<code>2020-10-10 23:59:59</code></br>到期后将会自动删除此此内容',
'settings' => array(
'dateFormat' => 'yy-mm-dd 23:59:59',
'changeMonth' => true,
'changeYear' => true,
),
),
),
));
function zib_the_content_fore($content)
{
$post_id = get_the_ID();
$time = get_post_meta($post_id, 'post_validity_time', true);
if ($time) {
$end_time = date("m/d/Y H:i:s", strtotime($time));
$over = '<script type="text/javascript">window.location.reload()</script>';
$content = '<div style="text-align: center; border: 2px dashed lightgray; padding: 10px; border-radius: 18px; margin: 15px auto;"><i class="fa fa-exclamation-triangle" style="font-size: 16px;"></i> <strong style="text-align:center;font-size: 16px;">腾飞博客提醒您：因时效性问题，当前项目将于 <span style="color: red; font-size: 16px;" data-over-text="'. esc_attr($over). '" data-countdown="'. $end_time. '"></span> 后自动删除。</strong></div>' . $content;
}
return $content;
}
add_filter('the_content', 'zib_the_content_fore');
function zib_template_redirect_execute()
{
if (is_single()) {
$post_id = get_the_ID();
$time = get_post_meta($post_id, 'post_validity_time', true);
if ($time && strtotime($time) < strtotime(current_time('Y-m-d H:i:s'))) {
//执行删除文章
wp_trash_post($post_id);
wp_safe_redirect(home_url());
exit;
}
}
}
add_action('template_redirect', 'zib_template_redirect_execute');28.子比主题 – 底部添加一个动态展示区块
给子比主题底部加一个动态展示区块的样式美化，这个动态展示的我记得是哪个大厂底部下面的样式，然后子比官网也在用，所以就分享一下这个教程吧！
![图片[28]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-27-1024x233.png)
首先定位：WP后台–>>外观–>>小工具–>>Zibl 幻灯片(新)，然后我们放到你想要放到的位置，然后把子比默认的全部删掉，比如图片，把视频上传，视频我放在下面你看完教程自己下载视频，我这里配置的是电脑端显示，移动端不显示，建议移动端不显示，毕竟不怎么美观，总的来说就是把子比默认删掉完，然后加上视频，然后如下我的配置，你可以借鉴一下！
![图片[29]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-28.png)
视频自己访问一下链接自己下载一下
https://www.9k9y.cn/wp-content/uploads/2025/08/20250314023734318-蓝色矩形循环跳动.mp4
29.子比主题 – 文章封面缩略图悬停样式
![图片[30]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-29.png)
根据上面的演示图喜欢哪个将下面的代码放到：子比主题–>>自定义CSS样式即可，别忘了换图标
.item-thumbnail {
position: relative;
overflow: hidden;
transition: all 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
border-radius: 8px;
}
.item-thumbnail:hover {
transform: translateY(-8px) scale(1.02);
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
}
.item-thumbnail:before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(45deg, rgba(66, 0, 255, 0.2) 0%, rgba(255, 0, 140, 0.2) 100%);
transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
border-radius: 8px;
z-index: 2;
max-width: 765px;
margin: 0 auto;
pointer-events: none;
padding-left: 10px;
backdrop-filter: blur(0px);
}
.item-thumbnail:after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 60px;
height: 60px;
margin: -30px 0 0 -30px;
background: url(https://www.9k9y.cn/favicon.ico);
background-repeat: no-repeat;
background-size: 100% 100%;
z-index: 3;
transform: scale(0) translateY(20px);
transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1);
opacity: 0;
pointer-events: none;
filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.8));
}
.item-thumbnail:hover:before {
background: linear-gradient(135deg, rgba(66, 0, 255, 0.6) 0%, rgba(255, 0, 140, 0.4) 100%);
backdrop-filter: blur(3px);
box-shadow: inset 0 0 30px rgba(255, 255, 255, 0.2);
}
.item-thumbnail:hover:after {
transform: scale(1) translateY(0);
opacity: 1;
animation: float 3s infinite ease-in-out, glow 2s infinite alternate;
}
@keyframes float {
0% {
transform: translateY(0) rotate(0deg) scale(1);
}
50% {
transform: translateY(-10px) rotate(5deg) scale(1.05);
}
100% {
transform: translateY(0) rotate(0deg) scale(1);
}
}
@keyframes glow {
0% {
filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.8));
}
100% {
filter: drop-shadow(0 0 20px rgba(255, 255, 255, 1)) drop-shadow(0 0 30px rgba(66, 0, 255, 0.6));
}
}
.item-thumbnail::before {
content: '';
position: absolute;
inset: -3px;
background: linear-gradient(45deg, #ff00cc, #3300ff, #00ccff, #ff00cc);
background-size: 400% 400%;
z-index: -1;
border-radius: 10px;
opacity: 0;
transition: opacity 0.5s ease;
animation: gradientBG 6s ease infinite;
}
.item-thumbnail:hover::before {
opacity: 1;
}
@keyframes gradientBG {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}30.子比主题 – 购买文章自动认证教程
![图片[31]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-30-1024x445.png)
将下面的代码放到：/wp-content/themes/zibll/func.php文件，没有这个文件自己创建一个，记得加上php头，要不然报错，将下面的代码放到里面
// 购买文章自动认证
function zibll_add_meta_box() {
add_meta_box(
'zibll_auth_meta_box',
'认证用户设置',
'zibll_auth_meta_box_callback',
'post',
'side'
);
}
add_action('add_meta_boxes', 'zibll_add_meta_box');
function zibll_auth_meta_box_callback($post) {
// 获取元数据
$is_enabled = get_post_meta($post->ID, '_zibll_auth_enabled', true);
$name = get_post_meta($post->ID, '_zibll_auth_name', true);
$desc = get_post_meta($post->ID, '_zibll_auth_desc', true);
?>
<p>
<label for="zibll_auth_enabled">
<input type="checkbox" name="zibll_auth_enabled" id="zibll_auth_enabled" value="1" <?php checked($is_enabled, 1); ?> />
启用认证用户功能
</label>
</p>
<p>
<label for="zibll_auth_name">认证名称：</label>
<input type="text" name="zibll_auth_name" id="zibll_auth_name" value="<?php echo esc_attr($name); ?>" placeholder="默认：认证用户" />
</p>
<p>
<label for="zibll_auth_desc">认证描述：</label>
<input type="text" name="zibll_auth_desc" id="zibll_auth_desc" value="<?php echo esc_attr($desc); ?>" placeholder="默认：赞助会员" />
</p>
<p>
<ul>
<li>启用后请确保已打开付费下载</li>
<li>购买后将会自动认证，无需审核</li>
<li>留空认证名称或描述则使用默认值</li>
</ul>
</p>
<?php
}
function zibll_save_post_meta($post_id) {
if (!current_user_can('edit_post', $post_id)) {
return;
}
if (isset($_POST['zibll_auth_enabled'])) {
update_post_meta($post_id, '_zibll_auth_enabled', 1);
} else {
delete_post_meta($post_id, '_zibll_auth_enabled');
}
if (isset($_POST['zibll_auth_name'])) {
update_post_meta($post_id, '_zibll_auth_name', sanitize_text_field($_POST['zibll_auth_name']));
} else {
delete_post_meta($post_id, '_zibll_auth_name');
}
if (isset($_POST['zibll_auth_desc'])) {
update_post_meta($post_id, '_zibll_auth_desc', sanitize_text_field($_POST['zibll_auth_desc']));
} else {
delete_post_meta($post_id, '_zibll_auth_desc');
}
}
add_action('save_post', 'zibll_save_post_meta');
function zibll_users_zidongrenzheng($pay_order) {
$pay_order = (array) $pay_order;
$post_id = $pay_order['post_id'];
$user_id = $pay_order['user_id'];
$is_enabled = get_post_meta($post_id, '_zibll_auth_enabled', true);
if ($is_enabled) {
$name = get_post_meta($post_id, '_zibll_auth_name', true);
$desc = get_post_meta($post_id, '_zibll_auth_desc', true);
// 设置默认值
if (empty($name)) {
$name = '认证用户';
}
if (empty($desc)) {
$desc = '赞助会员';
}
// 添加认证操作
zib_add_user_auth($user_id, array(
'name' => $name,
'desc' => $desc,
));
}
}
add_action('payment_order_success', 'zibll_users_zidongrenzheng');31.子比主题 – 随机弹窗评论
![图片[32]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-31.png)
将下方代码放置在主题目录下的function.php或者新建一个func.php文件
<?php
// 设置显示范围，'home' = 仅首页，'all' = 全站
$comment_popup_scope = 'home'; // 或 'all'
// 加载弹窗样式
function print_comment_popup_css_simple() {
global $comment_popup_scope;
if ($comment_popup_scope === 'home' && !is_front_page()) return;
?>
<style>
#wniui-popup-window {
min-width: 300px;
max-width: 500px;
bottom: 20px;
right: 20px;
position: fixed;
z-index: 1002;
color: #363636;
padding: 8px 16px;
border-radius: 12px;
transition: opacity 0.3s ease, transform 0.3s ease;
background-color: rgba(255, 255, 255, 0.85);
border: 1px solid #e3e8f7;
max-height: 300px;
opacity: 0;
transform: translateY(20px);
display: flex;
flex-direction: column;
justify-content: flex-start;
cursor: pointer;
}
#wniui-popup-window:hover {
border: 1px solid #425AEF;
}
#wniui-popup-window.wniui-show {
opacity: 1;
transform: translateY(0);
}
.wniui-popup-header {
position: relative;
display: flex;
align-items: center;
}
.wniui-popup-title {
font-size: 14px;
font-weight: bold;
background: #363636;
color: #fff;
padding: 4px 8px;
border-radius: 4px;
margin-right: 8px;
transition: .3s;
}
.wniui-popup-title:hover {
background-color: #423AEF;
}
.wniui-popup-author {
font-size: 14px;
font-weight: 600;
color: #363636;
display: flex;
justify-content: flex-start;
align-items: center;
cursor: pointer;
}
.wniui-popup-avatar {
width: 25px;
height: 25px;
border-radius: 50%;
margin-right: 6px;
background-color: #f5f6f7;
}
.wniui-popup-window-divider {
width: 100%;
height: 1px;
background: #e3e8f7;
margin: 5px 0;
}
.wniui-popup-window-content {
font-size: 15px;
word-wrap: break-word;
max-width: 450px;
white-space: normal;
text-overflow: ellipsis;
}
.wniui-popup-window-content p {
margin: 0;
padding: 0;
line-height: 1.5;
}
@media screen and (max-width: 768px) {
#wniui-popup-window {
display: none !important;
}
}
.wniui-popup-author span:hover {
color: #425AEF;
transition: .3s;
}
svg#popup-link:hover path {
fill: #425AEF;
transition: .3s;
}
</style>
<?php
}
add_action('wp_head', 'print_comment_popup_css_simple');
// 弹窗HTML输出
function print_comment_popup_html_simple() {
global $comment_popup_scope;
if ($comment_popup_scope === 'home' && !is_front_page()) return;
?>
<div id="wniui-popup-window" class="wniui-show-popup-window" style="cursor: pointer;">
<div class="wniui-popup-header">
<span class="wniui-popup-title">热评</span>
<span class="wniui-popup-author"></span>
<svg id="popup-link" style="transition: .3s; cursor: pointer;display: flex; position: absolute;right:0px;" t="1740280523955" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="22033" xmlns:xlink="http://www.w3.org/1999/xlink" width="30" height="30">
<path
d="M512.1 137.8c-206.4 0-373.7 167.3-373.7 373.7s167.3 373.7 373.7 373.7 373.7-167.3 373.7-373.7-167.3-373.7-373.7-373.7zM721 508.5L589.2 647c-9.9 10.4-27.4 3.4-27.4-11v-90.9h-1.4c-130.9 0-239.1 58.4-259.2 134.7h-2.3c12.8-133.2 125-237.4 261.5-237.4 0.5 0 0.9 0.1 1.4 0.1V359c0-14.4 17.5-21.4 27.4-11L721 486.6c5.8 6.2 5.8 15.8 0 21.9z"
fill="#231815" p-id="22034"></path>
</svg>
</div>
<div class="wniui-popup-window-divider"></div>
<div class="wniui-popup-window-content"></div>
</div>
<?php
}
add_action('wp_footer', 'print_comment_popup_html_simple');
// JS 输出和弹窗逻辑
function print_comment_popup_js_simple() {
global $comment_popup_scope;
if ($comment_popup_scope === 'home' && !is_front_page()) return;
$api_url = esc_url(rest_url('myapi/v1/hot-comments'));
$default_avatar = esc_url(get_template_directory_uri() . '/img/avatar-default.png');
?>
<script>
class CommentPopup {
constructor(config) {
this.config = {
displayTime: 5000,
fadeTime: 300,
retryInterval: 3000,
apiUrl: '<?php echo $api_url; ?>',
defaultAvatar: '<?php echo $default_avatar; ?>',
...config
};
this.popupTimer = null;
this.retryTimer = null;
this.commentData = [];
this.currentCommentUrl = '';
this.popup = document.getElementById('wniui-popup-window');
this.bindEvents();
}
async init() {
try {
await this.fetchComments();
this.showRandomComment();
} catch (error) {
console.error('Failed to fetch comments:', error);
this.scheduleRetry();
}
}
async fetchComments() {
const response = await fetch(this.config.apiUrl);
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
this.commentData = await response.json();
}
scheduleRetry() {
this.retryTimer = setTimeout(() => this.init(), this.config.retryInterval);
}
showRandomComment() {
if (this.commentData.length === 0) return;
const post = this.commentData[Math.floor(Math.random() * this.commentData.length)];
const content = this.sanitizeContent(decodeURIComponent(post.content));
if (!content) return;
const data = {
avatar: post.avatar || this.config.defaultAvatar,
author: post.author,
content,
postUrl: post.url,
commentUrl: post.comment_url,
authorUrl: post.user_url || '#'
};
this.updatePopup(data);
}
sanitizeContent(content) {
return content.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, '');
}
updatePopup(data) {
clearTimeout(this.popupTimer);
this.popup.classList.remove('wniui-show');
this.currentCommentUrl = data.commentUrl;
setTimeout(() => {
this.renderPopupContent(data);
this.popup.classList.add('wniui-show');
this.scheduleNextComment();
}, this.config.fadeTime);
}
renderPopupContent(data) {
const authorElement = this.popup.querySelector('.wniui-popup-author');
authorElement.innerHTML = `
<img class="wniui-popup-avatar" src="${data.avatar}" alt="avatar" loading="lazy">
<span onclick="window.location.href='${data.authorUrl}'">${data.author}</span>
`;
this.popup.querySelector('.wniui-popup-window-content').innerHTML = `<p>${data.content}</p>`;
}
scheduleNextComment() {
this.popupTimer = setTimeout(() => {
this.hidePopup();
this.showRandomComment();
}, this.config.displayTime);
}
hidePopup() {
this.popup.classList.remove('wniui-show');
}
handlePopupClick = (event) => {
if (event.target.closest('svg#popup-link') || !event.target.closest('.wniui-popup-author')) {
if (this.currentCommentUrl) {
window.location.href = this.currentCommentUrl;
}
}
}
bindEvents() {
this.popup.addEventListener('click', this.handlePopupClick);
let touchStartY = 0;
this.popup.addEventListener('touchstart', (e) => {
touchStartY = e.touches[0].clientY;
});
this.popup.addEventListener('touchmove', (e) => {
const touchDiff = e.touches[0].clientY - touchStartY;
if (touchDiff > 50) {
this.hidePopup();
}
});
}
destroy() {
clearTimeout(this.popupTimer);
clearTimeout(this.retryTimer);
this.popup.removeEventListener('click', this.handlePopupClick);
}
}
const commentPopup = new CommentPopup({
displayTime: 5000,
fadeTime: 300,
retryInterval: 3000
});
commentPopup.init();
window.addEventListener('unload', () => {
commentPopup.destroy();
});
</script>
<?php
}
add_action('wp_footer', 'print_comment_popup_js_simple');
// 注册 REST API 路由，获取热评数据
function register_hot_comments_endpoint_simple() {
register_rest_route('myapi/v1', '/hot-comments', array(
'methods' => 'GET',
'callback' => 'get_hot_comments_simple',
));
}
add_action('rest_api_init', 'register_hot_comments_endpoint_simple');
function get_hot_comments_simple() {
$comments = get_comments(array(
'number' => 50,
'status' => 'approve',
'orderby' => 'comment_date',
'order' => 'DESC',
));
$data = [];
if (empty($comments)) {
return new WP_REST_Response([], 200);
}
foreach ($comments as $comment) {
$avatar_html = zib_get_data_avatar($comment->comment_author_email);
preg_match('/src=["\'](\/\/[^"\']+)["\']/', $avatar_html, $matches);
$avatar_url = !empty($matches[1]) ? 'https:' . $matches[1] : '';
if (!$avatar_url) {
$avatar_url = get_template_directory_uri() . '/img/avatar-default.png';
}
$comment_url = get_comment_link($comment->comment_ID);
$user_url = get_author_posts_url($comment->user_id);
$data[] = [
'post_id' => $comment->comment_post_ID,
'author' => $comment->comment_author,
'content' => $comment->comment_content,
'avatar' => $avatar_url,
'url' => get_permalink($comment->comment_post_ID),
'comment_url' => $comment_url,
'user_url' => $user_url,
];
}
return new WP_REST_Response($data, 200);
}可以手动改首页还是全站展示
$comment_popup_scope = 'home'; // 仅首页
// 或
$comment_popup_scope = 'all'; // 全站显示32.子比主题 – 给文章侧边加一个滚动公告
![图片[33]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-32.png)
将下面的代码放到：WP后台–>>外观–>>小工具–>>自定义HTML代码即可！
<!--子比滚动公告框-->
<style>
@keyframes move {
0% {
transform: translateX(0px);
}
100% {
transform: translateX(-200%);
}
}
.show-notice {
width: 100%;
overflow: hidden;
}
.show-notice-hello {
float: left;
width: 15%;
background-color: var(--theme-color);
}
.show-notice-inner {
float: left;
width: 80%;
margin-left: 2%;
overflow: hidden;
}
.show-notice-move-text {
font-size: 15px;
color: var(--main-color);
white-space: nowrap;
animation: move 10s linear infinite;
}
</style>
<div class="show-notice">
<div class="show-notice-hello badge">哈喽~</div>
<div class="show-notice-inner">
<div class="show-notice-move-text"> 全站积分可通过签到和每日任务获取，可别错过哦！</div>
</div>
</div>
<!--子比滚动公告框-->33.子比主题美化 – 文章卡片三个点美化+代码区块圆点美化
起初是优知新站长发现腾飞博客的卡片上方有三个点，希望找人扒一下，我也去腾飞博客看过了，我发现他是在卡片代码内插入html代码配合css实现的，我一看，我好像给7b2主题写过编辑器增加这三个点的代码，完全可以使用before来实现这个效果，于是就有了上述截图的效果—两个代码都放入css
文章卡片
.posts-item.card::before {
content: "";
display: block;
background: #fc625d;
top: 9px;
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;
}
.posts-item.card {
padding: 26px 10px 10px 10px;
/*注意.posts-item.card没有定位属性 需要把这个注释去掉
position: relative; /* 添加定位属性 */
}代码区块
.enlighter::before {
content: "";
display: block;
background: #fc625d;
top: 9px;
left: 15px;
border-radius: 50%;
width: 15px;
height: 15px;
box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
margin: 0px 2px -7px;
z-index: 1;
position: absolute;
}
.enlighter-overflow-scroll.enlighter-v-standard .enlighter {
padding: 35px 0 12px 0;
}34.子比主题美化 – 文章底部添加更新时间或过期失效提示
![图片[34]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-34.png)
将下面的 PHP 代码加入到主题目录下：themes/zibll/functions.php 文件中。
// 文章过期提示开始第一款
function article_time_update() {
date_default_timezone_set('PRC');
$newdate=time();
$updated_date = get_the_modified_time('Y-m-d H:i:s');
$updatetime=strtotime($updated_date);
$custom_content = '';
if ( $newdate > $updatetime+86400) {
$custom_content= '<div class="article-timeout"><strong><i class="fa fa-bell" aria-hidden="true"></i> 温馨提示：</strong>本文最后更新于<code>'. $updated_date . '</code>，某些文章具有时效性，若有错误或已失效，请在下方<a href="#comment">留言</a>或联系<a target="_blank" title="xx站" href="http://wpa.qq.com/msgrd?v=3&uin=qq号&site=qq&menu=yes"><b>站长</b></a>。</div >';
}
echo $custom_content;
}
add_action('zib_posts_content_before', 'article_time_update');在自定义 CSS 样式添加下面代码
.article-timeout{position:relative; border-radius: 8px; position: relative; margin-bottom: 25px; padding: 10px; background-color: var(--body-bg-color);}35.文章底部加一个商业版权声明
将下面代码放到子比主题设置=>>文章列表=>>文章页面=>>在文章内容后-插入内容
<div class="shangye">本站代码模板仅供学习交流使用请勿商业运营,严禁从事违法,侵权等任何非法活动,否则后果自负！</div>![图片[35]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-35-1024x101.png)
将下面的代码放到自定义CSS即可实现
.shangye {
color: #fff;
background: #5282f7 url(https://img.alicdn.com/imgextra/i2/2210123621994/O1CN01BCJh7X1QbIi6fiBx8_!!2210123621994.png) 3px 7px no-repeat;
border: 1px solid #5282f7;
overflow: hidden;
margin: 10px 0;
padding: 15px 15px 15px 50px;
border-radius: 4px;
}36子比主题 – 文章标题样式美化
![图片[36]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-36.png)
/* 腾飞博客第三款标题样式美化 */
.wp-posts-content>h1.wp-block-heading{
position: relative;
padding: 10px 12px;
display: block;
font-size: 20px;
color: #6297FF;
font-weight: bold;
line-height: 26px;
margin-bottom: 20px;
background: url(https://img.alicdn.com/imgextra/i2/2210123621994/O1CN01Ga7VH11QbIjzNumln_!!2210123621994.png) no-repeat;
background-size: 1000px 1000px;
background-position: -5px -902px;
}
.wp-posts-content>h2.wp-block-heading{
padding: 0px 0px 0px 19px !important;
position: relative;
padding: 10px 12px;
display: block;
font-size: 20px;
color: #6297FF;
font-weight: bold;
line-height: 32px;
margin-bottom: 20px;
background: url(https://img.alicdn.com/imgextra/i2/2210123621994/O1CN01Ga7VH11QbIjzNumln_!!2210123621994.png) no-repeat;
background-size: 1000px 999px;
background-position: -3px -837px;
}
.wp-posts-content>h3.wp-block-heading{
padding: 0px 0px 0px 45px!important;
background: url(https://tfbk.jzpix.cn/wp-content/themes/ZibTF/pic/h3.svg) 10px center no-repeat;
background-size: 30px 20px;
}
.wp-posts-content>h1.wp-block-heading:before{
display:none;
}
.wp-posts-content>h2.wp-block-heading:before{
display:none;
}
.wp-posts-content>h3.wp-block-heading:before{
display:none;
}
37.子比主题 – 首页导航&搜索小工具
![图片[37]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-37-1024x198.png)
![图片[38]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-38-1024x557.png)
将下面的代码放在自己创建一个文件存放，在引入到主题的function.php,如果有fun.php跟价推荐
<?php
Zib_CFSwidget::create('custom_search_nav_widget', [
'title' => 'ZibFOX 搜索+导航组件',
'zib_show' => true,
'description' => '首页顶部搜索框+自定义导航菜单，可动态设置。',
'callback' => 'custom_search_nav_widget',
'fields' => [
[
'id' => 'main_link_text',
'type' => 'text',
'title' => '主导航文字',
'default'=> '解压狐导航',
],
[
'id' => 'main_link_url',
'type' => 'text',
'title' => '主导航链接',
'default'=> 'https://www.example.com',
],
[
'id' => 'main_link_icon',
'type' => 'text',
'title' => '主导航图标URL',
'default'=> 'https://www.mnsin.com/wp-content/uploads/2025/06/logo.png',
],
[
'id' => 'menu_items',
'type' => 'group',
'title' => '导航菜单设置',
'button' => '添加一个菜单项',
'repeatable' => true,
'fields' => [
['id' => 'label', 'type' => 'text', 'title' => '菜单名称'],
['id' => 'url', 'type' => 'text', 'title' => '菜单链接（支持相对路径或完整URL）'],
],
],
],
]);
function custom_search_nav_widget($args, $instance)
{
?>
<?php
$main_link_text = !empty($instance['main_link_text']) ? $instance['main_link_text'] : '解压狐导航';
$main_link_url = !empty($instance['main_link_url']) ? $instance['main_link_url'] : 'https://www.example.com';
$main_link_icon = !empty($instance['main_link_icon']) ? $instance['main_link_icon'] : 'https://www.mnsin.com/wp-content/uploads/2025/06/logo.png';
?>
<div class="tengfei-search-widget-container">
<nav class="tengfei-mini-navbar">
<ul>
<li>
<a href="<?php echo esc_url($main_link_url); ?>" class="tengfei-navbar-main" target="_blank" rel="noopener">
<img src="<?php echo esc_url($main_link_icon); ?>" alt="<?php echo esc_attr($main_link_text); ?>" class="tengfei-navbar-icon" width="18" height="18" />
<?php echo esc_html($main_link_text); ?>
</a>
</li>
<?php if (!empty($instance['menu_items'])) : ?>
<?php foreach ($instance['menu_items'] as $menu) :
$label = esc_html($menu['label']);
$url = esc_url($menu['url']);
?>
<li><a href="<?php echo $url; ?>"><?php echo $label; ?></a></li>
<?php endforeach; ?>
<?php endif; ?>
</ul>
<button id="tengfei-random-jump" type="button" class="tengfei-navbar-heart" title="精选推荐" aria-label="精选推荐">
<span class="tengfei-heart-svg-wrap">
<svg class="tengfei-heart-breath" width="28" height="28" viewBox="0 0 38 38" fill="none">
<defs>
<linearGradient id="heart-gradient-blue" x1="0" y1="0" x2="38" y2="38" gradientUnits="userSpaceOnUse">
<stop stop-color="#7fd8ff" />
<stop offset="1" stop-color="#b2e0ff" />
</linearGradient>
<filter id="heart-glow-blue" x="-20%" y="-20%" width="140%" height="140%">
<feGaussianBlur stdDeviation="2.5" result="coloredBlur" />
<feMerge>
<feMergeNode in="coloredBlur" />
<feMergeNode in="SourceGraphic" />
</feMerge>
</filter>
</defs>
<path filter="url(#heart-glow-blue)" d="M19 34s-11.5-8.5-15-14C1.5 13.5 5 7 12 7c3.5 0 6 2.5 7 4 1-1.5 3.5-4 7-4 7 0 10.5 6.5 8 13-3.5 5.5-15 14-15 14z" fill="url(#heart-gradient-blue)" stroke="#7fd8ff" stroke-width="1.5" />
</svg>
</span>
</button>
</nav>
<form method="get" action="<?php echo esc_url(home_url('/')); ?>">
<div class="tengfei-search-wrapper tengfei-glow-enabled">
<div class="tengfei-search-input-group">
<div class="tengfei-category-select">
<select name="cat" class="tengfei-category-dropdown" aria-label="选择分类">
<option value="">全部分类</option>
<?php
$categories = get_categories(['hide_empty' => false]);
foreach ($categories as $cat) {
echo '<option value="' . esc_attr($cat->term_id) . '">' . esc_html($cat->name) . '</option>';
}
?>
</select>
</div>
<input type="search" class="tengfei-search-input" placeholder="请输入关键词..." value="" name="s" title="搜索内容：" autocomplete="off">
<button type="submit" class="tengfei-search-button" aria-label="提交搜索">
<i class="fa fa-search" aria-hidden="true"></i>
</button>
</div>
</div>
</form>
</div>
<style>
.tengfei-search-widget-container {
width: 100%;
padding: 0;
background: 0 0;
border-radius: 1.3rem;
position: relative;
z-index: 1
}
.tengfei-search-wrapper {
display: flex;
align-items: stretch;
width: 100%;
background: linear-gradient(120deg,#f9fbfd 60%,#f3f7ff 100%);
border-radius: 1.3rem;
box-shadow: 0 4px 24px 0 rgba(22,93,255,.08),0 1.5px 6px 0 rgba(0,0,0,.03);
border: 1.5px solid #e5eaf3;
transition: box-shadow .22s,border-color .22s,background .22s;
overflow: hidden;
min-height: 48px;
margin-bottom: 15px
}
.tengfei-search-wrapper:focus-within,.tengfei-search-wrapper:hover {
box-shadow: 0 8px 32px 0 rgba(22,93,255,.15),0 2px 8px 0 rgba(0,0,0,.06);
border-color: #165dff;
background: linear-gradient(120deg,#f4f8ff 60%,#eaf3ff 100%)
}
.tengfei-search-input-group {
display: flex;
align-items: stretch;
width: 100%
}
.tengfei-category-select {
position: relative;
display: flex;
align-items: center;
background: 0 0;
min-width: 120px;
border-right: 1.5px solid #e5eaf3;
padding: 0 1.5rem 0 1.3rem;
height: 48px
}
.tengfei-category-dropdown {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background: linear-gradient(90deg,#f2f5fa 80%,#eaf3ff 100%);
border: none;
padding: .6rem 2.5rem .6rem 1rem;
font-size: 1.09rem;
color: #165dff;
font-weight: 500;
border-radius: .8rem;
box-shadow: 0 1px 4px 0 rgba(22,93,255,.04);
cursor: pointer;
outline: none;
min-width: 100px;
max-width: 180px;
transition: background .18s,color .18s,box-shadow .18s;
height: 36px;
line-height: 1.2;
z-index: 2;
position: relative;
letter-spacing: .01em
}
.tengfei-category-dropdown:focus,.tengfei-category-dropdown:hover {
background: #eaf3ff;
color: #165dff;
box-shadow: 0 2px 8px 0 rgba(22,93,255,.1)
}
.tengfei-category-dropdown option {
background: #fff;
color: #165dff;
font-size: 1rem
}
.tengfei-category-arrow {
position: absolute;
right: .8rem;
top: 50%;
width: .8em;
height: .8em;
pointer-events: none;
border-left: 2.5px solid #b0b8c9;
border-bottom: 2.5px solid #b0b8c9;
transform: translateY(-50%) rotate(-45deg);
transition: transform .25s cubic-bezier(.4,2,.6,1),border-color .2s;
opacity: .85;
z-index: 3
}
.tengfei-category-select.open .tengfei-category-arrow {
transform: translateY(-50%) rotate(135deg);
border-color: #165dff
}
.tengfei-category-dropdown::-ms-expand {
display: none
}
.tengfei-search-input {
flex: 1;
width: 100%;
padding: .95rem 1.2rem;
font-size: 1.13rem;
color: #222;
border: none;
background: 0 0;
outline: none;
border-radius: 0;
transition: background .18s,box-shadow .18s;
height: 48px;
line-height: 1.2;
font-family: inherit;
letter-spacing: .01em;
display: flex;
align-items: center
}
.tengfei-search-input:focus {
background: #eaf3ff;
box-shadow: 0 2px 8px 0 rgba(22,93,255,.08)
}
.tengfei-search-input::placeholder {
color: #b0b8c9;
font-size: 1rem;
font-weight: 400;
letter-spacing: .02em;
opacity: .95
}
.tengfei-search-button {
display: flex;
align-items: center;
justify-content: center;
padding: 0 1.7rem;
border: none;
border-radius: 0 1.3rem 1.3rem 0;
background: linear-gradient(90deg,#165dff 0%,#4f8aff 100%);
color: #fff;
font-size: 1.25rem;
font-weight: 600;
cursor: pointer;
transition: background .18s,box-shadow .18s,filter .18s;
outline: none;
min-width: 56px;
height: 48px;
border-left: 1.5px solid #e5eaf3;
box-shadow: none;
filter: brightness(.98);
letter-spacing: .02em;
margin: 0
}
.tengfei-search-button i.fa {
font-size: 1.25rem
}
.tengfei-search-button:hover,.tengfei-search-button:focus {
background: linear-gradient(90deg,#4f8aff 0%,#165dff 100%);
filter: brightness(1.1);
box-shadow: none;
border-left: 1.5px solid #165dff
}
.tengfei-search-input,.tengfei-search-button {
height: 48px;
line-height: 48px;
box-sizing: border-box
}
.tengfei-category-dropdown option:checked,.tengfei-category-dropdown option[selected] {
background: #eaf3ff;
color: #165dff
}
@media (max-width: 600px) {
.tengfei-search-wrapper {
border-radius:.9rem;
min-height: 40px
}
.tengfei-category-select {
min-width: 80px;
padding-left: .6rem;
padding-right: .6rem;
height: 40px
}
.tengfei-search-button {
padding: 0 1rem;
border-radius: 0 .9rem .9rem 0;
min-width: 40px;
height: 40px
}
.tengfei-search-input {
padding: .7rem;
font-size: 1rem;
height: 40px;
line-height: 40px
}
.tengfei-category-dropdown {
font-size: .98rem;
height: 30px
}
.tengfei-search-input,.tengfei-search-button {
height: 40px;
line-height: 40px
}
}
body.dark-theme .tengfei-search-wrapper {
background: linear-gradient(120deg,#232946 60%,#1a1a2e 100%);
border-color: #232946;
box-shadow: 0 2px 12px 0 rgba(22,93,255,.13),0 1.5px 6px 0 rgba(0,0,0,.1)
}
body.dark-theme .tengfei-category-select {
border-right: 1.5px solid #232946
}
body.dark-theme .tengfei-category-dropdown,body.dark-theme .tengfei-category-dropdown option {
color: #8ecfff;
background: #232946
}
body.dark-theme .tengfei-search-input {
color: #fff;
background: 0 0
}
body.dark-theme .tengfei-search-input:focus {
background: #1a1a2e
}
body.dark-theme .tengfei-search-input::placeholder {
color: #8ecfff
}
body.dark-theme .tengfei-search-button {
background: linear-gradient(90deg,#4f8aff 0%,#165dff 100%);
color: #fff;
border-left: 1.5px solid #232946
}
body.dark-theme .tengfei-search-button:hover,body.dark-theme .tengfei-search-button:focus {
background: linear-gradient(90deg,#165dff 0%,#4f8aff 100%);
filter: brightness(1.08);
border-left: 1.5px solid #165dff
}
.tengfei-mini-navbar {
margin-bottom: 10px;
margin-top: 0;
padding: 0 14px;
background: linear-gradient(90deg,#e0e7ff 0%,#f0fdfa 100%);
border-radius: 1.5em;
box-shadow: 0 4px 24px 0 rgba(22,93,255,.08);
display: flex;
justify-content: space-between;
align-items: center;
min-height: 44px;
overflow-x: auto;
border: 1px solid #e5e7eb
}
.tengfei-mini-navbar ul {
display: flex;
flex-wrap: nowrap;
gap: .7em;
list-style: none;
margin: 0;
padding: 0
}
.tengfei-mini-navbar li {
flex: 0 0 auto
}
.tengfei-mini-navbar a {
display: flex;
align-items: center;
padding: .38em 1.3em;
border-radius: 1em;
color: #165dff;
font-size: 1.08em;
font-weight: 600;
text-decoration: none;
background: rgba(255,255,255,.85);
box-shadow: 0 1px 4px 0 rgba(22,93,255,.03);
transition: background .5s cubic-bezier(.4,2,.6,1),color .5s cubic-bezier(.4,2,.6,1),box-shadow .5s cubic-bezier(.4,2,.6,1),transform .3s;
position: relative;
z-index: 1
}
.tengfei-mini-navbar a:hover,.tengfei-mini-navbar a:focus {
background: linear-gradient(90deg,#165dff 0%,#4f8aff 100%);
color: #fff;
box-shadow: 0 4px 16px 0 rgba(22,93,255,.13);
transform: translateY(-2px) scale(1.04)
}
.tengfei-navbar-main {
background: linear-gradient(90deg,#165dff 0%,#4f8aff 100%) !important;
color: #fff !important;
font-weight: 700;
box-shadow: 0 2px 8px 0 rgba(22,93,255,.13);
border: none;
margin-right: .5em;
padding-left: 1.1em;
padding-right: 1.1em
}
.tengfei-navbar-main:hover,.tengfei-navbar-main:focus {
background: linear-gradient(90deg,#4f8aff 0%,#165dff 100%) !important;
color: #fff;
box-shadow: 0 6px 18px 0 rgba(22,93,255,.18);
transform: translateY(-2px) scale(1.06)
}
.tengfei-navbar-icon {
width: 18px;
height: 18px;
border-radius: 50%;
margin-right: 6px;
margin-left: -4px;
box-shadow: 0 1px 4px 0 rgba(22,93,255,.1);
background: #fff;
object-fit: cover;
display: inline-block;
vertical-align: middle
}
.tengfei-navbar-heart {
margin-left: 1.2em;
padding: .38em 1.1em;
background: 0 0 !important;
box-shadow: none !important;
border-radius: 1em;
display: flex;
align-items: center;
transition: background .3s,box-shadow .3s;
position: relative;
cursor: pointer
}
.tengfei-navbar-heart .tengfei-heart-svg {
display: flex;
align-items: center;
justify-content: center;
transition: transform .4s cubic-bezier(.4,2,.6,1);
will-change: transform,filter
}
.tengfei-navbar-heart:hover .tengfei-heart-svg,.tengfei-navbar-heart:focus .tengfei-heart-svg {
transform: scale(1.18) rotate(-8deg);
filter: drop-shadow(0 0 12px #ff6a8888);
animation: heart-beat .5s
}
.tengfei-navbar-heart svg {
display: block
}
@keyframes heart-beat {
0% {
transform: scale(1) rotate(-8deg)
}
20% {
transform: scale(1.25) rotate(-8deg)
}
40% {
transform: scale(1.1) rotate(-8deg)
}
60% {
transform: scale(1.22) rotate(-8deg)
}
100% {
transform: scale(1.18) rotate(-8deg)
}
}
@media (max-width: 600px) {
.tengfei-mini-navbar {
display:none !important
}
}
.tengfei-navbar-heart {
margin-left: 1.2em;
padding: .38em 1.1em;
background: 0 0 !important;
box-shadow: none !important;
border-radius: 1em;
display: flex;
align-items: center;
transition: background .3s,box-shadow .3s;
position: relative;
cursor: pointer;
outline: none;
border: none;
font: inherit
}
.tengfei-navbar-heart:focus {
outline: none;
box-shadow: 0 0 0 2px #b2e0ff
}
.tengfei-heart-svg-wrap {
display: flex;
align-items: center;
justify-content: center;
position: relative
}
.tengfei-heart-breath {
display: block;
width: 28px;
height: 28px;
animation: heart-breath 1.6s cubic-bezier(.4,2,.6,1) infinite;
will-change: transform,filter
}
.tengfei-navbar-heart:hover .tengfei-heart-breath,.tengfei-navbar-heart:focus .tengfei-heart-breath {
filter: drop-shadow(0 0 16px #7fd8ff88);
animation-play-state: paused;
transform: scale(1.15)
}
@keyframes heart-breath {
0% {
transform: scale(1)
}
20% {
transform: scale(1.13)
}
40% {
transform: scale(1.22)
}
60% {
transform: scale(1.13)
}
100% {
transform: scale(1)
}
}
.tengfei-mini-navbar {
overflow-x: auto;
-ms-overflow-style: none;
scrollbar-width: none;
}
.tengfei-mini-navbar::-webkit-scrollbar {
display: none;
}
</style>
<script>
const tf_random_hot_url = "<?php echo esc_url(get_top_10_random_post_url()); ?>";
document.getElementById('tengfei-random-jump').addEventListener('click', function () {
if (typeof tf_random_hot_url !== 'undefined') {
window.location.href = tf_random_hot_url;
}
});
</script>
<?php
}
function get_top_10_random_post_url() {
$args = [
'post_type' => 'post',
'posts_per_page' => 10,
'orderby' => 'meta_value_num',
'meta_key' => 'views', // 请根据你统计阅读量用的字段名修改
'date_query' => [
[
'after' => '30 days ago'
]
],
];
$query = new WP_Query($args);
$urls = [];
if ($query->have_posts()) {
foreach ($query->posts as $post) {
$urls[] = get_permalink($post->ID);
}
}
if (!empty($urls)) {
return $urls[array_rand($urls)]; // 随机返回一个
}
return home_url(); // 没有结果时跳转首页
}38.子比主题 – 首页自定义动态分类标题
![图片[39]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-39-1024x473.png)
这个代码我说一下，代码放到：子比主题–>>自定义CSS样式，这个如果放到自定义样式的话他是全局显示，什么意思呢，就是连文章页面那个下面也是这样的样式，如果你只想在首页显示的话，我建议你可以自己在服务器创建一个css文件放进去然后引入一下文件，引入到/wp-content/themes/zibll/index.php这个文件
代码里面用的是我的动图，你可以换成你自己的，都可以！
.box-body.notop {
background:var(--main-bg-color);
padding:5px;
padding-left:1.2em;
border-radius:10px;
margin-bottom:10px;
}
.title-theme {
position:relative;
padding-left:1.3em;
font-size:20px;
margin:5px;
}
.title-theme::before {
content:'';
top:-30px;
width:64px;
height:64px;
left:-32px;
background:url(https://www.tfbkw.com/wp-content/themes/ZibTF/img/qiqiu.gif);
box-shadow:0 0 black;
background-size:cover;
}
.title-theme small {
font-size:60%;
margin-left:20px;
}
.title-theme .ml10::before {
position:absolute;
content:'';
width:1px;
background:var(--theme-color);
top:30%;
left:115px;
bottom:16%;
}39子比主题 – 用户信息小工具底部两个按钮美化
![图片[40]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-40.png)
直接到子比后台设置-自定义CSS样式中添加以下代码：
.user-btns {
margin-top: 20px !important;
display: flex;
justify-content: center;
align-items: center;
gap: 14px;
flex-wrap: wrap;
padding-bottom: 4px;
}
.user-btns .btn-newadd, .user-btns .jb-pink {
background: linear-gradient(90deg,#ff92ac 0,#fd6dcb 100%);
color: #fff !important;
border: none !important;
}
.user-btns a, .user-btns .but {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 90px;
padding: 0 22px;
height: 36px;
line-height: 36px;
border-radius: 20px;
font-size: 15px;
font-weight: 600;
box-shadow: 0 2px 10px rgba(66,140,225,.06);
transition: all .18s;
border: none;
cursor: pointer;
outline: none;
text-decoration: none;
text-align: center;
white-space: nowrap;
opacity: 1;
margin: 0 !important;
}
.user-btns .jb-blue {
background: linear-gradient(90deg,#40a6fa 0,#356aef 100%);
color: #fff !important;
border: none !important;
}
40子比主题 新用户注册自动用指定 ID 发送私信
![图片[41]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-41-1024x464.png)
将下面的代码放到：/wp-content/themes/zibll/func.php，func文件没有自己创建一个，要记得加php头，要不然不生效，代码里面的 $send_user_id = 1; 这个代码是指定用户ID，自己想让谁给新用户发信息就指定用户ID就行！
/**
* 新用户注册时自动用id为1的用户发送私信
*/
function auto_send_private($new_user_id) {
// 检查是否是新用户，并确保用户ID为1存在
$send_user_id = 1; // 假设用户1存在
// 获取私信内容
$msg_content = '欢迎新用户注册！';
// 定义私信参数
$msg_args = array(
'send_user' => $send_user_id,
'receive_user' => $new_user_id, // 新用户ID
'content' => $msg_content,
'parent' => '',
'status' => '',
'meta' => '',
'other' => '',
);
// 发送私信
$msg = Zib_Private::add($msg_args);
}
add_action('user_register', 'auto_send_private');41子比主题 – 侧栏动态时钟与问候语小工具（腾飞）
一个实用又美观的动态时钟和问候语提醒功能，不仅为博客增添人情味，还能与子比主题的深色模式完美兼容！
![图片[42]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-42.png)
直接将下面的代码放到：WP后台–>>外观–>>小工具–>>自定义HTML代码即可！
<div class="dynamic-greeting">
<div class="time-section">
<div class="time-display">
<span id="hours">00</span>
<span class="colon">:</span>
<span id="minutes">00</span>
<span class="colon">:</span>
<span id="seconds">00</span>
</div>
<div class="date-display" id="date"></div>
</div>
<div class="greeting-section">
<div class="greeting-text" id="greeting"></div>
<div class="greeting-tip" id="tip"></div>
</div>
</div>
<style>
.dynamic-greeting {background: linear-gradient(145deg, #ffffff, #f0f0f0);border-radius: 15px;padding: 20px;box-shadow: 5px 5px 15px rgba(0,0,0,0.1), -5px -5px 15px rgba(255,255,255,0.8);margin: 20px 0;transition: all 0.3s ease;}.dynamic-greeting:hover {transform: translateY(-2px);box-shadow: 7px 7px 20px rgba(0,0,0,0.12), -7px -7px 20px rgba(255,255,255,0.9);}.time-section {text-align: center;margin-bottom: 15px;padding-bottom: 15px;border-bottom: 1px solid rgba(0,0,0,0.05);}.time-display {font-size: 2.5em;font-weight: 700;color: #007AFF;font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, sans-serif;text-shadow: 2px 2px 4px rgba(0,0,0,0.1);}.time-display .colon {animation: blink 1s infinite;opacity: 1;}@keyframes blink {50% {opacity: 0;}}.date-display {font-size: 1em;color: #666;margin-top: 5px;}.greeting-section {padding: 10px;background: rgba(255,255,255,0.7);border-radius: 10px;}.greeting-text {font-size: 1.2em;color: #333;font-weight: 600;margin-bottom: 8px;}.greeting-tip {font-size: 0.9em;color: #666;line-height: 1.5;}body.dark-theme .dynamic-greeting {background: linear-gradient(145deg, #2d2d2d, #1a1a1a);box-shadow: 5px 5px 15px rgba(0,0,0,0.3), -5px -5px 15px rgba(255,255,255,0.05);}body.dark-theme .time-display {color: #0A84FF;}body.dark-theme .greeting-section {background: rgba(0,0,0,0.2);}body.dark-theme .greeting-text {color: #fff;}body.dark-theme .greeting-tip, body.dark-theme .date-display {color: #999;}
</style>
<script>
function updateTime(){const now=new Date();const hours=now.getHours().toString().padStart(2,'0');const minutes=now.getMinutes().toString().padStart(2,'0');const seconds=now.getSeconds().toString().padStart(2,'0');document.getElementById('hours').textContent=hours;document.getElementById('minutes').textContent=minutes;document.getElementById('seconds').textContent=seconds;const options={weekday:'long',year:'numeric',month:'long',day:'numeric'};document.getElementById('date').textContent=now.toLocaleDateString('zh-CN',options)}function updateGreeting(){fetch('https://api.ahfi.cn/api/getGreetingMessage?type=json').then(response=>response.json()).then(data=>{if(data.code===200){document.getElementById('greeting').textContent=data.data.greeting;document.getElementById('tip').textContent=data.data.tip}}).catch(error=>{console.error('获取问候语失败:',error);const hour=new Date().getHours();let defaultGreeting='';if(hour<6)defaultGreeting='凌晨好';else if(hour<11)defaultGreeting='早上好';else if(hour<14)defaultGreeting='中午好';else if(hour<18)defaultGreeting='下午好';else defaultGreeting='晚上好';document.getElementById('greeting').textContent=defaultGreeting;document.getElementById('tip').textContent='愿你今天心情愉快！'})}document.addEventListener('DOMContentLoaded',function(){updateTime();updateGreeting();setInterval(updateTime,1000);setInterval(updateGreeting,60000);if(document.documentElement.getAttribute('data-theme')==='dark'){document.body.classList.add('dark-theme')}});
</script>42子比主题 – 侧边倒计时促销小工具（腾飞）
![图片[43]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-43-1024x365.png)
跟着我的教程走，别走偏了，先看我怎么说的，再去操作，这个小工具跟我以前发的教程一模一样
首先我们第一步：/wp-content/themes/zibll/func.php文件，如果没有这个文件自己创建在子比目录创建一个，创建之后记得加php头，要不然会报错！加如下面的代码，我会详细说这个
$widgets_files = array(
'tengfei_sale.php', /*小工具文件名*/
);
foreach ($widgets_files as $file) {
require get_template_directory() . '/tengfei/widgets/' . $file;
}将上面的代码放到/wp-content/themes/zibll/func.php文件，都是一样的，看上面的代码，别看懵逼了，我们要明白这个：tengfei_sale.php这个代码，这个代码就是代表一个小工具的名字，相当于就是用上面的代码调用的，就是如果想加第二个小工具，那就是在tengfei_sale.php这个代码下面加一行其他小工具的别名，我说的已经很仔细了，不懂问站长，文件放底部
附件上传到：/wp-content/themes/zibll解压即可！
子比主题侧边倒计时促销小工具附件
提取码:9k9y
43.子比主题美化 – 付费详情说明模块
![图片[44]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-44-1024x462.png)
![图片[45]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-45.png)
网站后台->Zibll主题设置->商城&付费->商城配置->更多详情，输入需要显示的文字。
![图片[46]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-46.png)
CSS代码
网站后台->Zibll主题设置->全局&功能->自定义代码->自定义CSS样式
/*付费详情说明模块美化 huliku.com*/
.pay-box .pay-details {
background-image: url(图片链接);
color: #fff;
text-align: center;
background-size: cover;
}图片：https://img.alicdn.com/imgextra/i3/2934847733/O1CN0123c7o426zljQUqHlZ_!!2934847733.png
44子比主题 – 首页底部统计小工具
![图片[47]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-47-1024x773.png)
跟着我的教程走，别走偏了，先看我怎么说的，再去操作，这个小工具跟我以前发的教程一模一样
首先我们第一步：/wp-content/themes/zibll/func.php文件，如果没有这个文件自己创建在子比目录创建一个，创建之后记得加php头，要不然会报错！加如下面的代码，我会详细说这个
$widgets_files = array(
'tengfei_tongji.php', /*小工具文件名*/
);
foreach ($widgets_files as $file) {
require get_template_directory() . '/tengfei/widgets/' . $file;
}将上面的代码放到/wp-content/themes/zibll/func.php文件，都是一样的，看上面的代码，别看懵逼了，我们要明白这个：tengfei_tongji.php这个代码，这个代码就是代表一个小工具的名字，相当于就是用上面的代码调用的，就是如果想加第二个小工具，那就是在tengfei_tongji.php这个代码下面加一行其他小工具的别名，我说的已经很仔细了，不懂问站长，文件放底部
附件上传到：/wp-content/themes/zibll解压即可！
首页底部统计小工具
提取码:9k9y
45.子比主题 – ajax加载更多按钮美化
![图片[48]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-49-1024x473.png)
将下面代码放到：子比主题–>>自定义CSS样式即可
/*点击更多*/
.chat-next a, .theme-pagination .ajax-next a, .theme-pagination .order-ajax-next a {
color: var(--muted-color);
border-radius: 30px;
padding: 6px 0px;
background-color: var(--main-bg-color);
display: block;
opacity: 1;
font-weight: bold;
width: 35%;
margin: auto;
border: 2px solid #fd7979;
border-style: dashed;
box-shadow: 0 0 4px 9px var(--main-bg-color);
}
.chat-next a:hover, .theme-pagination .ajax-next a:hover, .theme-pagination .order-ajax-next a:hover {
opacity: 1;
color: #ff7676;
background-color: #ffffff;
box-shadow: 0 0 4px 9px #ffffff00;
border: 2px solid #fb6363cc;
background: linear-gradient(rgb(237 111 0 / 0%), rgb(255 244 244 / 0%)), url(https://img.alicdn.com/imgextra/i3/2210123621994/O1CN01CBy1O11QbIhi0TbrM_!!2210123621994.png) no-repeat 70% 100%/ 12% 100%;
}46.子比主题 – 单行文章列表仿MACGF美化版
![图片[49]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-50-1024x627.png)
部署下方代码到主题func.php，没有func.php新建一个
add_action('widgets_init', 'widget_register_DearLicyonepost');
function widget_register_DearLicyonepost()
{
register_widget('widget_ui_DearLicy_oneposts');
}
class widget_ui_DearLicy_oneposts extends WP_Widget
{
public function __construct()
{
$widget = array(
'w_id' => 'widget_ui_DearLicy_oneposts',
'w_name' => 'A定制·单行文章列表',
'classname' => '',
'description' => '显示文章列表，只显示一行，自动横向滚动',
);
parent::__construct($widget['w_id'], $widget['w_name'], $widget);
}
public function widget($args, $instance)
{
if (!zib_widget_is_show($instance)) {
return;
}
extract($args);
$defaults = array(
'title' => '',
'mini_title' => '',
'more_but' => '更多<i class="fa fa-angle-right fa-fw"></i>',
'more_but_url' => '',
'in_affix' => '',
'type' => 'auto',
'limit' => 6, 'limit_day' => '',
'topics' => '',
'cat' => '',
'orderby' => 'views',
);
$instance = wp_parse_args((array) $instance, $defaults);
$orderby = $instance['orderby'];
$mini_title = $instance['mini_title'];
if ($mini_title) {
$mini_title = '<span class="title__sub-name">' . $mini_title . '</span>';
}
$title = $instance['title'];
$more_but = '';
if ($instance['more_but'] && $instance['more_but_url']) {
$more_but = '<div class="header__btn-wrapper"><a href="' . $instance['more_but_url'] . '" class="button---AUM5ZP text---pn4pHz medium---OGt5iw header__btn">' . $instance['more_but'] . '</a></div>';
}
$mini_title .= $more_but;
if ($title) {
$title = '<div class="training-camp__header"><div class="header__title-wrapper">' . $title . '</div>' . $mini_title . '</div>';
}
$in_affix = $instance['in_affix'] ? ' data-affix="true"' : '';
echo '<div' . $in_affix . ' class="theme-box">';
// echo '<pre>'.json_encode($instance).'</pre>';
$args = array(
'post_status' => 'publish',
'cat' => str_replace('，', ',', $instance['cat']),
'order' => 'DESC',
'showposts' => $instance['limit'],
'no_found_rows' => true, //不需要分页，不查询分页需要的总数量
'ignore_sticky_posts' => 1,
);
if ($orderby !== 'views' && $orderby !== 'favorite' && $orderby !== 'like') {
$args['orderby'] = $orderby;
} else {
$args['orderby'] = 'meta_value_num';
$args['meta_query'] = array(
array(
'key' => $orderby,
'order' => 'DESC',
),
);
}
if ($instance['topics']) {
$args['tax_query'] = array(
array(
'taxonomy' => 'topics',
'terms' => preg_split("/,|，|\s|\n/", $instance['topics']),
),
);
}
if ($instance['limit_day'] > 0) {
$current_time = current_time('Y-m-d H:i:s');
$args['date_query'] = array(
array(
'after' => date('Y-m-d H:i:s', strtotime("-" . $instance['limit_day'] . " day", strtotime($current_time))),
'before' => $current_time,
'inclusive' => true,
),
);
}
$list_args = array(
'type' => 'card',
);
$the_query = new WP_Query($args);
echo '<section class="sec-wrapper index-center-block training-camp__wrapper">';
echo $title;
echo '<div class="sec-bd">';
echo '<div class="swiper-container swiper-scroll" data-slideClass="posts-item">';
echo '<div class="swiper-wrapper">';
zib_posts_list($list_args, $the_query);
echo '</div>';
echo '<div class="swiper-button-prev"></div><div class="swiper-button-next"></div>';
echo '</div>';
echo '</section>';
echo '</div>';
}
public function form($instance)
{
$defaults = array(
'title' => '<div class="title__img-wrapper"><img draggable="false" oncontextmenu="return false;" src="https://www.macgf.com/img/macyingyong.svg" alt="MAC应用" class="title-macyingyong"></div>',
'mini_title' => '',
'more_but' => '更多<i class="fa fa-angle-right fa-fw"></i>',
'more_but_url' => '',
'in_affix' => '',
'limit' => 6, 'limit_day' => '',
'type' => 'auto',
'topics' => '',
'cat' => '',
'orderby' => 'views',
);
$instance = wp_parse_args((array) $instance, $defaults);
$page_input[] = array(
'name' => __('标题：', 'zib_language'),
'id' => $this->get_field_name('title'),
'std' => $instance['title'],
'style' => 'margin: 10px auto;',
'type' => 'text',
);
$page_input[] = array(
'name' => __('副标题：', 'zib_language'),
'id' => $this->get_field_name('mini_title'),
'std' => $instance['mini_title'],
'style' => 'margin: 10px auto;',
'type' => 'text',
);
$page_input[] = array(
'name' => __('标题右侧按钮->文案：', 'zib_language'),
'id' => $this->get_field_name('more_but'),
'std' => $instance['more_but'],
'style' => 'margin: 10px auto;',
'type' => 'text',
);
$page_input[] = array(
'name' => __('标题右侧按钮->链接：', 'zib_language'),
'id' => $this->get_field_name('more_but_url'),
'std' => $instance['more_but_url'],
'desc' => '设置为任意链接',
'style' => 'margin: 10px auto;',
'type' => 'text',
);
echo zib_get_widget_show_type_input($instance, $this->get_field_name('show_type'));
echo zib_edit_input_construct($page_input);
?>
<p>
<label>
<input style="vertical-align:-3px;margin-right:4px;" class="checkbox" type="checkbox" <?php checked($instance['in_affix'], 'on');?> id="<?php echo $this->get_field_id('in_affix'); ?>" name="<?php echo $this->get_field_name('in_affix'); ?>"> 侧栏随动（仅在侧边栏有效）
</label>
</p>
<p>
<?php zib_cat_help()?>
<input style="width:100%;" id="<?php echo $this->get_field_id('cat');
?>" name="<?php echo $this->get_field_name('cat');
?>" type="text" value="<?php echo str_replace('，', ',', $instance['cat']);
?>" size="24" />
</p>
<p>
<?php zib_topics_help()?>
<input style="width:100%;" id="<?php echo $this->get_field_id('topics');
?>" name="<?php echo $this->get_field_name('topics');
?>" type="text" value="<?php echo $instance['topics'];
?>" size="24" />
</p>
<p>
<label>
显示数目：
<input style="width:100%;" id="<?php echo $this->get_field_id('limit');
?>" name="<?php echo $this->get_field_name('limit');
?>" type="number" value="<?php echo $instance['limit'];
?>" size="24" />
</label>
</p>
<p>
<label>
限制时间（最近X天）：
<input style="width:100%;" name="<?php echo $this->get_field_name('limit_day') ?>" type="number" value="<?php echo $instance['limit_day'] ?>" size="24" />
</label>
</p>
<p>
<label>
排序方式：
<select style="width:100%;" id="<?php echo $this->get_field_id('orderby');
?>" name="<?php echo $this->get_field_name('orderby');
?>">
<option value="comment_count" <?php selected('comment_count', $instance['orderby']);
?>>评论数</option>
<option value="views" <?php selected('views', $instance['orderby']);
?>>浏览量</option>
<option value="like" <?php selected('like', $instance['orderby']);
?>>点赞数</option>
<option value="favorite" <?php selected('favorite', $instance['orderby']);
?>>收藏数</option>
<option value="comment_count" <?php selected('sales_volume', $instance['orderby']);
?>>销售数量</option>
<option value="date" <?php selected('date', $instance['orderby']);
?>>发布时间</option>
<option value="modified" <?php selected('modified', $instance['orderby']);
?>>更新时间</option>
<option value="rand" <?php selected('rand', $instance['orderby']);
?>>随机排序</option>
</select>
</label>
</p>
<?php
}
}CSS代码
里面有张图片，需要自己下载下来换成自己的
/* 单行文章列表美化——开始 */
.sec-wrapper {
margin-bottom: 10px;
}
.training-camp__wrapper {
--green-1: #cff0fb;
--green-2: #cbf4e4;
--green-3: #22ab80;
--gray-1: #667280;
--white-1: #fff;
--white-2: #f5f7fa;
background-image: linear-gradient(150deg,var(--green-1) 20%,var(--green-2) 40%);
padding: 0 12px 12px;
border-radius: 16px;
}
button.button---AUM5ZP.text---pn4pHz.medium---OGt5iw.header__btn {
background: #ffffff00;
border: 1px solid #fc3c2d00;
border-radius: 0px;
}
.training-camp__wrapper .training-camp__header {
padding: 24px 0 24px 12px;
display: -webkit-flex;
display: flex;
gap: 18px;
background: url(https://www.macgf.com/img/kuangwenlu.png) 100% 0/433px 126px no-repeat;
}
.training-camp__wrapper .header__title-wrapper {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
gap: 0px;
}
.training-camp__wrapper .title__img-wrapper {
height: 20px;
}
.training-camp__wrapper .header__btn-wrapper {
margin-left: auto;
display: -webkit-flex;
display: flex;
}
.training-camp__wrapper .header__btn-wrapper button[class*=button---] {
height: 20px;
line-height: 20px;
padding: 0 12px;
}
.training-camp__wrapper .header__btn {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
font-size: 14px;
color: var(--green-3);
}
.medium---OGt5iw {
height: 36px;
padding: 8px 24px;
font-size: 14px;
}
.outlined---BKvHAe, .text---pn4pHz {
background-color: initial;
color: #3e454d;
}
.button---AUM5ZP {
position: relative;
display: inline-block;
height: 36px;
padding: 8px 24px;
border-radius: 22px;
cursor: pointer;
border: unset;
font-size: 14px;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.ke-icon---zeGrGg+i {
display: inline-block;
vertical-align: middle;
}
.training-camp__wrapper>div.sec-bd {
background-color: var(--white-1);
gap: 12px;
}
.sec-wrapper .sec-bd {
position: relative;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
gap: 24px;
}
.training-camp__wrapper .sec-bd {
padding: 12px;
border-radius: 16px;
}
img.title-macyingyong {
/* width: 120px; */
height: 50px;
}
/* 单行文章列表美化——结束 */47.子比主题 – 用户封禁小黑屋源码
![图片[50]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-51-1024x743.png)
- 将xy_block.php放到子比主题里 ：/wp-content/themes/zibll/
- 将block_banned.php放到子比主题的pages文件里 ：/wp-content/themes/zibll/pages
- 在functions.php引入文件代码如下
if (file_exists(get_theme_file_path('/xy_block.php'))) {
require_once get_theme_file_path('/xy_block.php');
}然后在网站后台新建页面，在默认模板里找到 XY-用户封禁-然后发布，小工具找到 Zibll用户封禁情况 然后填写信息发布（这里建议放在侧边栏），如下图
![图片[51]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-52.png)
zibll小黑屋
提取码:9k9y
48.子比主题美化-独立下载页美化样式
![图片[52]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-53.png)
![图片[53]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-54.png)
这次我直接都弄好，你们直接搞就行，将下面的代码复制出来，然后在/wp-content/themes/zibll/pages/
将下面代码替换掉download.php文件，上面这些听不懂？那我说个更简单的吧，就是子比主题默认是有这个下载页面，我们只需要把下面代码复制，然后找到默认的下载页面把里面的代码删掉，把下面复制的代码填进去保存即可。
在这之前我们要在：子比主题–>>商城配置–>>商品功能配置，我们要将独立下载页打开，然后将下面的代码放到你刚才新建的文件里，自己改一下里面的内容吧
<?php
/**
* Template name: YM-资源下载
* Description: YM-独立资源下载页面
*/
if (empty($_GET['post'])) {
get_header();
get_template_part('template/content-404');
get_footer();
exit;
}
get_header();
$post_id = $_GET['post'];
function zibpay_get_down_html($post_id)
{
$pay_mate = get_post_meta($post_id, 'posts_zibpay', true);
$html = '';
if (empty($pay_mate['pay_type']) || empty($pay_mate['pay_type']) || $pay_mate['pay_type'] != '2') {
return get_template_part('template/content-404');
};
//文章略缩图
$thumbnail = zib_post_thumbnail('full', '', true, $post_id);
// 查询是否已经购买
$paid_obj = zibpay_is_paid($post_id);
$posts_title = get_the_title($post_id) . get_post_meta($post_id, 'subtitle', true);
$pay_title = !empty($pay_mate['pay_title']) ? $pay_mate['pay_title'] : $posts_title;
$pay_doc = $pay_mate['pay_doc'];
$pay_details = $pay_mate['pay_details'];
$user_qx = zibpay_get_post_down_buts($pay_mate, $paid_obj['paid_type'], $post_id);
if ($paid_obj) {
//已经购买直接显示下载盒子
$paid_name = zibpay_get_paid_type_name($paid_obj['paid_type']);
$paid_name2 = '<badge class="img-badge left jb-red" style="z-index: 2;font-size: 12px;padding: 2px 10px;line-height: 1.4;" img-badge="" left=""><i class="fa fa-check mr6" aria-hidden="true"></i>' . $paid_name . '</badge>';
if($paid_name =='推广会员免费'||$paid_name =='代理会员免费'){
$dowmbox = '<div style="/*margin-bottom:3em;*/">' . $user_qx . '</div>';
}else{
$dowmbox = '<div style="/*margin-bottom:3em;*/"><span class="badg c-red btn-block">免费资源不占用会员的免费下载次数</span>' . $user_qx . '</div>';
}
$pay_extra_hide = !empty($pay_mate['pay_extra_hide']) ? '<div class="pay-extra-hide">' . $pay_mate['pay_extra_hide'] . '</div>' : '';
if ($paid_obj['paid_type'] == 'free' && _pz('pay_free_logged_show') && !is_user_logged_in()) {
$dowmbox = '<div class="alert jb-yellow em12" style="margin: 2em 0;"><b>免费资源，请登录后下载</b></div>';
$pay_extra_hide = '<div class="text-center pay-extra-hide">';
$pay_extra_hide .= '<p class="box-body muted-2-color">请先登录！</p>';
$pay_extra_hide .= '<p>';
$pay_extra_hide .= '<a href="javascript:;" class="signin-loader but jb-blue padding-lg"><i class="fa fa-fw fa-sign-in mr10" aria-hidden="true"></i>登录</a>';
$pay_extra_hide .= '<a href="javascript:;" class="signup-loader ml10 but jb-yellow padding-lg"><i data-class="icon mr10" data-viewbox="0 0 1024 1024" data-svg="signup" aria-hidden="true"></i>注册</a>';
$pay_extra_hide .= '</p>';
$pay_extra_hide .= zib_social_login(false);
$pay_extra_hide .= '</div>';
}
$html = '<div class="download-demo">';
$html .= '<div class="download-xiyang"><div class="download-right">';
/*获取文章略缩图*/
$html .= '<div class="download-sty item-thumbnail">' . $paid_name2 . '<img src="'.$thumbnail.'" /></div>';
$html .= '<span class="display">' . $paid_name2 . '</span><div class="article-header download-theme-box"><div class="article-title" style="margin-top: 0;"><span class="download-file-name"></span><a href="' . get_permalink($post_id) . '#posts-pay">' . $pay_title . '</a></div></div>';
$html .= '<div>' . $pay_doc . '</div>';
$html .= '<div class="muted-2-color em09">' . $pay_details . '</div>';
$html .= '<div>' . $dowmbox . $pay_extra_hide . '</div></div>';
$html .= '</div></div>';
} else {
//未购买
$html = '<div class="article-header theme-box"><div class="article-title"><a href="' . get_permalink($post_id) . '#posts-pay">' . $pay_title . '</a></div></div>';
$html .= '<div>' . $pay_doc . '</div>';
$html .= '<div class="muted-2-color em09" style="margin: 2em 0;">' . $pay_details . '</div>';
$html .= '<div class="alert jb-red em12" style="margin: 2em 0;"><b>暂无下载权限</b></div>';
$html .= '<a style="margin-bottom: 2em;" href="' . get_permalink($post_id) . '#posts-pay" class="but jb-yellow padding-lg"><i class="fa fa-long-arrow-left" aria-hidden="true"></i><span class="ml10">返回文章</span></a>';
}
return $html;
}
?>
<style>
#smcos_mhz {
color: #555555;
overflow: hidden;
margin: 10px 0;
padding: 15px 15px 15px 35px;
box-shadow: 6px 0 12px -5px rgb(190,196,252), -6px 0 12px -5px rgb(189,196,252);
background: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%);
}
#smcos_tkzj {
color: #555555;
overflow: hidden;
margin: 10px 0;
padding: 15px 15px 15px 35px;
box-shadow: 6px 0 12px -5px rgb(253,223,234), -6px 0 12px -5px rgb(215,240,243);
background: linear-gradient(0deg, #ffdee9 0%, #b5fffc 100%);
}
.mb10{display:none;}
.but-download>.but,.but-download>span{min-width: 200px;padding: .5em;margin-top: 10px;}.pay-extra-hide{background: var(--muted-border-color);display: block;margin: 10px;padding: 20px;color: var(--muted-color);border-radius: 4px;}
/*下载样式*/
.but-download{display: table-cell;}.download-article{margin-bottom: 40px !important;padding: 0 10px;width: 100%;margin: 0 auto;}
.download-demo{margin: 10px 0;}.download-xiyang{padding: 0 0 20px;display: flex;justify-content: center;align-items: center;}
.download-sty{text-align: center;height: 260px;border-radius: 8px;position: relative;}@media (max-width:530px){.but-download {display: block;}
.but-download>.but, .but-download>span{min-width: 100% !important;}}@media (max-width:700px){.download-sty{display: none;}.download-right{padding: 10px !important;height: 100% !important;width: 100%;}.download-theme-box{margin-top: 24px;}}@media (min-width:700px){.display{display: none;}}@media (min-width: 1100px){.download-article{width:900px;}}@media (max-width: 950px){.download-notice{display: flex;}.head h2{font-size: 30px !important;}}.download-sty img{position: relative; }.download-theme-box{margin:10px 0 20px 0;text-align: center;}.download-right{margin-left: 6px;border: 1px solid #f04494;padding: 24px;border-radius: 8px;position: relative;}.download-file-name{font-size: 20px;}
.but-download>.but,.but-download>span{min-width: 130px;padding: .5em;margin-top: 10px;}.pay-extra-hide{background: var(--muted-border-color);display: block;margin: 10px;padding: 20px;color: var(--muted-color);border-radius: 4px;}
.panel{margin-bottom: 10px; background-color: #fff; border: 1px solid var(--theme-color); border-radius: 4px; -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05); box-shadow: 0 1px 1px rgba(0,0,0,.05);}
.panel-heading{padding: 10px 15px;border-top-left-radius: 3px;border-top-right-radius: 3px;color: #fff;background-color: var(--focus-color);}/*边框部分颜色*/
.panel-heading h3{margin-top: 0;margin-bottom: 0;font-size: 14px;color: #0000FF;font-family: inherit;font-weight: 500;line-height: 1.1;}
.panel-body .shengming{line-height:25px;font-size:14px;color:#C33;}
.head{height: 80px;letter-spacing: 8px;color: #fff;background: url(//21lhz.cn/cdn/dl_head.png) center no-repeat;text-align: center;border-radius: 10px 10px 0 0;position: relative;top: -20px;margin: -10px;margin-bottom: 20px;}
.head h2{line-height: 90px;font-size: 40px;}
.download-notice {padding: 24px;border-top: 1px solid #e5e5e5;position: relative;margin: 0px -10px;border-radius: 0 0 8px 8px;}
.download-notice-title {width: 190px;height: 100px;margin-right: 18px;margin-top: 4px;padding-top: 32px;border-right: 1px solid #ccc;text-align: center;font-size: 28px;color: #999;font-family: microsoft yahei;font-weight: 700;}
.download-notice-ico {width: 36px;height: 29px;background-position: 0 -372px;}
.ico {background-image: url(//21lhz.cn/cdn/ico_png24.png);background-repeat: no-repeat;}
.fl {float: left;display: inline;}.red1 {color: #eb0064;font-size: 14px;}.mb5 {margin-right: 5px;margin-bottom: 5px;}.vertical-middle {vertical-align: middle;}.download-notice-detail p {font: 13px/1.25 "microsoft yahei",simsun,arial;}
.popTipBox {padding: 5px 10px;text-indent: 2em;border: 1px solid #ffd8c0;background-color: #fff9f3;font-size: 13px;color: #e10074;line-height: 22px;}
.but-download a{margin-left: 10px;margin-right: 4px;}
</style>
<main class="container">
<div class="content-wrap">
<div class="content-layout">
<?php while (have_posts()) : the_post(); ?>
<?php echo zib_get_page_header(); ?>
<div class="zib-widget article download-article">
<div class="head"><h2>墨染云天资源下载页</h2></div>
<?php
echo zibpay_get_down_html($post_id);
$page_links_content_s = get_post_meta(get_queried_object_id(), 'page_show_content', true);
if ($page_links_content_s) {
the_content();
wp_link_pages(
array(
'before' => '<p class="text-center post-nav-links radius8 padding-6">',
'after' => '</p>',
)
);
echo '</div>';
}
?>
<!--开始-->
<dl class="download-notice clearfix zib-widget">
<dt class="fl download-notice-title"><span class="inline-block vertical-middle mr5 mb5 download-notice-ico ico"></span>注意事项</dt>
<dd class="download-notice-detail">
<p><b class="red1"><p style="text-align:center" id="tf_lgz">本站大部分下载资源收集于网络，只做学习和交流使用，版权归原作者所有。</p></b></p>
<p>若为付费资源，请在下载后24小时之内自觉删除，若作商业用途，请到原网站购买，由于未及时购买和付费发生的侵权行为，与本站无关。</p>
<p>本站发布的内容若侵犯到您的权益，请联系<b>执笔博客</b>删除，我们将及时处理！</p>
<p><b>如下载有问题请重新下载，文件自下载之日起，可免费重复下载。若文件有问题，请及时联系<b>执笔博客</b>处理。</b></p>
</dd>
</dl>
<div class="wp-block-zibllblock-alert alert-dismissible fade in"><div class="alert jb-yellow" data-isclose="" role="alert">请注意，本系统仅供学习参考，禁止进行违法使用。下载的资源使用前请仔细核对文字内容,如资源中包含国旗、国徽、党徽、天安门等图片,请在《中华人民共和国国旗法》、《中华人民共和国国徽法》等相关法律法规规定范围内使用,请保证国旗、国徽、天安门等图案的完整性,如因违规使用造成的一切经济损失及法律责任,将由您自行承担。</div></div>
<div class="wp-block-zibllblock-alert alert-dismissible fade in"><div class="alert jb-blue" data-isclose="" role="alert">附：根据2013年1月30日《计算机软件保护条例》新规定：第十七条<br/>为了学习和研究软件内含的设计思想和原理，通过安装、显示、传输或者存储软件等方式使用软件的，可以不经软件著作权人许可，不向其支付报酬。<br/>鉴于此，希望大家按此说明学习以及研究程序软件! 切勿商用,切勿违法使用!!!否则后果自行承担!</div></div>
<!--下载说明开始-->
<style>
.but-download>.but,.but-download>span{min-width: 200px;padding: .5em;margin-top: 10px;}.pay-extra-hide{background: var(--muted-border-color);display: block;margin: 10px;padding: 20px;color: var(--muted-color);border-radius: 4px;}
.panel:hover{border: 1px solid #FF6666;}/*框颜色背景色*/
.panel{margin-bottom: 10px; background-color: #fff; border: 1px solid #268df7; border-radius: 4px; -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05); box-shadow: 0 1px 1px rgba(0,0,0,.05);}
.panel-heading{padding: 10px 15px;border-bottom: 1px solid #268df7;border-top-left-radius: 3px;border-top-right-radius: 3px;color: #0000FF;background-color: #99CCFF;}/*边框部分颜色*/
.panel-heading h3{margin-top: 0;margin-bottom: 0;font-size: 14px;color: #0000FF;font-family: inherit;font-weight: 500;line-height: 1.1;}
.panel-body .help li{line-height:25px;font-size:14px;color: #000;}
.panel-body .help li em{font-style:normal;background: #FFFFCC;padding:5px;border-radius:4px;color: #FF3399;}
.panel-body .shengming{line-height:25px;font-size:14px;color:#C33;}
</style>
<div class="panel">
<div class="panel-heading">
<h3>下载说明</h3>
</div>
<div class="panel-body">
<div id="smcos_mhz"><ul class="help">
<li>
1.墨染云天所提供的压缩包若无特别说明，解压密码均为<em>mryt</em></li>
<li>2.下载后文件若为压缩包格式，请安装7Z软件或者其它压缩软件进行解压;</li>
<li>3.文件比较大的时候，建议使用下载工具进行下载，浏览器下载有时候会自动中断，导致下载错误;</li>
<li>4.资源可能会由于内容问题被和谐，导致下载链接不可用，遇到此问题，请到文章页面进行反馈，以便执笔博客及时进行更新;</li>
<li>5.其他下载问题请自行搜索教程，这里不一一讲解。</li>
</ul></div>
</div>
</div>
<div class="panel">
<div class="panel-heading">
<h3>站长声明</h3>
</div>
<div class="panel-body">
<div id="smcos_tkzj"><span class="shengming"><b>本站大部分下载资源收集于网络，只做学习和交流使用，版权归原作者所有，若为付费资源，请在下载后24小时之内自觉删除，若作商业用途，请到原网站购买，由于未及时购买和付费发生的侵权行为，与本站无关。本站发布的内容若侵犯到您的权益，请联系本站删除，我们将及时处理！</b></span></div>
</div>
</div>
<!--//版权提示弹窗-->
<div class="web_notice" style="
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.3);
z-index: 99999;
">
<div style="
position: fixed;
top: 50%;
left: 50%;
width: 350px;
background: #FFF;
transform: translate(-50%, -50%);
border-radius: 40px;
padding: 25px 20px;
">
<h3 style="
font-weight: bold;
text-align: center;
font-size: 30px;
margin-top: 10px;
margin-bottom: 15px;
">免责声明</h3>
<div style="
font-size: 16px;
margin-top: 26px;
line-height: 30px;
color: #999;
">相关内容均来自网络收集与网友提供，任何涉及商业盈利目的的均不得使用，否则产生的一切后果将由您自己承担！
本平台资源仅供个人学习交流，测试使用，请勿用于任何盈利商业用途。<br>版权争议与本站无关。您必须在下载后的24个小时之内，从您的电脑或手机中彻底删除下载内容。如果您喜欢该程序和内容，请支持正版，购买注册，得到更好的正版服务。我们非常重视版权问题，如有侵权请邮件（littleink24@yeah.net）与我们联系。敬请谅解！</div>
<div style="display: flex;justify-content: space-between;margin-top: 45px;">
<a style="display: block;
background: #98a3ff;
color: #FFF;
text-align: center;
font-weight: bold;
font-size: 19px;
line-height: 60px;
margin-right: 10px;
border-radius: 32px;
width: 45%;
" onclick="javascript:document.querySelector('.web_notice').remove()">我同意</a>
<a style="display: block; background: #f5f5f5; color: #333; text-align: center; font-weight: bold; font-size: 19px; line-height: 60px ;margin-left: 10px; border-radius: 32px; width: 45%;" href="<?php echo get_bloginfo('url').'/'.$post_id.'.html'; ?>" onclick="redirectToLink()">不同意</a>
</div>
</div>
</div>
<!--下载说明结束-->
<!--结束-->
<?php ?>
<?php endwhile; ?>
</div>
<?php comments_template('/template/comments.php', true); ?>
</div>
</div>
<?php get_sidebar(); ?>
</main>
<?php
get_footer();![图片[54]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-56.png)
49.API头像
下载放止网站根目录 域名/api/api.php
放 子比主题-用户&互动-用户功能-用户默认头像
API头像源码接口
提取码:9k9y
50、友情链接
参考子比官方设置
https://www.canva.cn/brand/join?token=ZPDPPhikOOzEhunh-breYw&referrer=team-invite
51、友情链接添加一键提交
![图片[55]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-57.png)
定位：/wp-content/themes/zibll/func.php文件，没有这个文件自己创一个，记得加上php头，要不然报错，将下面的代码放里面即可！
function zib_nav_links_ajax_hand() {
$url = isset($_GET['link_url']) ? sanitize_text_field($_GET['link_url']) : '';
if (empty($url)) {
wp_send_json_error(['msg' => '网址不能为空']);
}
try {
$api_response = zib_nav_links_curls('https://api.ahfi.cn/api/websiteinfo?url=' . urlencode($url));
$response_data = json_decode($api_response, true);
if ($response_data && isset($response_data['code']) && $response_data['code'] === 200) {
wp_send_json_success([
'title' => $response_data['data']['title'],
'description' => $response_data['data']['description'],
'msg' => $response_data['message']
]);
} else {
wp_send_json_error(['msg' => $response_data['message']]);
}
} catch (Exception $e) {
wp_send_json_error(['msg' => '请求API时发生错误: ' . $e->getMessage()]);
}
}
add_action('wp_ajax_zib_nav_links_ajax_hand', 'zib_nav_links_ajax_hand');
add_action('wp_ajax_nopriv_zib_nav_links_ajax_hand', 'zib_nav_links_ajax_hand');
function zib_nav_links_curls($url) {
$ch = curl_init();
$timeout = 30;
$ua = 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.102 Safari/537.36';
$options = [
CURLOPT_URL => $url,
CURLOPT_RETURNTRANSFER => 1,
CURLOPT_CONNECTTIMEOUT => $timeout,
CURLOPT_FOLLOWLOCATION => 1,
CURLOPT_USERAGENT => $ua,
CURLOPT_SSL_VERIFYPEER => FALSE,
CURLOPT_SSL_VERIFYHOST => FALSE
];
curl_setopt_array($ch, $options);
$content = curl_exec($ch);
if ($content === false) {
curl_close($ch);
throw new Exception("cURL Error: " . curl_error($ch));
}
$httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE);
curl_close($ch);
if ($httpCode !== 200) {
throw new Exception("HTTP Error: " . $httpCode);
}
return trim(mb_convert_encoding($content, 'UTF-8', mb_detect_encoding($content)));
}
function zib_nav_javascript() {
?>
<script>
$(function() {
const buttonHtml = '<style>#link_description{width:87%;}</style><span class="abs-right" style="top: 68%;right:5px;"><button type="button" class="but jb-pink zbtool-submit" style="overflow: hidden; position: relative;line-height: 1.7;">一键获取</button></span>';
const inputTag = $('input[name="link_description"]');
if (inputTag.length === 0) return;
inputTag.after(buttonHtml);
function toggleButtonState(disabled) {
$('.zbtool-submit').prop('disabled', disabled);
}
$('.zbtool-submit').on('click', function() {
const url = $("input[name='link_url']").val();
if (!url) {
notyf("请输入网址", "danger", 0, "zib_nav_golink");
return;
}
toggleButtonState(true);
notyf("加载中，请稍等...", "load", 2000, "zib_nav_golink");
jQuery.ajax({
type: "GET",
dataType: "json",
url: "<?php echo esc_url(admin_url('admin-ajax.php')) ?>",
data: {
action: "zib_nav_links_ajax_hand",
link_url: url
},
success: function(response) {
toggleButtonState(false);
if (response.success) {
$("#link_name").val(response.data.title);
$("#link_description").val(response.data.description);
notyf(response.data.msg, "", 0, "zib_nav_golink");
} else {
notyf(response.data.msg, "danger", 0, "zib_nav_golink");
}
},
error: function(errorThrown) {
toggleButtonState(false);
console.error("Ajax请求失败:", errorThrown);
notyf("请求失败，请重试", "danger", 0, "zib_nav_golink");
}
});
});
});
</script>
<?php
}
add_action('wp_footer', 'zib_nav_javascript');52、子比主题美化 – 主题右侧新版悬浮导航美化版本修正版本
![图片[56]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-58.png)
![图片[57]-本站装修-九块九源码](https://www.9k9y.cn/wp-content/uploads/2025/07/image-59.png)
添加教程第一步首先就是添加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”的文件夹，并把压缩包放进去解压即可
悬浮按钮图
提取码:9k9y
53
© 版权声明
本站代码模板仅供学习交流使用请勿商业运营,严禁从事违法,侵权等任何非法活动,否则后果自负！
THE END
- 最新
- 最热
查看全部