子比美化共224篇
子比主题美化相关教程
分类
排序
2025-12-13
子比主题 – 文章详情页带Tab切换美化-识趣者资源

子比主题 – 文章详情页带Tab切换美化

今天给大家分享一款自用的子比主题文章详情页，很早之前就想发出来，因为没有适配，看很多人需要所以我抓紧适配了一下，话不多说直接开始，喜欢的自行部署！ 代码部署 [hidecontent type="reply"] 一共两个代码，一个是PHP代码，一个是CSS代码，PHP代码里面我已经引入了CSS文件，你可以引入文件也可以放到：子比主题–>>自定义CSS样式即可！ 记得关闭：子比主题–>>文章页面–>>作者信息板块，要不然不美观 PHP代码CSS代码 定位：/wp-content/themes/zibll/inc/functions/zib-single.php文件，我们找到下面的函数，如下图 然后我们将一整块替换我下面的代码，直接替换我修改过的代码 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"...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 未登录时图片高斯模糊显示-识趣者资源

子比主题 – 未登录时图片高斯模糊显示

这是一款子比主题用户没有登录的时候图片显示模糊的，登入之后就可以看到全部图片了，所以也很实用的功能，对于子比站长来说，这个功能还是可以的，喜欢的自行部署！ 代码部署 [hidecontent type="reply"] 首先我们到文件：/wp-content/themes/zibll/func.php文件里面，没有这个文件自己创一个，创建之后别忘了加php头，要不然会报错。将下面的代码放到这个文件里面即可！ //未登录时全站图片模糊 function n_yingcang_css(){ echo '<style> img { -webkit-filter: blur(10px)!important; -moz-filter: blur(10px)!important; -ms-filter: blur(10px)!important; filter: blur(6px)!important;} </style>'; } if( !is_user_logged_in()) {add_action( 'wp_head', 'n_yingcang_css' );}; //未登录时全站图片模糊 [/hidecontent]
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2026-01-24
子比美化 – 网站右侧悬浮导航-识趣者资源

子比美化 – 网站右侧悬浮导航

整合了所有代码，拒绝复杂化！代码实现了一个网站右侧悬浮功能栏，主要服务于基于 WordPress（子比主题）搭建的网站，集成了会员推广、用户互动、客服沟通、页面操作四大类核心功能，整体适配 PC 端展示，移动端自动隐藏，兼顾美观与实用性。 代码部署 [hidecontent type="payshow"] 进入"外观" → "小工具",找到"自定义HTML"小工具,把代码粘贴进去,放到“所有页面-底部全宽度” <div class="container fluid-widget"><div class="widget_text zib-widget widget_custom_html"><div class="textwidget custom-html-widget"><div class="huliku-float"> <div class="huliku-float-box"> <!-- 会员功能 --> <div class="huliku-float-item activity"> <div class="cont"> <a href="/vips" target="_blank" class="vip-link"> <img src="https://i.imgs.ovh/2026/01/24/yqlf7g.webp"...
识趣资源的头像-识趣者资源至尊会员识趣资源· 11天前
#子比美化
 2026-01-28
子比主题-首页六格菜单PC版-识趣者资源

子比主题-首页六格菜单PC版

效果演示 Html代码 可直接添加到后台 小工具 >> 自定义HTML代码，里面的图片链接自行替换。 [hidecontent type="reply"] <div class="home-row-left content-area "> <div id="html-box-lg" class="html-box"> <div class="sort mobile-hidden"> <!-- 专题 --> <div class="sort-swiper-container swiper-container swiper-container-initialized swiper-container-horizontal"> <div class="swiper-wrapper" style="transition-duration: 0ms; transform: translate3d(-1178px, 0px, 0px);"> <ul...
识趣资源的头像-识趣者资源至尊会员识趣资源· 6天前
#子比美化
 2026-01-24
子比主题 – 文章/帖子评论区拉黑插件-识趣者资源

子比主题 – 文章/帖子评论区拉黑插件

这是一款子比主题的文章/帖子评论区拉黑插件，别人写了文章发布，有人乱评论，拉黑之后就...
识趣资源的头像-识趣者资源至尊会员识趣资源· 11天前
#子比美化
 2026-01-28
子比主题功能 – 为单个文章设置有效期，到期自动下线-识趣者资源

子比主题功能 – 为单个文章设置有效期，到期自动下线

为子比主题添加文章有效期功能，允许您为每篇文章设定有效期。一旦到达设定时间，文章将自动下线，不再对外展示。这一功能不仅能帮助您有效管理内容时效性，还能提升用户体验，减少过期信息的干扰。轻松设置，高效管理，让您的网站内容始终保持新鲜与活力！ [hidecontent type="reply"] func.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',...
识趣资源的头像-识趣者资源至尊会员识趣资源· 6天前
#子比美化
 2025-12-23
子比主题 – 多导航小工具_附svg图标-识趣者资源

子比主题 – 多导航小工具_附svg图标

这是一款子比主题多导航小工具，这款多导航小工具集成了分类导航、网站统计、用户动态三合一等展示，包括小工具配置具有很全的功能，喜欢的自行部署吧！ 小工具配置 代码部署 [hidecontent type="reply"] 跟着我的教程走，别走偏了，先看我怎么说的，再去操作，这个小工具跟我以前发的教程一模一样首先我们第一步：/wp-content/themes/zibll/func.php文件，如果没有这个文件自己创建在子比目录创建一个，创建之后记得加php头，要不然会报错！加如下面的代码，我会详细说这个 $widgets_files = array( 'tengfei_more_navigation.php', /*小工具文件名*/ ); foreach ($widgets_files as $file) { require get_template_directory() . '/tengfei/widgets/' . $file; } 将上面的代码放到/wp-content/themes/zibll/func.php文件，都是一样的，看上面的代码，别看懵逼了，我们要明白这个：tengfei_more_navigation.php这个代码，这个代码就是代表一个小工具的名字，相当于就是用上面的代码调用的，就是如果想加第二个小工具，那就是在tengfei_more_navigation.php这个代码下面加一行其他小工具的别名，我说的已经很仔细了，不懂问站长，文件放底部 附件上传到：/wp-content/themes/zibll解压即可！ 附件下载 子比主题多导航小工具附件下载提取码FYBu svg图标 我只放了六个，更多的可以下载Adobe Illustrator自己导出 svg磨砂图标下载提取码FYBu [/hidecontent]
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 菜单文字下波浪美化-识趣者资源

子比主题 – 菜单文字下波浪美化

这是一款给子比主题菜单文字添加交互性波浪下划线效果，仅在菜单处于 “当前选中” 或 “鼠标悬浮” 状态时触发，提升页面导航的视觉层次感与用户交互体验，喜欢的自行部署吧！ [hidecontent type="reply"] 将下面的代码直接丢到：子比主题–>>自定义CSS样式即可！ /*菜单文字下波浪*/ .navbar-top li.current-menu-item>a, .navbar-top li:hover>a { -webkit-box-decoration-break: clone; box-decoration-break: clone; text-decoration: underline wavy; text-decoration-thickness: from-font; text-underline-offset: 3px; } [/hidecontent]
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-23
子比主题 – 违禁词检测插件-识趣者资源

子比主题 – 违禁词检测插件

这是一款子比主题违禁词插件，其他主题自测，这款插件的功能就是后台设置违禁词，然后前台...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2026-02-03
子比主题 – 左下角欢迎光临提示美化-识趣者资源

子比主题 – 左下角欢迎光临提示美化

这是一款子比主题左下角欢迎光临提示美化，在左下角可关闭，并且手机端是不显示的，这款提示有一个小铃铛带有动态的效果，喜欢的自行部署吧！ [hidecontent type="reply"] 定位：子比主题–>>自定义底部HTML代码，将下面的代码丢里面即可！ <div class="capsule-container"><div class="capsule-bar"><div class="capsule-content"><div class="capsule-icon"><svg t="1760148892394" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6215" width="32" height="32"><path d="M505.152 72.064c65.28 0 120.576 46.08 132.032 106.304 103.808 48.256 169.856 148.48 169.856 260.096v113.088l84.096 116.352c20.352 28.16...
识趣资源的头像-识趣者资源至尊会员识趣资源· 21小时前
#子比美化
 2026-01-16
子比主题 – 下载按钮hover弹窗功能（两版）-识趣者资源

子比主题 – 下载按钮hover弹窗功能（两版）

这是一款子比主题下载按钮hover弹窗功能，首先说一下这个功能唯一的缺点就是，这个如果用户扫了二维码下载资源之后，不扣资源限制次数，无限制下载，介意的话就不用这个功能，喜欢的自行部署吧！ [hidecontent type="reply"] 为什么刚才给大家说的有两版，其实样式是一样的，只不过就是一个版是通过api接口来实现生成二维码，第二个版是通过子比来实现的，不过子比的话有缓存，都可以用的，给大家分享两版！ 定位：/wp-content/themes/zibll/func.php文件，没有这个文件自己记得加上php头，要不然会报错，两个版都是放到func里面，但是别两个同时放进去，你感觉哪个好用就用哪个版！ 第一版（调用API接口实现二维码） add_action('wp_footer',function(){?> <script>jQuery(function($){$('.but-download a.but[href*="pay-download"]').each(function(){var b=$(this),u=b.attr('href'),q='https://api.qrtool.cn/?text='+encodeURIComponent(u),img=new Image();img.src=q;b.attr({'data-toggle':'tooltip','data-html':1,'data-placement':'bottom',title:'<div class="text-center padding-10"><img src="'+q+'" style="width:120px;height:120px;border-radius:4px;"><div class="mt6 muted-2-color em09">扫码下载资源</div></div>'}).tooltip({html:1,trigger:'manual',container:'body'}).on('mouseenter',function(){var t=$(this);t.tooltip('show');setTimeout(function(){t.tooltip('update')},50)}).on('mouseleave',function(){$(this).tooltip('hide')})})});</script> <style>.tooltip-inner{width:140px!important;max-width:160px!important;padding:0;background:#000;border:1px solid var(--muted-border-color);box-shadow:0 2px 8px rgba(0,0,0,.1)}.tooltip.show{opacity:1}</style> <?php }); 第二版（调用子比主题实现二维码） add_action('wp_ajax_get_download_qrcode','custom_get_download_qrcode'); add_action('wp_ajax_nopriv_get_download_qrcode','custom_get_download_qrcode'); function custom_get_download_qrcode(){ if(empty($_GET['url'])){die();} $url=urldecode($_GET['url']); $cache_key='qr_'.md5($url);...
识趣资源的头像-识趣者资源至尊会员识趣资源· 19天前
#子比美化
 2025-12-13
子比主题 – 邮箱通知样式美化（四款样式）-识趣者资源

子比主题 – 邮箱通知样式美化（四款样式）

给大家做了四款款子比主题邮箱通知样式美化，邮箱通知美化还是不错的，博客给大家设计并美化了，目前是四款样式，后面博客会做很多邮箱通知，喜欢的自己挑选几款自己部署吧！ 部署教程 定位：/wp-content/themes/zibll/inc/functions/zib-email.php文件里面，我们搜$content = '，搜了之后，我们如下图替换子比的样式，如下图 样式如下 第一款第二款第三款第四款 $content = ' <style> .gradient-mail{ background:#eaf7ff; padding:40px 0; font-family: "Helvetica Neue","PingFang SC",Arial,sans-serif; } .gradient-mail .box{ max-width:620px; margin:auto; border-radius:24px; background:linear-gradient(140deg,#fff 60%,#d6eaff 100%); box-shadow:0 4px 22px rgba(66,150,255,0.10); overflow:hidden; } .gradient-mail...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-02
子比主题 – 精美弹窗样式美化-识趣者资源右上 左上
底部

免费子比主题 – 精美弹窗样式美化

给大家写了一款不用子比主题的弹窗的一款弹窗，比较精美好看，腾飞把一些没有用的都去掉了，这个弹窗就单独用的JS来写的，没有用多余的，CSS代码也放到JS里面了，很实用，喜欢的自行部署吧！ [hidecontent type="reply"] 定位：子比主题–>>自定义javascript代码，将代码放到里面，自己修改一下里面的内容即可！ jQuery(document).on('click', '.user-online-status .but', function () { var $this = jQuery(this); var $container = $this.closest('.user-online-status'); var status = $this.data('sta'); var nonce = $container.find('#user_online_status_nonce').val() || window.user_online_status_nonce || ''; if ($this.data('processing')) return; $this.data('processing', 1);...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 自定义右键菜单优化版-识趣者资源

子比主题 – 自定义右键菜单优化版

教程 [hidecontent type="reply"] <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; box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2); position: absolute; display: none;...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2026-01-25
子比主题 – 首页VIP购买小工具（第一版）-识趣者资源

子比主题 – 首页VIP购买小工具（第一版）

这个小工具是一个给自己的网站首页加一个VIP购买的小工具，这个小工具我做了有一段时间了，只是隔这了没做了，今天VIP小工具来了，如果用页面的话，用户看不到根本，那我就做一个VIP购买小工具，7B2的VIP购买样式，我不想去适配手机端，手机端如果适配的感觉不怎么好看，所以我自动隐藏了手机端 代码部署 [hidecontent type="reply"] 跟着我的教程走，别走偏了，先看我怎么说的，再去操作，这个小工具跟我以前发的教程一模一样首先我们第一步：/wp-content/themes/zibll/func.php文件，如果没有这个文件自己创建在子比目录创建一个，创建之后记得加php头，要不然会报错！加如下面的代码，我会详细说这个 $widgets_files = array( 'tengfei_zibvips.php', /*小工具文件名*/ ); foreach ($widgets_files as $file) { require get_template_directory() . '/tengfei/widgets/' . $file; } 将上面的代码放到/wp-content/themes/zibll/func.php文件，都是一样的，看上面的代码，别看懵逼了，我们要明白这个：tengfei_zibvips.php这个代码，这个代码就是代表一个小工具的名字，相当于就是用上面的代码调用的，就是如果想加第二个小工具，那就是在tengfei_zibvips.php这个代码下面加一行其他小工具的别名，我说的已经很仔细了，不懂问站长，文件放底部 附件上传到：/wp-content/themes/zibll解压即可！ 子比主题 – 首页VIP购买小工具（第一版）下载提取码zmFg [/hidecontent]
识趣资源的头像-识趣者资源至尊会员识趣资源· 9天前
#子比美化
123…15跳转