如何重写WordPress导航菜单的输出？

我一直在想这个问题。我需要覆盖wordpress导航系统的默认输出。

现在就像：

<ul id="main-nav">
   <li class="menu-item">Parent Menu Item</li>
      <ul id="sub-menu">
            <li class="sub-menu-item">Parent Menu Item</li>
            <li class="sub-menu-item">Parent Menu Item</li>
            <li class="sub-menu-item">Parent Menu Item</li>
      </ul>
   <li class="menu-item">Parent Menu Item</li>
      <ul id="sub-menu">
            <li class="sub-menu-item">Parent Menu Item</li>
            <li class="sub-menu-item">Parent Menu Item</li>
            <li class="sub-menu-item">Parent Menu Item</li>
      </ul>
   <li class="menu-item">Parent Menu Item</li>
      <ul id="sub-menu">
            <li class="sub-menu-item">Parent Menu Item</li>
            <li class="sub-menu-item">Parent Menu Item</li>
            <li class="sub-menu-item">Parent Menu Item</li>
      </ul>
</ul>

我想做的是：

<div class="main-nav-wrap">
  <div class="container main-nav">
    <ul>
      <li id="home" class="nav-links"><a href="#"><span></span>Main Level Link</a></li>
      <li id="home" class="nav-links"><a href="#"><span></span>Main Level Link</a></li>
      <li id="home" class="nav-links"><a href="#"><span></span>Main Level Link</a></li>
      <li id="home" class="nav-links"><a href="#"><span></span>Main Level Link</a></li>            
    </ul>
  </div>

  <div class="main-subnav">
    <div class="container">
      <div class="sub-menu">
        <h2>Some title here</h2>
        <div class="sub-container">
          <ul class="grid_3 alpha">
            <li><a href="#">Sub level link</a></li>
            <li><a href="#">Sub level link</a></li>
            <li><a href="#">Sub level link</a></li>
          </ul>
          <ul class="grid_3">
            <li><a href="#">Sub level link</a></li>
            <li><a href="#">Sub level link</a></li>
            <li><a href="#">Sub level link</a></li>
          </ul>
          <ul class="grid_3 omega">
            <li><a href="#">Sub level link</a></li>
            <li><a href="#">Sub level link</a></li>
            <li><a href="#">Sub level link</a></li>
          </ul>
        </div>
      </div>
    </div>
  </div>

</div>

WooCommerce dynamic menus

我有一个基本的WordPress网站，设置了Suffusion主题和WooCommerce插件。这在大多数情况下都很有效，但是当我让人们点击/悬停在“Shop”菜单图标上时，我希望它能够动态地下拉我定义的产品类别。我如何做到这一点？我肯定有关于这个主题的文档，但我不确定要查找什么。我主要是一名系统管理员。

相关推荐

WooCommerce dynamic menus