子比美化 第23页
标签
排序
2026-01-24
500积分
子比主题 – 最新发布和逐字公告小工具-识趣者资源

子比主题 – 最新发布和逐字公告小工具

这是一款子比的最新发布和逐字公告小工具，很早的时候扒的mac站长的样式代码，今天发一下这款样式，我看很多人搬运也没有多少有动态逐字效果，话不多说直接开始 代码部署 [hidecontent type="payshow"] 我这边写了一个隐藏手机的样式，我觉得手机端显示不怎么好看，所以隐藏了！ 小工具代码CSS代码JS代码附件下载 我们将下面的代码放到：WP后台–>>外观–>>小工具–>>自定义HTML代码即可，最新发布那个地方记得换一下自己的logo，因为我这边是自己设计的，你可以设计一下自己的！ <div class="wapnone"> <div id="zuixinfabu" class="index-new"><img draggable="false" oncontextmenu="return false;" src="https://img.alicdn.com/imgextra/i4/2210123621994/O1CN01W26eil1QbInKIXK6C_!!2210123621994.png" alt="最新发布"> <div class="file-format" data-v-2775696c=""> <span id="index-xtips" class="txt-file-format" data-v-2775696c=""></span> <span class="typed-cursor typed-cursor--blink" aria-hidden="true"></span> <span class="file-format-icons" data-v-2775696c=""> <i class="icon_ps" data-v-2775696c=""></i> <i...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 2个月前
#子比美化
 2026-01-28
评论可见
子比主题-在文章页添加彩色渐变框-识趣者资源

子比主题-在文章页添加彩色渐变框

首先把下面的CSS丢到你的主题css样式文件内或style.css样式文件内 [hidecontent type="reply"] #smcos_mhz,#smcos_xgh,#smcos_tkzj,#smcos_xyz,#smcos_gll ,#smcos_xty,#smcos_yyz,#smcos_szh,#smcos_wbk{ /*圆角值,在此定义*/ border-radius: 8px; } /*样式-迷幻紫*/ #smcos_mhz{ color: #555555; overflow: hidden; margin: 10px 0; padding: 15px 15px 15px 35px; /*border-radius: 10px;*/ box-shadow: 6px 0 12px -5px rgb(190, 196, 252), -6px 0...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 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...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 1个月前
#子比美化
 2026-02-07
评论可见
子比主题 – 底部添加波浪滚动-识趣者资源

子比主题 – 底部添加波浪滚动

教程 [hidecontent type="reply"] SVGCSS 将下面的代码放到/wp-content/themes/zibll/footer.php文件里面的的标签前面即可，如果不会的话直接看下图即可！ <svg class="waves" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 28" preserveAspectRatio="none" shape-rendering="auto"style="bottom: 4px;"> <defs> <path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"></path>...
识趣资源的头像-识趣者资源
至尊会员识趣资源· 1个月前
#子比美化
 2026-02-20
100积分
子比美化 – 模拟框增加tips-识趣者资源
子比美化

功能子比美化 – 模拟框增加tips

演示截图 代码教程 将以下代码放置于后台-自定义JavaScript代码内： [hidecontent type="payshow"] $(document).ajaxComplete(function(event, xhr, settings) { // 当所有的 AJAX 请求完成时执行以下代码 $('.modal-dialog').each(function() { // 遍历每个加载的模拟框 $(this).prepend('<span style="position: absolute;bottom: -35px;z-index: 99;left: 0;right: 0;text-align: center;color: #efefef;user-select: none;pointer-events: none;">点击任意地方关闭</span>'); }); }); [/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个月前
#子比美化
 2026-04-09
评论可见
子比主题 – 叠加封面卡片组件右下角添加自定义图片-识趣者资源
子比美化

美化子比主题 – 叠加封面卡片组件右下角添加自定义图片

预览图 [hidecontent type="reply"] 定位：子比主题设置–>>自定义代码–>>自定义 CSS 样式添加以下代码即可： .icon-cover-card { background-image: url('https://img.alicdn.com/imgextra/i3/2215711783898/O1CN01iqZP1P1efKzKO3KeQ_!!2215711783898.png') !important; background-size: 15% auto !important; /* 可以调整这个值改变图片大小 */ background-position: right bottom !important; /* 定位到右下角 */ background-repeat: no-repeat !important; /* 防止重复 */ } [/hidecontent]
识趣资源的头像-识趣者资源
至尊会员识趣资源· 7天前
#子比美化
 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
评论可见
子比主题 – 给文章列表加一个浮动动态效果-识趣者资源

子比主题 – 给文章列表加一个浮动动态效果

给子比主题加一个文章列表浮动效果，这个确实很好看，我记得很多人要这个美化，我今天算记录一下，并且分享给大家 代码部署 [hidecontent type="reply"] 将下面的代码放到：子比主题–>>自定义CSS样式即可！ /*列表加载特效*/ .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} [/hidecontent]
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
 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]
识趣资源的头像-识趣者资源
至尊会员识趣资源· 4个月前
#子比美化
1…2122232425…36跳转