子比美化 第24页

实用子比主题 – 简约分类专题标签色调美化

今天给大家分享一个子比主题的分类样式的简约美化，每个人眼光不同，这种就比较简约，适合一些比较正式的站点使用吧！今天分享给大家！还有一点，鼠标悬浮专题分类或是标签上还有不同的颜色变化哦！ 演示效果： 代码部署： [hidecontent type="payshow"] 还是一样，代码直接放到子比主题后台设置->自定义代码->自定义CSS样式即可！ /*汇聚访：www.huijuf.com*/ .posts-item.card .item-tags .but, .posts-item.card .meta-category a { position: relative !important; overflow: hidden !important; z-index: 1 !important; display: inline-block !important; padding: 4px 10px !important; margin: 0 6px 8px 0...

建站笔记

01265

汇聚访12个月前

实用子比主题 – 侧边栏添加发帖按钮样式

给子比主题论坛侧边加一个发帖按钮的样式代码，这个按钮样式非常的简约，自己填写跳转链接即可，喜欢的自行部署吧！ 演示效果： 代码部署： [hidecontent type="reply"] 这是小工具，直接放到你喜欢的位置，然后自定义HTML里即可! <div style="margin: 20px 0;"> <a href="/posts-edit/" style="display: block; width: 100%; background-color: #1677ff; color: white; padding: 12px 0; border-radius: 8px; text-align: center; text-decoration: none; font-size: 16px; font-weight: 500;"> + 我要发帖...

建站笔记

07915

汇聚访12个月前

实用子比主题 – 文章标题美化

今天无聊看别的站点的时候发现了这个文章小标题的美化，觉得好看搞了下来，今天分享给大家，希望对大家有用！如文章内的的软件介绍就是小标题的美化效果！ 演示效果： 代码部署： [hidecontent type="payshow"] 直接将代码放到子比设置-自定义CSS样式里即可！ /*汇聚访：www.huijuf.com*/ .wp-posts-content h2 { background-color: var(--body-bg-color); padding: 6px 0px 6px 16px; border-radius: 5px; } .wp-posts-content > h2:before, .wp-posts-content > h2.wp-block-heading:before, .wp-posts-content > h2:not([class]):before { content: ""; display: inline-block !important;...

建站笔记

011614

汇聚访12个月前

实用子比主题 – 用户登陆后右下角弹窗提示

这个有两个版本，别人做的，今天分享给大家，希望大家能喜欢！第二个为优化版，优化几个bug，第一个就是不显示上次登录ip，第二个就是不会自动消失，第三个就是时间不对，同时也增加了用户名的显示！ 演示效果： 效果一： 效果二： 代码部署： [hidecontent type="reply"] 效果一效果二 把代码复制到functions.php文件中即可。 // 将以下代码添加到主题的 functions.php 文件 function zib_login_security_notice() { if (is_user_logged_in() && !wp_is_mobile()) { // 添加移动端判断 $user = wp_get_current_user(); $login_ip = !empty($_SERVER['HTTP_X_FORWARDED_FOR']) ? explode(',', $_SERVER['HTTP_X_FORWARDED_FOR'])[0] : $_SERVER['REMOTE_ADDR']; $login_time...

建站笔记

1413115

汇聚访12个月前

实用子比主题 – 渐变首页栏目美化

今天给大家分享一个渐变的首页栏目，之前写了一篇二次元美化的，今天给大家分享一下这个效果！原创应该是炙焰！我也算是记录一下，防治效果丢失！ 演示效果： 代码部署： [hidecontent type="payshow"] 直接把下方代码放到后台子比设置-自定义css样式即可！ .index-tab ul>li{border-radius:7px;background:none;color:#000;transition:background-color .5s ease}.index-tab ul>li.active{background:linear-gradient(45deg,var(--gradient-active));background-size:400% 400%;animation:GradientShift 15s ease infinite}@keyframes GradientShift{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}} :root { --gradient-base-1: 255,127,80; --gradient-base-2: 148,143,255; --gradient-base-3: 76,175,80; --gradient-base-4: 255,165,0; --gradient-active: rgba(var(--gradient-base-1),0.3) 0%,rgba(var(--gradient-base-2),0.3) 25%,rgba(var(--gradient-base-3),0.3) 50%,rgba(var(--gradient-base-4),0.3) 75%,rgba(var(--gradient-base-1),0.3)...

建站笔记

014212

汇聚访12个月前

实用子比主题 – 悬浮按钮简洁美化

今天给大家分享一个子比主题悬浮按钮的简洁版美化，希望对大家有帮助！ 演示效果： 代码部署： [hidecontent type="reply"] .float-right .float-btn { color: #555; background-color: #fff; text-align: center; cursor: pointer; position: relative; border-radius: 4px; border-bottom: 1px solid #f8f8f8; box-shadow: 0 0px 6px 0 rgba(76, 86, 114, .12); width: 39px;...

建站笔记

51097

汇聚访12个月前

实用子比主题 – 动态渐变光效

今天逛站点的时候发现了这个效果，感觉挺好看的就扒了下来，今天分享给大家！顺便也记录一下！防止代码丢失！ 演示效果： 代码部署： [hidecontent type="payshow"] 代码素材图片 .hg-yj p span { font: 100 3.0em/1"Oswald", sans-serif; letter-spacing: 0; padding: .25em 0 .155em; display: block; margin: 0 auto; text-shadow: 0 0 80px rgb(255 255 255 / 50%); background:...

建站笔记

01448

汇聚访12个月前

实用子比主题 – 文章归档页面模板修改版

今天给大家带来子比主题的文章归档页面，这个页面是二改修复过的，希望对大家有帮助！ 演示效果： 代码部署： [hidecontent type="reply"] 定位：/wp-content/themes/zibll/pages，新建一个文件，但是后缀是php，如grace.php，然后将下面的附件放进去，然后我们到：WP后台–>>页面–>>新建页面–>>模版–>>选择Grace-文章归档新版！随后发布即可！文件在文件附件里，自行下载即可！ [/hidecontent]

建站笔记

09312

汇聚访12个月前

实用子比主题 – 昼夜切换模式新增过度动画

今天给大家分享一个昼夜切换的过度动画，原作者为囚墨，希望大家能够喜欢！话不多说，直接开始部署！ 演示效果： 代码部署： [hidecontent type="reply"] 首先找到相应的代码位置： /wp-content/themes/zibll/js/main.min.js，这里的代码是压缩过的，可以将main.js里的代码复制到main.min.js里，替换代码后再将代码进行压缩即可！随后搜索主题切换，替换主题切换事件方法！ $('.toggle-theme').click(function(e) { // 缓存所有DOM元素和初始值，避免重复查询 var body = $('body'); var isDark = body.hasClass('dark-theme'); var tinymceBody = $('#post_content_ifr').contents().find('body'); var enlighter = $('.enlighter-default'); var highClasses = { white: 'enlighter-t-' + _win.highlight_white_zt, dark:...

建站笔记

79015

汇聚访12个月前

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

这是一款子比主题右侧可爱的返回顶部悬挂猫，点击它就会自动帮你返回到网站的顶部，在返回页面的同时，小猫也会跟随着返回，十分可爱灵动，有喜欢的朋友自行部署吧！ 演示效果： 代码部署： [hidecontent type="reply"] 首先把文章内的附件下载下来解压到子比主题目录，和后面的目录一样，定位：/wp-content/themes/zibll/func.php，没有这个文件自己创建一个，然后记得加php头，要不然会报错，将下面的代码放里面！ function back_to_top_cat() { echo '<script src="/wp-content/themes/zibll/assets/js/cat.js"></script> <script type="text/javascript" src="/wp-content/themes/zibll/assets/js/szgotop.js"></script> <link rel="stylesheet" type="text/css" href="/wp-content/themes/zibll/assets/css/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'); 子比返回顶部悬挂猫附件下载提取码e6ZM [/hidecontent]

建站笔记

07110

汇聚访12个月前

上一页1…2223242526…33下一页跳转