RiPro 主题美化-整理头像下拉美化菜单,修复部分css样式错位
效果展示一
效果展示二
本次美化教程基于“会员引导”功能制作,需与导航添加“开通会员”按钮,不然美化后按钮错位。
1. 主题目录:parts -> navbar.php 文件,在“<div class=”actions”>”后添加如下代码
<div title="加入VIP,免费下载全站素材" class="menu-head_you-container"> <ul id="menu-head_you" class="menu"> <li id="menu-item-967" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-967"> <a href="vip"><i class="fa fa-diamond"></i> 开通会员</a> </li> </ul> </div>
2. 主题目录:parts -> navbar.php 文件,在头部“global $current_user;”后面添加如下代码
$CaoUser = new CaoUser($current_user->ID);
提示:第2步必须添加,否则报错
3. 主题目录:assets -> css -> diy.css 文件,添加如下样式
/*nav设置开始*/ .navbar{height:72px;} .header-gap{height:72px;} .navbar .hhnavwarp:hover .Huserxiala{display:block;} .navbar .menu-item>a{font-weight:400;} .ripro-dark .navbar .menu-item>a{color:rgba(255,255,255,1);} .sub-menu:before{content:'';width:20px;height:20px;border-radius:1px;background-color:#fff;-webkit-transform:rotate(45deg);transform:rotate(45deg);position:absolute;top:-5px;left:40px;z-index:0;} .navbar .user-pbtn{height:80px;} .navbar .user-pbtn:hover span{color:#f9b015;} .navbar .login-btn{margin:0 20px;color:#4d555d;background-color:#ffffff00;font-size:14px;} .navbar .actions>div+div{font-weight:700} .navbar .actions>div+div{margin-left:5px;font-weight:700;} .navbar .navbar-button,.off-canvas .canvas-close{background-color:#f7f7ff;border:1px solid #f7f7ff;color:#f9b015;background-image:none;-webkit-animation:none;} .burger{background-color:#f7f7ff;border:1px solid #f7f7ff;color:#f9b015;} .burger:before,.burger:after{background-color:#f9b015;} .actions .burger:before,.actions .burger:after{content:none;} .menu-head_you-container li a{margin:0 10px;color:#333;font-size:14px;} .sub-menu li>a:hover:before,.sub-menu li.current_page_item>a:before,.sub-menu li.current-menu-item>a:before,.sub-menu li.current_page_ancestor>a:before,.sub-menu li.current-menu-ancestor>a:before,.sub-menu li.current-menu-parent>a:before{opacity:1;} .sub-menu li>a:hover,.sub-menu li.current_page_item>a,.sub-menu li.current-menu-item>a,.sub-menu li.current_page_ancestor>a,.sub-menu li.current-menu-ancestor>a{color:#f9b015;padding-left:1.75rem;opacity:1;} .sub-menu li a{font-size:.875rem;padding:.5rem 1rem .5rem 1.5rem;position:relative;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;} .sub-menu li a:before{content:'';height:1px;width:10px;background-color:#f9b015;opacity:0;-webkit-transition:all 300ms linear 0ms;-khtml-transition:all 300ms linear 0ms;-moz-transition:all 300ms linear 0ms;-ms-transition:all 300ms linear 0ms;-o-transition:all 300ms linear 0ms;transition:all 300ms linear 0ms;position:absolute;left:.75rem;top:50%;-webkit-transform:translate(0%,-50%);-khtml-transform:translate(0%,-50%);-moz-transform:translate(0%,-50%);-ms-transform:translate(0%,-50%);-o-transform:translate(0%,-50%);transform:translate(0%,-50%);} @media (min-width:750px){.module.slider .post{height:400px;} .menu-head_you-container{display:block !important;} .site-header .burger,.site-header .search-open,.site-header .login-btn,.site-header .tap-dark{margin-top:25px!important;}} /*nav设置结束*/
1. 本站所有资源来源于用户上传和网络,仅作为演示数据,如有侵权请邮件联系站长!
2. 盗版,破解有损他人权益和违法作为,请各位会员支持正版!
3. 本站所有源码仅供学习,不保证源码完整性,请勿商业,请勿任何违法用途,后果自负!
4. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!!!
一品优选 » RiPro 主题美化-整理头像下拉美化菜单,修复部分css样式错位
2. 盗版,破解有损他人权益和违法作为,请各位会员支持正版!
3. 本站所有源码仅供学习,不保证源码完整性,请勿商业,请勿任何违法用途,后果自负!
4. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!!!
一品优选 » RiPro 主题美化-整理头像下拉美化菜单,修复部分css样式错位
售后服务:
-
售后服务范围 1、商业模板使用范围内问题免费咨询 2、源码安装、模板安装(一般 ¥50-300)服务答疑仅限SVIP用户 3、单价超过200元的模板免费一次安装,需提供服务器信息。 付费增值服务 1、提供dedecms模板、WordPress主题、discuz模板优化等服务请详询在线客服 2、承接 WordPress、DedeCMS、Discuz 等系统建站、仿站、开发、定制等服务 3、服务器环境配置(一般 ¥50-300) 4、网站中毒处理(需额外付费,500元/次/质保三个月) 售后服务时间 周一至周日(法定节假日除外) 9:00-21:00 免责声明 本站所提供的模板(主题/插件)等资源仅供学习交流,若使用商业用途,请购买正版授权,否则产生的一切后果将由下载用户自行承担,有部分资源为网上收集或仿制而来,若模板侵犯了您的合法权益,请来信通知我们(Email: 1138282036@qq.com),我们会及时删除,给您带来的不便,我们深表歉意!