3

我在我的主题中使用了三个主要导航，我试图在所有主要导航中放置一个带有自定义 ID 的菜单的最终链接。

这就是我想要的：

<nav id="menu" role="navigation" class="menu-primary">
  <ul id="nav" class="menu">
    <li id="menu-item-418" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-418"><a href="#">About</a></li>
    <li id="menu-item-474" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-474"><a href="#">Work</a></li>
    <li id="menu-item-463" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-463"><a href="#">Blog</a></li>
    <li id="menu-item-416" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-416"><a href="#">Contact</a></li>
    <li id="back" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-491"><href="#header">back</a></li>
  </ul>
</nav>

如您所见，最后的 li 的 ID 为“back”。知道如何在不使用 js 的情况下完成此任务吗？我可以看到如何更改课程，但不能更改 ID。我这样做是为了 CSS 目的。

任何帮助将不胜感激！

4

3 回答 3

2

id您可以最后插入/注入另一个作为自定义菜单项，而不是更改，menu item/li如下所示

add_filter( 'wp_nav_menu_items', 'your_custom_menu_item');
function your_custom_menu_item ($items)
{
    $items .= '<li id="back" class="what-ever"><a href="#">Back</a></li>';
    return $items;
}

只需将代码片段粘贴到您的，它就会在您的菜单中functions.php添加一个自定义。menu item希望这可以帮助。

还有另一种方法来改变menu使用自定义walker，这里是一个很好的例子。

于 2012-11-30T20:33:21.423 回答
1

如果您正在使用wp_nav_menu，那么最好的方法是使用 Wordpress 提供的类。我认为没有办法将特定的 ID 添加到菜单项中。

除非你用 jQuery 来做这...

于 2012-11-30T17:45:56.387 回答
0

您将需要使用 JS/jQuery 来执行此操作。WordPress 菜单是动态编写的，您不能只进入主题文件并编辑 li。

如果您的菜单不在同一页面上，那么您可以使用 ID 和第一个示例。您需要将每个菜单的 #nav 更改为 UL 的 ID，并重复该行 3 次，每个菜单一次。

$(document).ready(function() {
   $('#nav li').last().attr('id', 'back');
});

如果您的菜单在同一页面上，则需要使用如下所示的类。您需要将每个菜单的 #nav 更改为 UL 的 ID，并重复该行 3 次，每个菜单一次。那是除非所有菜单在 UL 上都有一个类，在这种情况下你可以只使用$('#classNameHere li').last().addClass('back');.

$(document).ready(function() {
   $('#nav li').last().addClass('back');
});
于 2012-11-30T20:03:25.943 回答