子比美化 第11页
子比主题美化相关教程
分类
排序
2025-12-13
子比主题 新增页面美化 文章显示今日昨日前天数据页面-识趣者资源

子比主题 新增页面美化 文章显示今日昨日前天数据页面

效果图 [hidecontent type="reply"] 使用方法： 在 /wp-content/themes/zibll/pages 文件夹内新建“documentnav-maosiji.php”文件 将以上代码放入文件内 后台新建页面即可 Page页面代码 <?php /** * Template name: Maosiji-文档导航 * Description: Document navigation */ global $post; $post_id = $post->ID; $this_options = get_post_meta($post_id, 'documentnav_options', true); $one_cat = !empty($this_options['cat']) ?...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 右侧自定义悬浮按钮美化-识趣者资源

子比主题 – 右侧自定义悬浮按钮美化

这个自定义悬浮按钮样式是狐狸忘记从哪位B2站长那里扒来的，说不上原创，但是它是由狐狸库适配用在子比主题上。扒来也很久了，一直没有去适配用到子比主题上，话不多说直接开始！ 功能说明 适配“会员”按钮，点击后自动跳转开通子比主题会员弹窗。 增加“昼夜”切换模式，点击后切换“日间”或“夜间”模式。 适配“签到”按钮，点击后自动签到。 替换抽奖按钮及图标，可自定义图标&链接。 重构“返回顶部”的监听滚动及点击事件Javascript代码。 代码部署 [hidecontent type="reply"] 代码一共三个和一个附件，怎么使用呢？很简单HTML放到：WP后台–>>外观–>>小工具–>>自定义HTML将小工具放到：所有页面-侧边栏-顶部位置或者所有页面，自己放一下小工具里面 CSS代码放到：子比主题–>>自定义CSS样式即可！ Javascript代码放到：子比主题–>>自定义javascript代码即可，JS代码用处就是返回顶部的用处！ HTMLCCSJS <!-- * @Description : 自定义悬浮按钮 * @Url : https://www.huliku.com/ * @Email : ihuliku@qq.com * @Date : 2024-01-18 13:14:52 --> <div class="huliku-float">...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 仿Mac三条文章底部样式-识趣者资源

子比主题 – 仿Mac三条文章底部样式

这是一款仿Mac三条文章底部样式，不是在附件下载的下面是在文章的下面，一定要看清楚，喜欢的自行部署一下吧！ 代码部署 [hidecontent type="reply"] 首先将下面的代码放到：子比主题–>>自定义CSS样式即可！ .sys-item-12 { background-image: url(https://img.alicdn.com/imgextra/i1/2210123621994/O1CN01e5LDEM1QbInIe9Get_!!2210123621994.png); margin-top: 10px; height: 40px; line-height: 40px; font-size: 14px; color: #fff; text-align: center; border-radius: 6px; font-weight: 500; } .sys-item-13 { background-image: url(https://img.alicdn.com/imgextra/i4/2210123621994/O1CN01Tk7v4S1QbInJU77xK_!!2210123621994.png); margin-top: 10px; height: 40px; line-height:...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 给登录模块下拉菜单窗口美化-识趣者资源

子比主题 – 给登录模块下拉菜单窗口美化

给子比主题的登录模块加一个下拉的美化，这是一个窗口美化，效果是不错的，喜欢的自行部署！ 代码部署 [hidecontent type="reply"] 跟着我的教程走不会有任何问题，对于没有搞过的比较复杂，跟好我的步骤！ 我们首先到：/wp-content/themes/zibll/inc/functions/zib-header.php文件，然后搜下面的代码 signin-loader"><div class="badg mb6 toggle-radius c-blue"> 看我注释的代码，然后你也注释了，然后搜索下面的代码 $href .= '<div class="flex jsa header-user-href">'; 替换成下面的代码即可！ $href .= '<img src="https://img.alicdn.com/imgextra/i4/4035900312/O1CN01yCLjR21EAwWbIalSK_!!4035900312.png" class="mascot signin-loader"><p class="explain">主人，请点击头像登录后查看哦~</p><div class="flex jsa header-user-href">'; [/hidecontent]
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – JS弹窗引导提醒样式-识趣者资源

子比主题 – JS弹窗引导提醒样式

给子比顶部加一个弹窗跳转，自带win和mac判断系统，很多站有的在使用这个弹窗，一个简约好看的弹窗，如果喜欢的话可以放到子比里面即可 代码部署 [hidecontent type="reply"] 直接将下面代码放到：子比主题–>>自定义javascript代码即可！ // 判断存在jq资源 try { if($ || jQuery) { tipsFun(); } } catch(e) { let script=document.createElement("script"); script.type="text/javascript"; script.src="https://cdn.mac89.com/common/static/jquery.min.js"; document.getElementsByTagName('head')[0].appendChild(script); script.onload = tipsFun; } function tipsFun() { // 判断用户是否是windows if((navigator.platform == "Win32")...
识趣资源的头像-识趣者资源至尊会员识趣资源· 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个月前
#子比美化
 2025-12-13
子比主题 – 自定义右键菜单美化-识趣者资源

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

给子比主题加一个自定义右键的美化，我觉得这个还是不错的，很简洁而且好看，喜欢的自行部署，当留个笔记吧！ 代码部署 [hidecontent type="reply"] 将下面的代码放到：子比主题–>>自定义底部HTML代码即可，或者也可以放到footer.php文件里面也可以！ 记得修改一下里面的网站地址，要不然用的话都是本站的地址！ <!-- 右键美化 --> <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;-moz-box-shadow:1px 1px 3px rgba (0,0,0,.3);box-shadow:0px 0px 15px #333;position:absolute;display:none;z-index:10000;opacity:0.9; border-radius: 8px;} div.usercm ul{list-style-type:none;list-style-position:outside;margin:0px;padding:0px;display:block} div.usercm ul li{margin:0px;padding:0px;line-height:35px;} div.usercm ul li a{color:#666;padding:0 15px;display:block}...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 悬浮按钮添加繁简体切换-识趣者资源

子比主题 – 悬浮按钮添加繁简体切换

给子比主题自带的悬浮按钮添加繁简体切换，这个功能我觉得还是比较实用的，毕竟很多人喜欢用繁体，喜欢的自行部署一下，跟着我的教程走就行，话不多说直接开始！ 代码部署 [hidecontent type="reply"] 首先我们到目录：/wp-content/themes/zibll/inc/options/admin-options.php这个文件里面，然后我们搜 当前页面二维码 然后我们把代码放到这个的上面，如下图和代码！ array( 'title' => '繁简切换', 'desc' => '<div class="c-yellow"><i class="fa fa-fw fa-info-circle fa-fw"></i>此按钮建议放置在最顶部或者最底部 - 腾飞博客</div>', 'id' => 'traditional_chinese', 'type' => 'accordion', 'accordions' => array( array( 'title' => '繁简切换', 'fields'...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 未登录用户禁止查看图片-识趣者资源

子比主题 – 未登录用户禁止查看图片

这是一款子比主题用户没有登入的情况下用户禁止查看图片，但是我觉得这个是一个封面的代码，不过在任何展示文章图片的地方都生效，一行判断搞定，这里只判断了未登录不显示缩略图，所以很简单，一行代码可以解决的东西 代码部署 [hidecontent type="reply"] 我们先到目录：/wp-content/themes/zibll/inc/functions/zibll-theme.php，然后搜if ($show_url)，然后在他这一块的上面加上下面的代码！ // 最后登录判断 if(!is_user_logged_in()){ $img_url = '图片链接地址'; } https://img.alicdn.com/imgextra/i3/2210123621994/O1CN01iV7q291QbInEwlATS_!!2210123621994.jpg [/hidecontent]
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 可爱的返回顶部悬挂猫-识趣者资源

子比主题 – 可爱的返回顶部悬挂猫

这是一款子比主题右侧可爱的返回顶部悬挂猫，我觉得非常我不错，给自己的站点加了很多的趣味，喜欢的自行部署！ 代码部署 [hidecontent type="reply"] 部署之前先说好，这个我是打包好的，你跟着我的步骤走就行了，你不需要改目录，我这边打包好了已经！ 我们到目录：/wp-content/themes/zibll/func.php文件，没有func文件自己创一个，创了之后记得加php头，要不然会报错，把下面的代码放进文件里面， function back_to_top_cat() { echo '<script src="/wp-content/themes/zibll/cat/cat.js"></script> <script type="text/javascript" src="/wp-content/themes/zibll/cat/szgotop.js"></script> <link rel="stylesheet" type="text/css" href="/wp-content/themes/zibll/cat/szgotop.css" /><div class="back-to-top cd-top faa-float animated cd-is-visible" style="top: -600px;"></div>'; } add_action('wp_head', 'back_to_top_cat'); 放进去之后我们将下面的附件上传到：/wp-content/themes/zibll目录下，解压，解压之后就可以了！ 子比主题可爱的返回顶部悬挂猫下载提取码RgyE [/hidecontent]
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 禁用提醒弹窗_新增禁用提示-识趣者资源

子比主题 – 禁用提醒弹窗_新增禁用提示

这个弹窗个人觉得很好看，一般只有“复制提醒（未附带复制失败提醒）”、“禁用F12”、“禁用鼠标右键”，腾飞博客这里把常见的“禁用Ctrl+U”、“禁用Ctrl+S”、“禁用Ctrl+Shift+I”等都分享给大家，新增了“禁用Ctrl+P”、“禁用Ctrl+F” 代码部署 [hidecontent type="reply"] 一共两个地方的代码，跟着我的步骤走不会有问题，话不多说直接开始 禁用代码弹窗样式 我们直接到目录：/wp-content/themes/zibll/header.php，然后我们将下面代码丢到这个文件的最底部就可以了，或者更方便的方法，那就是直接放到：子比主题–>>自定义头部HTML代码即可！ <script> document.onkeydown = function(event) { if (event.ctrlKey && event.keyCode == 83) { // Ctrl + S event.preventDefault(); new Vue({ data: function() { this.$notify({ title: "哎！你瞧瞧你", message: "网页得换方法保存哦~", position:...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 会员购买页面添加背景图-识趣者资源

子比主题 – 会员购买页面添加背景图

给子比主题会员购买页面添加一个背景图样式，看上去非常的美观，给自己的子比网站加点样式美化吧 [hidecontent type="reply"] 直接将代码放到：子比主题–>>自定义CSS样式即可！ /*vip背景开始*/ .vip-card{ background: url(https://img.alicdn.com/imgextra/i1/2210123621994/O1CN01t6ynIT1QbIhcVZ38F_!!2210123621994.png); background-size: auto; background-size: 115%; } .sub-vip-card .vip-card{ background-size: 175%; } .payvip-icon{ background: url(https://img.alicdn.com/imgextra/i1/2210123621994/O1CN01t6ynIT1QbIhcVZ38F_!!2210123621994.png); } /*vip背景结束*/ [/hidecontent]
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 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]
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 评论区背景美化样式（三款样式）-识趣者资源

子比主题 – 评论区背景美化样式（三款样式）

蓝色 红色 混色 [hidecontent type="reply"] 喜欢哪个颜色自己将css放到：子比主题–>>自定义CSS样式即可！ 蓝色红色混色 /*评论美化 - 蓝色款*/ body{ --acg-color:#f8fdff; } .dark-theme{ --acg-color:#323335; } .comment .list-inline>.comt-main { border-color: #71baff80; background-color: var(--acg-color); background-image: url(https://img.alicdn.com/imgextra/i1/2210123621994/O1CN01LFyvtv1QbIhfnZWvp_!!2210123621994.png); } .comment .list-inline>li { vertical-align: top; border-radius: 5px; margin: 0...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
 2025-12-13
子比主题 – 顶部悬挂样式（两款）-识趣者资源

子比主题 – 顶部悬挂样式（两款）

这是一篇子比主题顶部悬挂的样式代码，为什么说是两款，因为第一款是一直挂在了顶部而不是跟着鼠标滑动走的，第二款就是鼠标滑动那么悬挂也跟着走，所以就两款，非常的实用，喜欢的自行部署！ 第一款 第二款 代码部署 [hidecontent type="reply"] 这里只有CSS不一样，HTML代码是一样的，所以先把HTML代码放上去，我代码里面已经提供了图片，那么如果你有图片可以放上自己的图片即可，建议用第二款，毕竟跟随还是比较美观的！ HTML代码 放到：子比主题–>>自定义头部HTML代码即可！ <div class="tengfei_hang"></div> 注意：第一款是一直在顶部不跟随，第二款是跟随鼠标滑动的，下面代码放到：自定义CSS样式即可！ 第一款第二款 @keyframes lampLine-38cc6824 { 0% { transform: rotate(10deg) } to { transform: rotate(-10deg) } } .tengfei_hang { width: 150px; height: 200px; display: inline-block;...
识趣资源的头像-识趣者资源至尊会员识趣资源· 2个月前
#子比美化
1…910111213…15跳转