如何删除所有的ul和li，但仍然在WordPress中保留当前菜单项？

Question

我试图通过WordPress通过wp_nav输出这个结构，但是仍然为当前菜单项保留了一个类，因此选项卡在当前页面上发生了变化。(is-active将替换当前菜单项)。这是基于https://getmdl.io/components/index.html#layout-section的

<!-- Simple header with scrollable tabs. -->
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
  <header class="mdl-layout__header">
    <div class="mdl-layout__header-row">
      <!-- Title -->
      <span class="mdl-layout-title">Title</span>
    </div>
    <!-- Tabs -->
    <div class="mdl-layout__tab-bar mdl-js-ripple-effect">
      <a href="#scroll-tab-1" class="mdl-layout__tab is-active">Tab 1</a>
      <a href="#scroll-tab-2" class="mdl-layout__tab">Tab 2</a>
      <a href="#scroll-tab-3" class="mdl-layout__tab">Tab 3</a>
      <a href="#scroll-tab-4" class="mdl-layout__tab">Tab 4</a>
      <a href="#scroll-tab-5" class="mdl-layout__tab">Tab 5</a>
      <a href="#scroll-tab-6" class="mdl-layout__tab">Tab 6</a>
    </div>
  </header>
 </div>

然而，我不知道该怎么做。有什么想法吗？

Answer 1

请提供您希望对其执行此类操作以获得所需输出的原始数据。

Answer 2

尝尝这个。

function remove_wp_nav_menu_ul_litags($menu){
  return $menu = strip_tags($menu, "<a>");
}
add_filter( 'wp_nav_menu', 'remove_wp_nav_menu_ul_litags' );

您还可以通过传递strip_tags()函数的第二个参数来保留或保留其它标签。

Answer 3

这项任务比看起来要难一点。wp_nav_menu()使用一个特殊的Walker class来构建动态输出。有一堆硬编码和过滤的类名和大量的标志/状态。我们有三种主要的方法来处理这一切。

• 最简单的方法是保留默认标记，并采用/重写所有相关的CSS/JS。对于初学者来说，这在90%的情况下要容易得多。
• 另一种方法是使用nav-menu hooks and filters添加/重新定义现有类。如果您只需要一些调整，这是可以的。通常你会使用：'nav_menu_css_class'，'nav_menu_submenu_css_class'，'nav_menu_link_attributes‘。在输出html准备好之后，也可以用正则表达式替换某些内容(使用'wp_nav_menu‘过滤器)。此方法有时可能看起来很慢，因为您经常必须遍历所有内容(项、类、属性)并执行过多的条件检查。但是似乎你的任务适合这个方法，最灵活的方式是通过你自己的completely.
• The函数来扩展Walker类，它将以你自己的方式提供你需要的任何输出。但是，您需要understand the Walker Class (教程)。当您第一次面对它时，这种方法可能看起来很复杂。但它给了你完全的控制权。