使用WordPress将活动类添加到菜单链接

Question

我正在使用WordPress功能 wp_nav_menu 来创建我的主菜单。

在这个菜单中，我有一个名为“News”的链接，例如，当我在single.php文件模板中时，我想使这个链接突出显示。

目前，我的代码是下面的代码。我没有“习惯”使用这个WordPress功能。

<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>

有没有办法说明例如

if($is_single())
{
echo 'class="active"';
}

我在SO上检查过arround，我创建了一些可能很有趣的信息，但没有什么能真正回答我的问题。

在此页面上，有人建议您选中“在屏幕上显示”选项：add class to dropdown menu inside dynamic wordpress menu

我也在codex中找到了这个页面，但我不确定如何使用它：http://codex.wordpress.org/Function_Reference/wp_nav_menu#How_to_add_a_parent_class_for_menu_item

请事先提供帮助！

Answer 1

wp_nav_menu自动将“current_page_item”类添加到li标签。所以你可以将“current_page_item”作为活动菜单的目标。

li.current_page_item a{
color:#fff;

}

Answer 2

嗯，你有两个很好的选择：

第一个是为single.php主div添加一个类名，而在CSS文件中添加一个属性，如： .singleClass .nav-menu ul li a {color: red; //any setting you would like }

另一种方法是通过将菜单调用中的menu_class更改为页面，将该自定义类添加到菜单中。

如果这对您不起作用，我希望了解更多有关您的主题层次结构的内容，以便我可以更具体地回答您的问题。

Answer 3

  

您可以在导航菜单上使用多个类，如此

<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu active' ) ); ?>

Answer 4

在wordpress 4.x中，它在当前菜单中有一个类current_page_item，所以你必须为类.current_page_item添加css，用于当前和活动类，如下所示

.current_page_item
{
border-bottom: 3px solid #50c1e9;
}

并在页面刷新后查看结果。