如何将活动类添加到单独的页面链接?

时间:2013-03-14 作者:Jakemmarsh

我使用Wordpress引导主题作为我的基本主题。

如果用户当前在标题中的任何链接上,它将使用以下代码将类“active”添加到该页面中:

add_filter(\'nav_menu_css_class\', \'add_active_class\', 10, 2 );

function add_active_class($classes, $item) {

    if($item->menu_item_parent == 0 && in_array(\'current-menu-item\', $classes)) {

        $classes[] = "active";

    }

    return $classes;

}
但是,我有多个页面,当用户实际上不在该特定页面上时,我希望将其显示为“活动”。例如,用户有时可能在“教程按主题”(教程按主题)上,但我希望标题为“教程”的链接显示为活动链接。我有四页想这样做。我在add\\u active\\u类函数中尝试了不同的条件等,但没有成功。有什么指导吗?谢谢

2 个回复
最合适的回答,由SO网友:markratledge 整理而成

这不是最干净的解决方案,但我对当前页面菜单的一些实例使用了类似的方法,突出显示与子级/父级无关的页面:

<?php if (is_page(\'tutorials-by-topic\') { ?>
<script type="text/javascript">
jQuery(function($) {
$(document).ready(function() {
$(\'#menu-main-menu li.menu-item-1319\').addClass(\'current-menu-item\');
}); });
</script>
<?php } ?>
您必须查看源代码才能获得要在菜单中突出显示为当前页面的正确菜单项xxxx。

SO网友:tfrommen

使用nav菜单时,父菜单项以及父菜单项都提供了相应的类current-menu-parentcurrent-menu-ancestor. 这些类选择器可用于设置链接的样式。

如果要应用完全相同的样式,请使用active 类中,只需将选择器添加到样式表中的特定CSS块。否则,通过新的专用CSS块对其进行不同的样式设置。

结束

相关推荐

WooCommerce dynamic menus

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