子比主题丨首页添加一个多功能导航模块小工具

子比主题丨首页添加一个多功能导航模块小工具
此内容为付费资源,请付费后查看
50积分
站长QQ:1240555208
作者长期在线
付费资源
已售 30

也想出现在这里? 联系我们
信息

给子比主题首页添加一个多功能的导航小工具,我感觉这个小工具还是不错的,放到首页,确实给自己子比主题美化了很多样式,喜欢的就下载配置一下吧!

图片[1]-子比主题丨首页添加一个多功能导航模块小工具-大海资源库

部署教程

首先我们要知道他这个多导航小工具一共分四个文件:"两个CSS文件","一个JS文件","一个HTML文件"。

我把文件全部放在了底部,然后我们把里面的CSS和JS目录改成你的即可,如下代码是HTML代码,如果不想本地可以用我的,如果是用我的那就直接将HTML代码放到:小工具-自定义HTML-放到你想放的地方。

HTML代码

里面的路径是我自己的,如果想本地,下载底部附件,放到你的服务器替换即可,如果不想放本地,可直接使用下面的HTML放到小工具。

<!--首页四个导航模块样式文件-->
  <meta charset="UTF-8">
  <link rel="stylesheet" href="https://www.tfbkw.com/css/dhmk.css">
  <link rel="stylesheet" href="https://www.tfbkw.com/css/iconfontdhmk.css">
  <script type="text/javascript" src="https://www.tfbkw.com/js/iconfontdhmk.js"></script>
<!--首页四个导航模块-->
<div class="ads-box"> 
  <div class="home-first"> 
  <div class="container hide_sm"> 
   <div class="row ron"> 
     <!--导航模块 1-->
    <div class="col-1-4"> 
     <div class="hf-widget hf-widget-1 hf-widget-software"> 
    <h3 class="hf-widget-title"> 
    <svg class="ydicon" aria-hidden="true">
      <use xlink:href="#icon-huiyuan" rel="external nofollow" ></use>
    </svg> 
    <a href="/user/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener">会员中心</a><span>专属贴心服务</span> 
    </h3> 
    <div class="hf-widget-content"> 
     <div class="scroll-h"> 
      <ul> 
       <li><a href="/user/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener">
       <svg class="kuai" aria-hidden="true">
      <use xlink:href="#icon-dingyue" rel="external nofollow" ></use>
       </svg><span>升级会员</span></a></li> 
       <li><a href="/message/news" rel="external nofollow"  target="_blank" rel="noopener">
       <svg class="kuai" aria-hidden="true">
      <use xlink:href="#icon-xiaoxi" rel="external nofollow" ></use>
       </svg><span>消息订单</span></a></li> 
       <li><a href="/renzheng/" rel="external nofollow"  target="_blank" rel="noopener">
       <svg class="kuai" aria-hidden="true">
      <use xlink:href="#icon-zhinan" rel="external nofollow" ></use>
       </svg><span>身份认证</span></a></li> 
       <li><a href="/newposts/" rel="external nofollow"  target="_blank" rel="noopener">
       <svg class="kuai" aria-hidden="true">
      <use xlink:href="#icon-tougaofabu" rel="external nofollow" ></use>
       </svg><span>资源投稿</span></a></li> 
      </ul>       
     </div> 
    </div> 
     </div> 
    </div> 
      <!--导航模块 2-->
    <div class="col-1-4"> 
     <div class="hf-widget hf-widget-2"> 
    <h3 class="hf-widget-title">
    <svg class="ydicon" aria-hidden="true">
      <use xlink:href="#icon-tishi" rel="external nofollow" ></use>
    </svg>
    <a href="/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener">广告服务</a><span>广告位展示</span> </h3> 
    <div class="hf-widget-content"> 
     <div class="no-scroll hf-tags"> 
      <a class="style_orange" href="/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener"><span>广告位 1</span></a> 
      <a class="" href="/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener"><span>广告位 2</span></a> 
      <a class="" href="/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener"><span>广告位 3</span></a> 
      <a class="" href="/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener"><span>广告位 4</span></a> 
      <a class="" href="/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener"><span>广告位 5</span></a> 
      <a class="" href="/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener"><span>广告位 6</span></a> 
      <a class="" href="/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener"><span>广告位 7</span></a> 
      <a class="" href="/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener"><span>广告位 8</span></a> 
     </div> 
    </div> 
     </div> 
    </div> 
      <!--导航模块 3-->
    <div class="col-1-4"> 
     <div class="hf-widget hf-widget-1 hf-widget-hot-cats"> 
    <h3 class="hf-widget-title">
    <svg class="ydicon" aria-hidden="true">
      <use xlink:href="#icon-kuaijiedaohang-ceping" rel="external nofollow" ></use>
    </svg>
    <a href="https://www.tfbkw.com/" target="_blank" rel="noopener">快捷导航</a><span>腾飞资源教程</span> </h3> 
    <div class="hf-widget-content"> 
     <div class="scroll-h"> 
      <ul> 
       <li><a href="https://www.tfbkw.com/category/yuanma" target="_blank" rel="noopener">
       <i class="hhicon iconfont icon-moban"></i><span>网站源码</span></a></li> 
       <li><a href="https://www.tfbkw.com/category/wpmb" target="_blank" rel="noopener">
<i class="hhicon iconfont icon-yuanma"></i><span>主题模板</span></a></li> 
<li><a href="https://www.tfbkw.com/category/wpjc" target="_blank" rel="noopener">
<i class="hhicon iconfont icon-jiaocheng"></i><span>教程分享</span></a></li> 
<li><a href="https://www.tfbkw.com/links" target="_blank" rel="noopener">
<i class="hhicon iconfont icon-moban"></i><span>友情链接</span></a></li> 
      </ul> 
     </div> 
    </div> 
     </div> 
    </div> 
      <!--导航模块 4-->
    <div class="col-1-4"> 
     <div class="hf-widget hf-widget-4"> 
    <h3 class="hf-widget-title">
    <svg class="ydicon" aria-hidden="true">
      <use xlink:href="#icon-dongtai" rel="external nofollow" ></use>
    </svg>
    <a href="https://www.tfbkw.com/" target="_blank" rel="noopener">最新活动</a><span>注册会员享福利</span>      
    </h3> 
    <div class="hf-widget-content"> 
<div class="scroll-h"> 
<ul> 
<li><h3><a href="https://www.tfbkw.com/xin-zaobao" target="_blank" rel="noopener"> <i class="icon-time"></i> <span>每日新闻早报 60s</span><em>立即阅读</em></a></h3></li> 
<li><h3><a href="/user/" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank" rel="noopener"> <i class="icon-time"></i> <span>签到领积分,资源免费下!</span><em>会员中心</em></a></h3></li> 
      </ul>       
     </div> 
    </div> 
     </div> 
    </div> 
   </div> 
  </div> 
   </div>
</div>
<!--首页四个导航模块结束-->
有问题及时联系站长,QQ:1240555208
更多优质资源在QQ群里,可以进群领取:902992548~
© 版权声明
THE END
喜欢就支持一下吧
点赞5 分享
有资源失效请在下面及时反馈,谢谢!! 抢沙发
头像
点击夸一夸可以快速回复哦~
提交
头像

昵称

夸夸
夸夸
还有吗!没看够!
取消
昵称表情代码

    暂无评论内容