RiTheme共34篇

Ri主题 - 夜间模式动态星空背景-汇聚访

实用Ri主题 – 夜间模式动态星空背景

这是给RiProV5的夜间模式适配的一款动态星空背景的样式，此样式在子比主题主题里也适配过，但是两款不是同一个代码，总体来说还是挺好看的，唯一的不足就是有点吃性能，有喜欢的朋友自行部署吧！ 演示效果： 代码部署： [hidecontent type="payshow"] header.phpCSS代码 定位：/wp-content/themes/ripro-v5/header.php中找到<main>这个标签，然后在此标签下添加以下代码： <div data-v-addee5d6="" data-v-2478e6e8="" class="background"> <div data-v-addee5d6="" class="stars small"></div> <div data-v-addee5d6="" class="stars medium"></div> <div data-v-addee5d6="" class="stars large"></div> </div> 定位：后台主题设置 - 基本设置 - 自定义CSS样式代码中添加以下代码（需下载文章附件中的图片素材，再修改代码中的“素材所放置的路径”为素材路径）： .background[data-v-addee5d6] { position: fixed; top: 0;...
建站笔记
09514
汇聚访的头像-汇聚访核心会员汇聚访3个月前
Ri主题 - 顶部导航栏日夜切换美化-汇聚访

实用Ri主题 – 顶部导航栏日夜切换美化

这是汇聚访适配RiProV5主题的一款顶部导航栏日夜切换的美化样式，这个效果也是非常可以原创应该是最骚站长，我模仿着也搞了一个同时图标颜色可以自行更改，测试下来总体来说是有一点小bug的，但是不影响使用，话不多说喜欢的自行部署吧！ 演示效果： 代码部署： [hidecontent type="payshow"] CSSJSaction-hover.php 定位：状态后台设置 - 基本设置 - 自定义CSS样式代码中添加以下代码： /*汇聚访：www.huijuf.com*/ .ui-switch { --switch-bg: rgb(135, 150, 165); --switch-width: 48px; --switch-height: 20px; --circle-diameter: 32px; --circle-bg: rgb(0, 56, 146); --circle-inset: calc((var(--circle-diameter) - var(--switch-height)) / 2); }...
建站笔记
0818
汇聚访的头像-汇聚访核心会员汇聚访6个月前
Ri主题 - 顶部导航栏开通会员图标-汇聚访

实用Ri主题 – 顶部导航栏开通会员图标

这是一款RiProV5主题的顶部导航栏开通会员图标，之前我也发过几种导航栏的开通会员图标，但是那几个几乎都差不多，今天汇聚访给大家带来一款全新的，夜间模式我没有适配，需要的自行适配一下吧，话不多说喜欢的自行部署吧！ 演示效果： 代码部署： [hidecontent type="payshow"] CSSmenu.php 定位：后台主题设置 - 基本设置 - 自定义CSS样式代码中添加以下代码： /*汇聚访：www.huijuf.com*/ .btn-floating.btn-sm, .btn-group-sm>.btn-floating.btn { width: 1.8125rem; height: 1.8125rem; transition: all 0.3s ease; } .btn-floating.btn-sm:hover { transform: scale(1.1); box-shadow: 0 4px 12px rgba(103, 58, 183,...
建站笔记
0945
汇聚访的头像-汇聚访核心会员汇聚访6个月前
Ri主题 - 顶部导航栏登录按钮美化-汇聚访

实用Ri主题 – 顶部导航栏登录按钮美化

这是RiProV5主题的一款顶部导航栏登录按钮美化，此效果是我在最骚的网站里看到的，于是就仿了一个出来，手机端以及黑夜模式也都进行了适配，背景颜色仍可自行更改，喜欢的自行部署吧！ 演示效果： 代码部署： [hidecontent type="payshow"] action-hover.phpCSS 定位：/wp-content/themes/ripro-v5/template-parts/header/action-hover.php搜索登录你会看到下方这段代码： <a class="action-btn login-btn btn-sm btn" rel="nofollow noopener noreferrer" href="<?php echo esc_url( wp_login_url(get_current_url())); ?>"><i class="far fa-user me-1"></i><?php _e( '登录', 'ripro' );?></a> 随后复制下方的代码替换上方整段代码： <a class="login-link huijuf-login-btn" rel="nofollow noopener noreferrer" href="<?php...
建站笔记
0947
汇聚访的头像-汇聚访核心会员汇聚访6个月前
Ri主题 - 顶部导航栏添加全局简繁体切换按钮-汇聚访

实用Ri主题 – 顶部导航栏添加全局简繁体切换按钮

这是一款汇聚访适配Ri主题的顶部导航栏添加全局简繁体切换按钮，添加完代码后会在网站导航栏logo的右侧有一个繁简体切换按钮也是十分方便，按钮颜色你可以自行调节，话不多说需要的自行部署吧！ 演示效果： 代码部署： [hidecontent type="payshow"] 定位：/wp-content/themes/ripro-v5/template-parts/header/menu.php找到下方代码（大概在10行之前）： <?php get_template_part( 'template-parts/header/logo-wrapper'); ?> 随后在这段代码的下方添加以下代码： <div class="jelly-button"><a href="javascript:AutoHan()" id="AutoHan" style="color: white;">繁體</a></div> 随后定位：/wp-content/themes/ripro-v5/footer.php找到</footer>标签，在此标签下方添加以下代码： <script> /*汇聚访：www.huijuf.com*/ const currentLanguage = "traditional"; const conversionDelay = 200; function getBrowserLanguage() { const lang = navigator.language...
建站笔记
0737
汇聚访的头像-汇聚访核心会员汇聚访6个月前
Ri主题 - 底部添加波浪特效-汇聚访

实用Ri主题 – 底部添加波浪特效

这是我适配Ri主题的一款底部波浪样式，目前我仅仅适配了日间模式，调整为夜间的话会非常不好看，我也比较懒需要的自己适配吧，还有如搬运本站文章请保留本站版权，话不多说喜欢的自行部署吧！ 演示效果： 代码部署： [hidecontent type="reply"] footer.phpCSS 定位：/wp-content/themes/ripro-v5/footer.php找到</body>这个标签，大概在最末尾，在此标签上方添加以下代码： /*汇聚访：www.huijuf.com*/ <div class="waveHorizontals mobile-hide"> <div id="waveHorizontal1" class="waveHorizontal"></div> <div id="waveHorizontal2" class="waveHorizontal"></div> <div id="waveHorizontal3" class="waveHorizontal"></div> </div> /*汇聚访：www.huijuf.com*/ 定位：主题后台设置 - 基本设置 - 自定义CSS样式代码中添加以下代码（图片在图床，自行本地化）： /*汇聚访：www.huijuf.com*/ .waveHorizontals { width: 100%; height: 20px; position:...
建站笔记
51065
汇聚访的头像-汇聚访核心会员汇聚访6个月前
Ri主题 - 作者头像指针旋转动画-汇聚访

实用Ri主题 – 作者头像指针旋转动画

这是给RiProV5添加的一款作者头像指针旋转动画的样式效果，之前我在子比主题上适配过，今天适配了最新的日主题版本，没啥可说的喜欢的自行部署吧！ 演示效果： 代码部署： [hidecontent type="reply"] 定位：主题后台设置 - 基本设置 - 自定义CSS代码样式中添加以下代码： /*汇聚访：www.huijuf.com*/ .avatar{ -webkit-transition:0.4s; -webkit-transition:-webkit-transform 0.4s ease-out; transition:transform 0.4s ease-out; -moz-transition:-moz-transform 0.4s ease-out; } .avatar:hover{ transform:rotateZ(360deg); -webkit-transform:rotateZ(360deg); -moz-transform:rotateZ(360deg); } /*汇聚访：www.huijuf.com*/ [/hidecontent]
建站笔记
17811
汇聚访的头像-汇聚访核心会员汇聚访6个月前
Ri主题 - 添加文章版权声明（九款）-汇聚访

实用Ri主题 – 添加文章版权声明（九款）

这是给RiProV5添加的九款版权样式，代码集成了CSF框架可自行在主题后台设置不同的样式，因为教程是一体的，这里我就放了一张我觉得不错的演示图片，本版权声明已覆盖原主题的版权样式，故原主题的文章内容底部版权信息已失效，记得保存主题原代码，话不多说喜欢的自行部署吧！ 演示效果： 代码部署： [hidecontent type="reply"] admin-options.phpentry-copyright.phpCSS 定位：/wp-content/themes/ripro-v5/inc/options/admin-options.php搜索single_bottom_copyright随后你会看到这段代码： array( 'id' => 'single_bottom_copyright', 'type' => 'textarea', 'title' => '文章内容底部版权信息', 'sanitize' => false, 'desc' => '不填写则不显示', 'default' => '声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。', ), 在这段代码的下方添加我下面给的代码（添加完即可在主题后台设置 - 布局设置 - 文章内容页布局看到文章页尾版权配置）： array( 'id' =>...
建站笔记
49512
汇聚访的头像-汇聚访核心会员汇聚访6个月前
Ri主题 - 文章页添加FAQ教程-汇聚访

实用Ri主题 – 文章页添加FAQ教程

这是给RiProV5主题文章页添加的一款FAQ教程，本来这个教程是RiPro主题的因为RiPro也不再更新了这里我就适配了一下RiProV5，内容以及标题都可在后台修改，样式方面还是一贯的简约，我这里没适配黑夜模式，有喜欢的自行部署吧！ 演示效果： 代码部署： [hidecontent type="payshow"] 第一步： 首先定位/wp-content/themes/ripro-v5/inc/options/admin-options.php，搜索下方代码：remove_wp_xmlrpc，你将会看到以下整体代码： array( 'id' => 'remove_wp_xmlrpc', 'type' => 'switcher', 'title' => '关闭XML-RPC (pingback) 功能', 'desc' => 'XML-RPC 是 WordPress 用于第三方客户端，关闭后可以防止爆破攻击', 'default' => false, ), 随后在此代码的下方添加以下代码（添加完就可以在主题后台设置 - 网站优化 - 是否显示常见问题FAQ中设置了）： //...
建站笔记
07315
汇聚访的头像-汇聚访核心会员汇聚访6个月前
Ri主题 – 简约侧边栏引导样式（第二款）-汇聚访

实用Ri主题 – 简约侧边栏引导样式（第二款）

这是Ri主题的 简约侧边栏引导样式第二版，之前发过一个比较简陋的样式，这次这个是属于简约并且带有一点灵动效果的，同时适配了夜间模式，手机端设置了隐藏，话不多说有喜欢的自行部署吧！ 演示效果： 代码部署： [hidecontent type="payshow"] footer.phpCSS 定位：/wp-content/themes/ripro-v5/footer.php中找到以下代码（直接搜就可以了）： </footer> 找到后在这个代码的下方添加以下代码，内容自行更改： <div class="floating-service-sidebar right"> <ul class="fsb-buttons"> <li class="fsb-item fsb-qq"> <a href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes" target="_blank"> <i class="fab fa-qq"></i> <div class="fsb-tooltip">QQ</div> </a><div class="fsb-popup qq-popup"><a href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes" target="_blank"> <div class="fsb-account-display">QQ: 123456</div> </a><a...
建站笔记
09112
汇聚访的头像-汇聚访核心会员汇聚访6个月前
1234