子比美化 第4页
标签
排序
2026-03-06
评论可见
子比主题 – 首页顶部搜索框美化（两款）-识趣者资源
子比美化

美化子比主题 – 首页顶部搜索框美化（两款）

给子比的顶部搜索框加一个美化，我觉得这种方形的搜索框还是比较的好看的，喜欢的自行部署吧，一共是两款美化样式！ 第一款 第二款 代码部署 [hidecontent type="reply"] CSS代码放到：子比主题–>>自定义CSS样式，JS代码放到：子比主题–>>自定义javascript代码 第一款第二款 CSS代码 .header-slider-search .line-form{ border-radius:5px; } .header-slider-search .line-form .abs-right button{ background: #0088ff; color: rgb(255, 255, 255); border-radius: 5px; margin-right: -28px; height: 51.28px; padding: 10px; border-bottom-left-radius: 0px; border-top-left-radius: 0px;...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 40天前
#子比美化
 2026-03-06
评论可见
子比主题 – 顶部多功能组件按钮美化-识趣者资源
子比美化

美化子比主题 – 顶部多功能组件按钮美化

这是一款子比主题的顶部多功能组件按钮美化，这分两个按钮，在此文章之前，带有开始探索、创作者入驻等两个按钮，喜欢的自行部署吧！ 示例图 代码部署 [hidecontent type="reply"] 定位：/wp-content/themes/zibll/func.php文件，没有这个文件自己创建一个，记得加上php头，要不然会报错，将下面的代码放里面即可！ /** * 在顶部多功能组件搜索框右侧添加两个按钮：开始探索 + 创作者入驻 */ add_action('wp_footer', 'zib_custom_search_buttons'); function zib_custom_search_buttons() { ?> <style> .header-slider-search .search-input .line-form { display: flex; align-items: center; gap: 10px; } .header-slider-search .search-custom-btns { display: flex;...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 40天前
#子比美化
 2026-03-03
评论可见
子比主题-圆角炫彩滚动公告栏（黑色背景 + 炫彩文字）-识趣者资源
子比美化

美化子比主题-圆角炫彩滚动公告栏（黑色背景 + 炫彩文字）

演示图 自定义圆角大小 你可以轻松调整圆角程度： 轻微圆角：border-radius: 6px; 标准圆角：border-radius: 12px;（当前设置） 大圆角（胶囊形）：border-radius: 24px; 或 border-radius: 50px; 💡 提示：如果希望左右两侧是半圆形（像胶囊），可设 border-radius: 50px; 并确保高度固定。 [hidecontent type="reply"] <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <title>圆角炫彩滚动公告</title> <style> body { background: #f0f0f0;...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 43天前
#子比美化
 2026-03-03
评论可见
子比主题 – 顶部多功能组件添加适配日夜模式波浪-识趣者资源
子比美化

美化子比主题 – 顶部多功能组件添加适配日夜模式波浪

前言 顶部多功能组件背景底部添加白色波浪的教程。波浪已适配日夜模式。这个教程原创是狐狸库 教程开始 狐狸库发的是PC端和移动端都显示波浪。我个人感觉移动端显示这个背景不太美观。博客使用的是移动端不显示波浪的。给大家把两个版本的css都发出来 移动端显示波浪 将下面css代码放入自定义css中 [hidecontent type="reply"] .parallax{fill:var(--body-bg-color)}.parallax > use{animation:move-forever 30s cubic-bezier(0.55,0.5,0.45,0.5) infinite}.parallax > use:nth-child(1){animation-delay:-2s;animation-duration:7s;opacity:0.5}.parallax > use:nth-child(2){animation-delay:-3s;animation-duration:10s;opacity:0.6}.parallax > use:nth-child(3){animation-delay:-4s;animation-duration:13s;opacity:0.7}.parallax > use:nth-child(4){animation-delay:-5s;animation-duration:20s;opacity:1}@keyframes move-forever{0%{transform:translate3d(-90px,0,0)}100%{transform:translate3d(85px,0,0)}} [/hidecontent] 移动端不显示波浪 将下面css代码放入自定义css中 [hidecontent type="reply"] .parallax{fill:var(--body-bg-color)}.parallax > use{animation:move-forever 30s cubic-bezier(0.55,0.5,0.45,0.5) infinite}.parallax >...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 43天前
#子比美化
 2026-03-02
300积分
子比主题美化 –墨星同款优惠券样式推广代码-识趣者资源
子比工具

功能子比主题美化 –墨星同款优惠券样式推广代码

前言 大家好，今天转网站发现了一个很好看的样式，就把它给扒出来了，原作者是墨星博客，在此非常感谢。并且做成了一排两个的摆放样式。并且自适应移动端，显示一行一个。这个可以很好起到宣传作用！ 效果图 教程开始 将下面代码放入wordpress后台-外观-小工具–自定义HTML代码，选择一个自己喜欢的位置，推荐顶部全宽度或者底部全宽度。 代码部分 [hidecontent type="payshow"] <style> .mxchild-card{display:flex;align-items:stretch;min-height:80px;background:rgb(41,151,247);border-radius:8px;-webkit-mask-image:radial-gradient(circle at 88px 4px,transparent 4px,red 4.5px),radial-gradient(closest-side circle at 50%,red 99%,transparent 100%);-webkit-mask-size:100%,2px 4px;-webkit-mask-repeat:repeat,repeat-y;-webkit-mask-position:0 -4px,87px;-webkit-mask-composite:source-out;mask-composite:subtract;position:relative;padding-right:100px;overflow:hidden}.card-left{width:88px;text-align:center;color:#fff;font-weight:bold;display:flex;align-items:center;justify-content:center;flex-shrink:0}.card-left .price{display:flex;align-items:baseline;line-height:1}.card-left .currency{font-size:16px}.card-left .amount{font-size:32px;margin-left:2px}.card-right{padding:12px;display:flex;flex:1;flex-direction:column;justify-content:center}.card-info{margin:0;font-size:14px;line-height:1.4;color:#fff}.card-subtitle{margin:0;font-size:12px;color:rgba(255,255,255,0.9);margin-top:2px;line-height:1.3}.coupons-container{display:flex;flex-wrap:wrap;gap:8px;width:100%}.coupons-container .mxchild-card{flex:1;min-width:300px}@media (max-width:768px){.coupons-container{flex-direction:column;gap:8px}.coupons-container .mxchild-card{min-width:100%}}.mxchild-card .buy-button{content:"立即购买";position:absolute;right:12px;top:50%;transform:translateY(-50%);background:#fff;color:rgb(41,151,247);padding:6px 12px;border-radius:5px;font-size:14px;font-weight:bold;white-space:nowrap;cursor:pointer;text-decoration:none;display:inline-block;text-align:center;border:none;transition:all 0.3s ease}.mxchild-card .buy-button:hover{background:rgba(255,255,255,0.9);transform:translateY(-50%) scale(1.05)} </style>...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 44天前
#子比美化
 2026-03-01
300积分
子比主题 – 精选滑动卡片小工具-识趣者资源
子比工具

功能子比主题 – 精选滑动卡片小工具

这是一款子比主题精选滑动卡片小工具，可以左滑右滑 小工具配置 代码部署 [hidecontent type="payshow"] 定位:/wp-content/themes/zibll中把文章附件解压，然后在func.php文件里添加L下代码(没有这个文件自己创建一个，然后记得加php头，要不然会报错 $widgets_files = array( 'tengfei_best_swiper.php', // 小工具文件名 ); foreach($widgets_files as $file) { require get_template_directory() . '/tengfei/widgets/' . $file; } 子比主题 - 精选滑动卡片小工具下载 密码1pp6 [/hidecontent]
识趣资源的头像-识趣者资源
至尊会员识趣资源· 46天前
#子比美化
 2026-02-28
50积分
子比主题-开通会员自动送积分功能-识趣者资源
子比功能

功能子比主题-开通会员自动送积分功能

添加代码后,用户续费和开通预设的月数后会自动进行积分赠送 示例图 部署教程 第一版 [hidecontent type="payshow"] 代码放到zibll/func.php没有就创建一个 创建func.php文件第一行写<?php换行插入下方代码 /** * 会员开通/续费送积分功能 */ // 监听支付成功事件 add_action('payment_order_success', 'zib_vip_payment_give_points', 15); /** * 会员开通/续费送积分 * @param object $pay_order 订单对象 */ function zib_vip_payment_give_points($pay_order) { // 检查是否是会员订单 if (empty($pay_order->user_id) || empty($pay_order->product_id)...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 1个月前
#子比美化
 2026-02-27
80积分
子比主题美化 – 个人中心按钮修改成头像显示-识趣者资源
子比美化

美化子比主题美化 – 个人中心按钮修改成头像显示

个人觉得使用头像显示比图标显示来的美观实用，找了好久才找到这个方法修改原主题头像的方法，如果对您有帮助，记得保存收藏本站哈。 效果图 子比主题的个人中心的默认图标不太好看，就算用户已经登录，也不会显示用户的头像。 修改的意图是提高识别度和用户展示性 教程 [hidecontent type="payshow"] 打开子比文件zib-header.php路径地址为 wp-content/themes/zibll/inc/functions/zib-header.php 找到第156行代码开始进行注释，如下： $sign_but = '<li><a href="javascript:;" class="btn' . ($user_id ? '' : ' signin-loader') . '">' . zib_get_svg('user', '50 0 924 924') . '</a> <ul class="sub-menu"> '...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 1个月前
#子比美化
 2026-02-27
密码验证
子比主题 – 全屏加载动画小工具-识趣者资源
子比工具

功能子比主题 – 全屏加载动画小工具

这篇文章是全屏加载动画小工具，原创来自heo某站长，UI很不错，蒙娜丽莎的描边的加载动画，喜欢的自行部署吧！ 该工具与阿呆日记提供 视频展示 小工具配置 代码部署 [hidecontent type="password" password="ly5211314" img_id="" img_url="" desc=""] 定位:/wp-content/themes/zibll中把文章附件解压，然后在func.php文件里添加L下代码(没有这个文件自己创建一个，然后记得加php头，要不然会报错 $widgets_files = array( 'zibbox_loading_screen.php', // 小工具文件名 ); foreach($widgets_files as $file) { require get_template_directory() . '/zibbox/widgets/' . $file; } 全屏加载动画小工具下载 密码bcy6 [/hidecontent]
识趣资源的头像-识趣者资源
至尊会员识趣资源· 1个月前
#子比美化
 2026-02-27
100积分
子比主题-文章页购买样式-识趣者资源
子比美化

美化子比主题-文章页购买样式

效果图 部署教程 [hidecontent type="payshow"] <style> /* 文章页渐变AD */ .wzw-col-lg3{width:100%;}.wzw-group .wzw-item.style4 {margin-bottom: 12px;}.wzw-group .wzw-item{font-family:"Segoe UI",sans-serif;display:block;position:relative;padding:18px;border-radius:12px;cursor:pointer;transition:transform 0.3s ease,box-shadow 0.3s ease;box-shadow:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -4px rgba(0,0,0,0.1);}.wzw-group .wzw-item.style4 .wzw-item__badge{background:linear-gradient(135deg,#ff5473 10%,#d855c9 100%);}.wzw-group .wzw-item__badge{position:absolute;top:12px;right:12px;font-size:12px;font-weight:600;padding:2px 8px;border-radius:5px;user-select:none;color:#fff;}.wzw-group .wzw-item.style4 .wzw-item__title{color:#1fbc45;}.wzw-group .wzw-item__title{position:relative;font-weight:bold;font-size:16px;margin-bottom:8px;letter-spacing:0.8px;text-shadow:0...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 1个月前
#子比美化
123456…36跳转