自定义菜单:自定义主页链接的动态突出显示问题

时间:2011-03-15 作者:toomanyairmiles

我目前正在实现wp\\u nav\\u菜单-除了动态突出显示外,一切都很顺利。菜单代码如下所示(当选择home(自定义链接)时):

<div class="menu-header">
<ul class="menu" id="menu-main-nav">
<li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-126" id="menu-item-126"><a href="path.to.link">Home</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-122" id="menu-item-122"><a href="path.to.link">Information</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-123" id="menu-item-123"><a href="path.to.link">Contact</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-124" id="menu-item-124"><a href="path.to.link">About</a></li>
</ul>
</div>
当选择主页以外的页面(即“自定义链接”)时,会写出:

<li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-65 current_page_item menu-item-122" id="menu-item-122"><a href="path.to.link">Information</a></li>
如您所见,这包括一个活动样式“当前菜单项”,其中自定义链接仅写入“菜单项类型自定义菜单项对象自定义”

所以我的问题是,有没有办法为wp3菜单中的自定义链接添加选定的项目样式?

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

我通过一些jQuery实现了这一点:

$("#sidebar ul li").each(function () {
     if ($(this).find("a").attr("href") == window.location.href) {
         $(this).addClass("current-menu-item");
     }
});
(我的导航位于id为“侧栏”的div中,您需要更改第一个选择器)。

它检查链接的href是否与当前URL相同,如果相同,则添加“当前菜单项”。然后可以使用设置活动链接的样式。当前菜单样式类。

SO网友:Chip Bennett

更好的方法是在wp_page_menu() args,以便您可以添加“主页”链接。

首先,将此筛选器添加到functions.php 要显示主页链接,请执行以下操作:

function mytheme_filter_page_menu_args( $args ) {
    $args[\'show_home\'] = true;
    return $args;
}
add_filter( \'wp_page_menu_args\', \'mytheme_filter_page_menu_args\' );
现在,在Dashboard -> Appearance -> Menus, 您将在“页面”元框下看到一个“主页”链接。选择它,并将其添加到自定义菜单中。

Credit and screenshots here.

SO网友:Arnold

在我的主题中,我使用自定义菜单。作为一个后备菜单,我在函数中使用以下代码。php:

function tweaker3_default_menu() {
    echo \'<ul class="sf-menu">\';
    if(is_home() && !is_paged()) {
        echo \'<li class="current_page_item"><a href="\'. home_url( \'/\' ) . \'" title="\' . __( \'You are Home\', \'tweaker3\' ) . \'" rel="nofollow">\' . __( \'Home\', \'tweaker3\' ) . \'</a></li>\';
    } else {
        echo \'<li><a href="\'. home_url( \'/\' ) . \'" title="\' . __( \'Click for Home\', \'tweaker3\' ) . \'" rel="nofollow">\' . __( \'Home\', \'tweaker3\' ) . \'</a></li>\';
    }
    wp_list_pages( \'title_li=\' );
    echo \'</ul>\';
这段代码解决了我在主页链接上设置当前项目的问题。我希望这对你有帮助。

结束