织梦二级导航调用代码怎么写？

确保栏目正确设置

在写代码之前,请务必确保您的后台栏目设置是正确的，这是调用成功的前提。

1. 顶级栏目：这些是一级菜单，如“首页”、“关于我们”、“产品中心”、“新闻资讯”等，它们的 “上级栏目” 应该选择 “无” 或 “主站”。
2. 二级栏目：这些是顶级栏目下的子栏目，如“产品中心”下的“产品A”、“产品B”、“产品C”等，它们的 “上级栏目” 必须选择其对应的一级栏目（如“产品中心”）。

使用 channelartlist 标签（最推荐、最规范）

这是织梦官方推荐的处理多级导航的方式,代码结构清晰，对SEO友好。

适用场景：

一级和二级栏目都需要显示,且需要分别处理样式（例如一级菜单水平，二级菜单垂直下拉）。

代码示例：

<ul id="nav">
  {channelartlist typeid='top' currentstyle='active'}
    <li>
      <a href="{dede:field name='typeurl'/}">{dede:field name='typename'/}</a>
      <!-- 循环调用当前一级栏目下的所有二级栏目 -->
      {dede:channel type='son' noself='yes'}
        <a href="[field:typeurl/]">[field:typename/]</a>
      {/dede:channel}
    </li>
  {/channelartlist}
</ul>

代码解析：

1. {channelartlist typeid='top' currentstyle='active'}:

   • typeid='top'：调用所有顶级栏目（一级菜单）。
   • currentstyle='active'：这是一个关键属性，它会给当前所在的栏目（或其父栏目）的 <li> 标签附加一个 class="active" 属性，方便我们用CSS高亮显示当前页面所在的位置。

2. {dede:field name='typeurl'/} 和 {dede:field name='typename'/}:

   
   （图片来源网络，侵删）
   • 这两个标签在 channelartlist 循环体内，用于获取当前一级栏目的链接和名称。

3. {dede:channel type='son' noself='yes'}:

   • 这个标签嵌套在 channelartlist 内部，用于调用当前一级栏目下的所有子栏目（即二级栏目）。
   • type='son'：指定调用类型为“子栏目”。
   • noself='yes'：表示不调用栏目本身，只调用其子栏目，如果想让一级栏目也显示在下拉菜单里，可以去掉这个属性。

嵌套 channel 标签（简单直观）

如果您的导航结构不复杂,这种方法也很常用。

适用场景：

只需要调用顶级栏目和它们的二级子栏目。

代码示例：

<ul id="nav">
  {dede:channel type='top' row='8'}
    <li>
      <a href="[field:typeurl/]">[field:typename/]</a>
      <!-- 判断是否有子栏目，有则显示 -->
      [field:sonids runphp='yes']
        if(@me) @me = '<div class="sub-nav">'.GetSonChannel(@me).'</div>';
        else @me = '';
      [/field:sonids]
    </li>
  {/dede:channel}
</ul>

代码解析：

1. {dede:channel type='top' row='8'}:

   
   （图片来源网络，侵删）
   • type='top'：调用顶级栏目。
   • row='8'：限制调用8个顶级栏目。

2. [field:sonids runphp='yes'] ... [/field:sonids]:

   • 这是实现二级导航的核心。sonids 会获取当前栏目的所有子栏目的ID，并用逗号隔开（12,13,14）。
   • runphp='yes'：允许在标签内使用PHP代码。
   • if(@me) @me = '...'; else @me = '';：判断 sonids 是否为空，如果不为空（即有子栏目），就执行赋值操作，将包含二级栏目的HTML代码赋给 @me。
   • GetSonChannel(@me)：这是一个织梦内置的函数，它会根据传入的子栏目ID列表，自动生成对应栏目的链接和名称列表。

仅调用顶级栏目（无二级）

如果您只需要一个简单的一级导航菜单。

适用场景：

网站结构简单,不需要下拉菜单。

代码示例：

<ul id="nav">
  {dede:channel type='top' currentstyle='<li class="active"><a href=~typelink~>~typename~</a></li>'}
    <li><a href="[field:typeurl/]">[field:typename/]</a></li>
  {/dede:channel}
</ul>

代码解析：

• currentstyle 属性在这里直接定义了当前栏目的完整HTML结构，非常方便。~typelink~ 和 ~typename~ 是 currentstyle 中的占位符，会被替换为实际的链接和名称。

CSS 样式示例（配合方法一）

为了让导航菜单看起来像真正的下拉菜单,需要添加一些CSS样式。

/* 基础样式 */
#nav {
  list-style: none;
  padding: 0;
  margin: 0;
  background-color: #333;
}
#nav li {
  position: relative; /* 关键：为下拉菜单定位 */
  float: left; /* 水平排列 */
}
#nav li a {
  display: block;
  padding: 10px 15px;
  color: #fff;
  text-decoration: none;
}
/* 下拉菜单样式 */
#nav li a + a { /* 选择一级链接后面的所有二级链接 */
  display: none; /* 默认隐藏 */
  position: absolute;
  top: 100%; /* 定位在一级菜单下方 */
  left: 0;
  background-color: #444;
  min-width: 160px;
}
/* 鼠标悬停时显示下拉菜单 */
#nav li:hover a + a {
  display: block;
}
/* 高亮当前所在的栏目 */
#nav li.active a {
  background-color: #4CAF50;
  color: white;
}

总结与建议

对于绝大多数网站,强烈推荐使用方法一 (channelartlist)，它虽然代码行数多一些，但逻辑清晰，是处理织梦多级导航的标准做法，能更好地应对未来网站结构的变化。