子比美化 第4页
排序
2026-01-28
子比主题-网站右上角添加复制弹出样式-识趣者资源

子比主题-网站右上角添加复制弹出样式

效果演示 投放位置 1.子比主题设置 >> 自定义代码 >> 自定义底部 HTML 代码：添加以下代码：2.其他主题自行添加在主题的 head 或 food 文件底部即可，具体效果自行测试。 [hidecontent type="reply"] <!--第二款复制提示开始--> <script src="https://cdn.jsdelivr.net/gh/1426239465/98dou.cn/fzts/ts.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/1426239465/98dou.cn/fzts/ts.css" /> <script type="text/javascript"> function copy_remind(){ toastr.success("撰文不易，若要转载请务必保留原文链接，谢谢！", "复制成功！"); clear_toastr(1600); // 动态设置消息提示时间 function clear_toastr(time){ setTimeout( function(){...
识趣资源的头像-识趣者资源至尊会员识趣资源· 6天前
#子比美化
 2026-01-28
子比主题-独立下载页面美化第一版-识趣者资源

子比主题-独立下载页面美化第一版

使用说明 修改了下载页面，添加手机自适应，如果更新主题时下载页面（/wp-content/themes/zibll/pages/download.php）没改动代码的话，更新主题后【复制粘贴代码】进去就能用！（更新前记得备份！记得备份！记得备份！不然就被刷新代码了） 效果演示 [hidecontent type="reply"] <?php /** * Template name: XY-资源下载 * Description: XY-独立资源下载页面 */ 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);...
识趣资源的头像-识趣者资源至尊会员识趣资源· 6天前
#子比美化
 2026-01-28
子比主题-顶部添加彩色进度条-识趣者资源

子比主题-顶部添加彩色进度条

CSS代码 [hidecontent type="reply"] /*进度条加载显示*/ #percentageCounter{position:fixed; left:0; top:0; height:3px; z-index:99999; background-image: linear-gradient(to right, #339933,#FF6666);border-radius:5px;} [/hidecontent] javascript代码 [hidecontent type="reply"] //进度条加载显示 $(window).scroll(function() { var a = $(window).scrollTop(), c = $(document).height(), b = $(window).height(); scrollPercent = a / (c...
识趣资源的头像-识趣者资源至尊会员识趣资源· 6天前
#子比美化
 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...
识趣资源的头像-识趣者资源至尊会员识趣资源· 6天前
#子比美化
 2026-01-28
子比主题-侧边滚动条样式美化教程-识趣者资源

子比主题-侧边滚动条样式美化教程

WordPress默认的浏览器侧边栏滚动条是非常丑陋的，当然，有些WordPress主题是自带美化的侧边滚动栏不需要我们自己去美化，有些WordPress主题是没有美化侧边滚动栏的，那么这时就需要我们去美化啦！狐狸站长今天就教大家如何自定义美化侧边滚动栏。其实非常简单，只需一句代码的事情就可以自定义美化WordPress侧边滚动栏，并且代码适用于绝大多数WordPress主题。 使用方法 只需在主题设置自定义CSS代码里面添加美化的css代码即可！ 如果主题没有 自定义代码 那么在WordPress主题目录文件里找style.css文件或者在WordPress后台里找“外观—>自定义—>额外CSS”里面美化的css代码即可！ 单色滚动条样式 [hidecontent type="reply"] /*滚动条显示样式*/ ::-webkit-scrollbar-thumb{ background-color:#FF6666; /*更改喜欢的十六进制颜色*/ height:50px; outline-offset:-2px; outline:2px solid #fff; -webkit-border-radius:4px; border: 2px solid #fff; } /*滚动条大小*/ ::-webkit-scrollbar{ width:8px; height:8px; } /*滚动框背景样式*/ ::-webkit-scrollbar-track-piece{ background-color:#fff; -webkit-border-radius:0; } [/hidecontent]...
识趣资源的头像-识趣者资源至尊会员识趣资源· 6天前
#子比美化
 2026-01-28
子比主题-内嵌其他网页-识趣者资源

子比主题-内嵌其他网页

操作步骤 首先到你的主题根目录，这里以本站子比主题为例，路径为：你的网址/wp-content/themes/zibll/ 新建一个空白文件 空白文件自定义命名，我这里内嵌狐狸论坛，所以就填写 bbs.php 命名后确认一下路径，然后打开刚新建的文件 将下方代码粘贴进去，记得更换你要内嵌的网址 代码 [hidecontent type="reply"] <?php /** * Template name: Huliku - 内嵌网页 * Description: Huliku - 内嵌网页 */ // 获取链接列表 get_header(); $header_style = zib_get_page_header_style(); ?> <!--开始--> <iframe src="你要内嵌的网址" width="100%"...
识趣资源的头像-识趣者资源至尊会员识趣资源· 6天前
#子比美化
 2026-01-28
子比主题-修改“付费资源”文字为图标-识趣者资源

子比主题-修改“付费资源”文字为图标

很多使用子比主题的站长朋友都感觉付费资源图标显示太长，都有意想修改为图标显示，子比官网也有人分享过这方面的教程，但是需要付费购买，找了下相关教程，做一下记录，也跟大家分享一下怎么改掉它！ 效果演示 使用方法 [hidecontent type="reply"] 文件路径：zibll\inc\functions\zib-posts-list.php 搜索【$mark = zibpay_get_pay_mark();】后面添加以下代码 $svg = '<symbol id="icon-points" viewBox="0 0 1024 1024"> <path d="M419.886252 370.432927c119.605022 0 243.995044-26.302516 318.706976-76.460106v91.304594h69.207683V185.366307C807.800911 65.18189 607.999688 0.289697 420.006126 0.289697S32.091467 65.18189 32.091467 185.366307v545.629859c0 120.184417 199.801223 185.076609 387.794785...
识趣资源的头像-识趣者资源至尊会员识趣资源· 6天前
#子比美化
 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-28
子比主题-动态背景美化-识趣者资源

子比主题-动态背景美化

一成不变的白色背景是不是看腻了？那今天我们来更换一下网页背景吧，还是动态的哦~ 效果预览 使用步骤 JS代码 [hidecontent type="reply"] <div id="bubble"></div> <script>class BGBubble{constructor(i){this.defaultOpts={id:"",num:100,start_probability:.1,radius_min:1,radius_max:2,radius_add_min:.3,radius_add_max:.5,opacity_min:.3,opacity_max:.5,opacity_prev_min:.003,opacity_prev_max:.005,light_min:40,light_max:70,is_same_color:!1,background:"#f1f3f4"},"[object Object]"==Object.prototype.toString.call(i)?this.userOpts={...this.defaultOpts,...i}:this.userOpts={...this.defaultOpts,id:i},this.color=this.random(0,360),this.bubbleNum=[],this.requestAnimationFrame=window.requestAnimationFrame||window.mozRequestAnimationFrame ||window.webkitRequestAnimationFr ame||window.msRequestAnimationFrame,this.cancelAnimationFrame=window.cancelAnimationFrame||window.mozCancelAnimationFrame}random(i,t){return Math.random()*(t-i)+i}initBubble(i,t){const a=window.innerWidth,s=window.innerHeight,n=this.userOpts,e=this.random(n.light_min,n.light_max);this.bubble={x:this.random(0,a),y:this.random(0,s),radius:this.random(n.radius_min,n.radius_max),radiusChange:this.random(n.radius_add_min,n.radius_add_max),opacity:this.random(n.opacity_min,n.opacity_max),opacityChange:this.random(n.opacity_prev_min,n.opacity_prev_max),light:e,color:`hsl(${t?i:this.random(0,360)},100%,${e}%)`}}bubbling(i,t,a){!this.bubble&&this.initBubble(t,a);const s=this.bubble;i.fillStyle=s.color,i.globalAlpha=s.opacity,i.beginPath(),i.arc(s.x,s.y,s.radius,0,2*Math.PI,!0),i.closePath(),i.fill(),i.globalAlpha=1,s.opacity-=s.opacityChange,s.radius+=s.radiusChange,s.opacity<=0&&this.initBubble(t,a)}createCanvas(){this.canvas=document.createElement("canvas"),this.ctx=this.canvas.getContext("2d"),this.canvas.style.display="block",this.canvas.width=window.innerWidth,this.canvas.height=window.innerHeight,this.canvas.style.position="fixed",this.canvas.style.top="0",this.canvas.style.left="0",this.canvas.style.zIndex="-1",document.getElementById(this.userOpts.id).appendChild(this.canvas),window.onresize=(()=>{this.canvas.width=window.innerWidth,this.canvas.height=window.innerHeight})}start(){const i=window.innerWidth,t=window.innerHeight;this.color+=.1,this.ctx.fillStyle=this.defaultOpts.background,this.ctx.fillRect(0,0,i,t),this.bubbleNum.length<this.userOpts.num&&Math.random()<this.userOpts.start_probability&&this.bubbleNum.push(new BGBubble),this.bubbleNum.forEach(i=>i.bubbling(this.ctx,this.color,this.userOpts.is_same_color));const a=this.requestAnimationFrame;this.myReq=a(()=>this.start())}destory(){(0,this.cancelAnimationFrame)(this.myReq),window.onresize=null}}const bubbleDemo=new BGBubble("bubble");bubbleDemo.createCanvas(),bubbleDemo.start();</script> [/hidecontent]
识趣资源的头像-识趣者资源至尊会员识趣资源· 6天前
#子比美化
 2026-01-28
子比主题-网站资源下载动态按钮美化-识趣者资源

子比主题-网站资源下载动态按钮美化

一般博客网站的文章底部平时需要一些演示，下载的文件之类，都会做个下载，分享按钮方便使用。觉得还不错就分享出来给大家。 效果预览 我这里提供完整代码就不拆分了，按钮文字你也可以自行更改，需要几个按钮，就复制或删除a标签。博客使用：你直接复制css代码放置公共css中，将body中的div节点放到文章需要显示下载的地方即可。 [hidecontent type="reply"] <style> .tp-down-box{ width: 100%; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; } .down-btn { letter-spacing: 0.1em; cursor: pointer; font-size: 14px; font-weight: 700; line-height: 45px; width: 23%; max-width: 160px; text-decoration:...
识趣资源的头像-识趣者资源至尊会员识趣资源· 6天前
#子比美化
123456…23跳转