手动制作19楼二级导航教程，分享代码

╣季节变换 · 发表于 2012-11-14 20:41:55

这次和兔友们分享的是，自己给自己的论坛添加一个二级导航！
样子和大白兔的一样！（看图）

不要想象的很复杂，很简单!!!

怎么样达到效果，两点：①添加模版代码、②添加样式代码

就解决了，就这么简单！

首先给大家代码！代码也是在其它第三方模版上移植过来的{:soso_e120:}
模版文件代码

<div class="nav_bd">
<ul class="nav_bd_ul">
<li class="nav_spe"><a title="这年头，不了解些网络技术？" href="forum-102-1.html">扣扣技术</a></li>
<li><a title="把SEO当做任务，今天你做任务了吗？" href="forum-91-1.html"> SEO交流 </a></li>
<li><a title="windows 用不淘汰的技术" href="forum.php?gid=96">电脑技术</a></li>
<li><a title="装饰，美化，主题破解" href="forum-99-1.html">主题美化</a></li>
<li><a title="精品软件" href="forum-98-1.html">精品软件</a></li>
<li><a title="互助求生" href="forum-93-1.html">站长互助</a></li>
<li><a title="DZ 给我们一个平台" href="forum.php?gid=135">Discuz</a></li>
<li><a title="PHPwind 模板插件" href="forum.php?gid=138">PHPwind</a></li>
<li><a title="我们因为有共同的爱好，聚集在一起" href="forum-94-1.html">链接互换</a></li>
<li><a title="遇到难题了？" href="forum-120-1.html">P S技巧</a></li>
<li class="nav_spe"><a title="PHP语言环境" href="forum-125-1.html">PHP环境</a></li>
<li><a title="ASP语言环境学习" href="forum-124-1.html">ASP环境</a></li>
<li><a title="学我所用" href="forum-122-1.html">Html学习</a></li>
<li><a title="生活从设计开始" href="forum-119-1.html">3D MAX </a></li>
<li><a title="最原始的，最真实的" href="forum-118-1.html">CAD技术</a></li>
<li><a title="博客，博客人生" href="forum-143-1.html">WP主题</a></li>
<li><a title="软文发布" href="forum-95-1.html">推广中心</a></li>
<li><a title="吹牛这点事，谁比我水？" href="forum-146-1.html">灌水中心</a></li>
<li><a title="游戏人生" href="userapp.php">游戏中心</a></li>
<li><a title="每个人都是自己的导演" href="plugin.php?id=it186_qiyi:it186_qiyi">影视中心</a></li>
</ul>
</div>

复制代码

模版样式代码

.nav_bd { background: url({STYLEIMGDIR}/nav_bg01.png) no-repeat scroll 0 -24px transparent; height: 62px; margin: 0 auto; width:960px; overflow: hidden; }
.nav_bd_ul { float: left; margin: 5px 0 0 7px;}
.nav_bd_ul li { border-left: 1px dashed #CCCCCC; float: left; height: 25px; line-height: 25px; width: 94px; }
.nav_bd_ul li.nav_spe{ border-left:0;}
.nav_bd_ul li a { background: url({STYLEIMGDIR}/nav_bg03.png) no-repeat scroll 10px 9px transparent; color: #333333; display: block; font-size: 14px; height: 25px; padding: 0 13px 0 19px; text-decoration: none; width: 60px; }
.nav_bd_ul li a:hover { background: url({STYLEIMGDIR}/nav_bg02.png) no-repeat scroll 5px center transparent; color: #333333; text-decoration: none; }

复制代码

（默认模版default）的添加方法：

找到目录\template\default\common
①找到header.htm 模版文件右键打开！
Ctrl+F键查找

复制代码

在这串注释的上面添加入模板文件代码，保存！

②找到common.css 模版样式文件右键打开！
直接在所有代码底部粘贴上模版样式代码，保存！

第三方模版添加方法：

同样找到目录\template\你的模版名（不知道自己的模版文件名叫什么去后台界面 » 风格管理找如上图）\common
①找到header.htm 模版文件右键打开！
在最下面的那个DIV 框的结束代码</div>下面加入模版代码！
还是不明白的建议使用Dreamweaver工具打开header.htm 模版文件

点击最下面的DIV框子，在切换到代码窗口在</div>下面加入模版代码！

②找到common.css （若无此文件请找extend_common.css文件）模版样式文件右键打开！
直接在所有代码底部粘贴上模版样式代码，保存！

注意：在修改前先保存好原文件！其实添加的代码很简单，出错的话大不了把添加的代码再删掉!!!

修改好后进入后台更新缓存，更新CSS缓存即可！

大功告成！成功的兔友在下面回复一个{:soso_e182:}小手吧!!!
本文原帖地址http://www.d8tu.com/thread-3920-1-1.html

无任何权限，QQ注册下可下载大部分东西！

另外交换链接，本站链接比较少，大于或等于PR2的快来吧！

交易人生 · 发表于 2013-2-3 12:57:00

                  <li class="nav_spe"><a title="@" href="forum-2-1.html">量化投资</a></li>
                  <li><a title="@" href="forum-36-1.html"> 对冲交易 </a></li>
                  <li><a title="@" href="forum-41-1.html">程序交易</a></li>
                  <li><a title="@" href="forum-37-1.html">国内资讯</a></li>
                  <li><a title="@" href="forum-54-1.html">全球资讯</a></li>
                  <li><a title

zhaomingliang · 发表于 2013-2-3 21:06:37

提示: 作者被禁止或删除内容自动屏蔽

20年前是雷锋 · 发表于 2013-4-16 17:19:48

提示: 作者被禁止或删除内容自动屏蔽

		自动登录	找回密码
密码			立即注册

[发布] 手动制作19楼二级导航教程，分享代码