子比美化 第33页
标签
排序
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"...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
 2025-12-13
评论可见
子比主题 – 全局B2弹窗提醒样式美化-识趣者资源

子比主题 – 全局B2弹窗提醒样式美化

这个是子比主题全局B2弹窗提醒样式的美化，可以看本站的复制、签到等等更多按钮，就是把子比默认的弹窗替换了B2样式美化，部署之前要确保之前没有引入过其他的弹窗样式，话不多说直接开始！ 代码部署 [hidecontent type="reply"] 一共三个地方的代码，跟着我的步骤走不会有问题，确保之前没有部署过其他的弹窗样式！ CSS自定义底部HTML代码JS代码 我们先丢CSS样式到：子比主题–>>自定义CSS样式即可！ /*弹窗提醒*/ .qmsg.qmsg-wrapper { box-sizing:border-box; margin:0; padding:0; font-size:13px; font-variant:tabular-nums; line-height:1; list-style:none; font-feature-settings:"tnum"; position:fixed; top:136px; left:0; z-index:9999999; width:100%; pointer-events:none; color:#000; } .qmsg .qmsg-item { padding:8px; text-align:center; -webkit-animation-duration:.3s; animation-duration:.3s; position:relative; }...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
 2025-12-13
评论可见
子比主题 – 文章付费模块单独位置教程-识趣者资源

子比主题 – 文章付费模块单独位置教程

这是一款子比主题为每篇文章单独设置付费模块的显示位置，而不再局限于全局设置，原本的子比主题是全局生效显示的位置，教大家怎么去单独每篇文章不同的位置，话不多说直接开始！ 部署教程 [hidecontent type="reply"] 定位：zibll/zibpay/functions/zibpay-post.php，第240行左右，可以搜索 $pay_box_position 定位。按图删除这几行代码，然后替换成下面的代码。 // 修改付费模块位置逻辑，支持单篇文章自定义设置 function zibpay_get_post_box_position($post_id = 0) { if (!$post_id) { global $post; $post_id = $post ? $post->ID : 0; } $pay_mate = get_post_meta($post_id, 'posts_zibpay', true); $custom_position = !empty($pay_mate['pay_box_position'])...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
 2025-12-13
评论可见
子比主题 – 会员尊享卡片跳转样式-识趣者资源

子比主题 – 会员尊享卡片跳转样式

逛网站的时候发现一个站的会员卡片还是不错的，不过他是没有手机端的，我这边适配了一下手机端，我觉得还是比较好看的，就一个简单的跳转，如果有技术自行跳转子比的modal的会员，喜欢的自行部署吧！ 代码部署 [hidecontent type="reply"] 直接将下面的代码丢到：WP后台–>>外观–>>小工具–>>自定义HTML即可！ <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet"> <style> .member-card-container{max-width:100%;margin:0 auto;padding:10px}.member-st{width:100%;border-radius:12px;overflow:hidden;position:relative;background:linear-gradient(to right,#e0f2fe,#bae6fd);border:1px solid rgba(2,132,199,0.1);box-shadow:0 10px 25px -5px rgba(2,132,199,0.1),0 8px 10px -6px rgba(2,132,199,0.1)}.corner-decoration{position:absolute;width:60px;height:60px;background-color:rgba(255,255,255,0.2);z-index:5}.top-left{top:0;left:0;border-radius:0 0 60px 0}.top-right{top:0;right:0;border-radius:0 0 0 60px}.bottom-left{bottom:0;left:0;border-radius:0 60px 0 0}.bottom-right{bottom:0;right:0;border-radius:60px 0 0 0}.member-bgbox{position:absolute;inset:0;background-image:radial-gradient(rgba(2,132,199,0.06) 1px,transparent...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
 2025-12-13
评论可见
子比主题 – 右上角随机访问文章功能-识趣者资源

子比主题 – 右上角随机访问文章功能

这是一款子比主题的右上角随机访问文章功能，利用的子比自带的颜色和跳转图标，给自己的右上角加一个随机文章还是比较美观的，喜欢的自行部署吧！ [hidecontent type="reply"] 一共两个部分的代码，跟着我的教程走不会有问题！ func代码zib-header.php代码角标颜色 定位：/wp-content/themes/zibll/func.php文件，没有这个文件自己创建一个，记得加上php头，要不然会报错，将下面的代码直接丢里面即可！ function register_random_post_redirect_endpoint() { register_rest_route('wp/v2', '/random-post', array( 'methods' => 'GET', 'callback' => 'handle_random_post_redirect', 'permission_callback' => '__return_true' )); } add_action('rest_api_init', 'register_random_post_redirect_endpoint'); function handle_random_post_redirect($request) { // 获取所有已发布的文章 $args = array( 'post_type' =>...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
 2025-12-13
评论可见
子比主题 – 邮箱通知样式美化（四款样式）-识趣者资源

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

给大家做了四款款子比主题邮箱通知样式美化，邮箱通知美化还是不错的，博客给大家设计并美化了，目前是四款样式，后面博客会做很多邮箱通知，喜欢的自己挑选几款自己部署吧！ 部署教程 定位：/wp-content/themes/zibll/inc/functions/zib-email.php文件里面，我们搜$content = '，搜了之后，我们如下图替换子比的样式，如下图 样式如下 [hidecontent type="reply"] 第一款第二款第三款第四款 $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;...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
 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]
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
 2025-12-13
评论可见
子比主题 – 文章段落渐变背景样式（四款）-识趣者资源

子比主题 – 文章段落渐变背景样式（四款）

在逛论坛的时候发现一个四款渐变背景样式，于是腾飞博客就给他们单独分开，一开始腾飞用WordPress 区块开发的本地注册（即原生注册）自定义区块来写的wordpress插件，写了一半不想写了，就代码部署wordpress新样板吧，也挺方便的，而且插件多了还卡，话不多说直接开始！ [hidecontent type="reply"] 更新了原始编辑器，就是禁用古腾堡的那种WP原始编辑器，看好是古腾堡编辑器还是原始编辑器 古腾堡编辑器原始编辑器 首先这个教程需要WP古腾堡，古腾堡才有的哦，没有的话就不用部署了！ 定位：WP后台–>>新建文章，我们先把代码直接新建区块这样就很方便了，新建文章如下图！ 代码我放到最后，喜欢的哪个自己放哪个，或者也可以都放，我们把样式放到了自定义HTML之后，我们点右边的三个点，如下图！ 然后我们如上图有一个：创建新样板，然后我们点开他，然后我们创建比如这个名字是：蓝色渐变，就写这个名字，然后分类可以自己创建，如下图，就看懂了！ 然后我们添加就添加成功了，然后我们去哪里找这个呢，如下图，我已经添加了四个！ 然后搜到了之后我们喜欢哪个就点哪个，然后直接部署就行，如果添加自定义HTML，想看到样式，可以点一下预览就变成了可观的样式，当然你如果自己写了样式也可以用这个教程哦 代码部署 绿色渐变橙色渐变蓝到粉渐变灰色渐变 <p class="gradient-paragraph gradient-4"> 这是一个绿色渐变背景示例。清新的颜色让人联想到自然和成长，适合用于环保、健康或积极主题的内容。 </p> <style> .gradient-paragraph { margin-bottom: 30px; padding: 25px; border-radius: 12px; line-height: 1.8; font-size: 1.6rem; transition: all 0.3s...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
 2025-12-13
VIP可见
子比主题 – 文章标题样式美化（共十一款）-识趣者资源

子比主题 – 文章标题样式美化（共十一款）

在此之前博客的用户反馈让做一个文章标题美化的总结，今天他来了，我会做一些好看的然后你们自己选，喜欢哪个自己部署哪个，后面我会持续更新这篇文章，话不多说喜欢的自行部署吧！ 喜欢哪个样式自己将该哪一款丢到：子比主题–>>自定义CSS样式即可，先写这十一款，多的话文章容易卡，其实预估能写到30款左右，因为我写的样式比较多，后面抽几个好看的添加上去吧！ [hidecontent type="vip1"] 第一款第二款第三款第四款第五款第六款第七款第八款第九款第十款第十一款 第一款是很早的猫爪，这款是H1-H4都是一样的，不过这个扩展性很高，比如遇到自己喜欢的，自己可以替换里面的图片就可以！ /* 腾飞博客第一款标题样式美化 */ .title-theme { padding: 0px 0px 0px 45px!important; background: url(https://www.tfbkw.com/wp-content/uploads/2025/03/20250306195527974-biaoti.svg) 10px center no-repeat; background-size: 30px 20px; color: #566889; } .title-theme:before { display:none; } .wp-posts-content>h1.wp-block-heading{ padding: 0px 0px...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
 2025-12-13
评论可见
子比主题 – 文章上方推广样式代码-识趣者资源

子比主题 – 文章上方推广样式代码

这是一款子比推广样式代码，很简约的一款，并且修复了css一些问题，并且这款适配了昼夜和手机端，喜欢的自行部署吧！ [hidecontent type="reply"] 定位：WP后台–>>外观–>>自定义HTML，将下面的代码放里面即可，建议放到：文章页-主内容上面 <style> .tengfei-info-module-box,.tengfei-info-module-box *{margin:0 !important;padding:0 !important;font-size:1em !important;border:0 !important;width:auto !important;height:auto !important;-webkit-box-sizing:border-box !important;box-sizing:border-box !important;list-style:none !important;max-width:none !important;max-height:none !important;line-height:1 !important;background:0 0 !important}.tengfei-info-module-box{margin:1.5em 0 .8em 0 !important;max-width:100% !important;margin-left:auto !important;margin-right:auto !important}.tengfei-info-module-btn{display:inline-flex !important;height:2.4em !important;align-items:center !important;justify-content:center !important;padding:0 1em !important;border-radius:4px !important;background-color:var(--tengfei-module-color1)...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
1…313233343536跳转