如何在 wordpress wp_nav_menu() 中添加活动状态和图标答案

【问题标题】：How to add Active states and icons in wordpress wp_nav_menu()如何在 wordpress wp_nav_menu() 中添加活动状态和图标
【发布时间】：2012-03-25 06:03:44
【问题描述】：

function main_nav() { 
    wp_nav_menu( 
        array( 
            'menu' => 'main_nav', 
            'theme_location' => 'main_nav', 
            'container_class' => 'menu clearfix', 
            'link_before'     => '<span>',
            'link_after'      => '</span>',
            'fallback_cb' => 'bones_main_nav_fallback' 
        )
    );
}

我正在尝试使用 link_before 和 link_after 将 span 标签附加到 wp_nav_menu，以便我可以为每个导航添加一个图标。

示例：

<li><span><img src="home.gif" /></span><a href="home.php"> Home</a></li>

我是 php 和 wordpress 的超级新手。关于如何解决这个问题的任何想法？

第二个问题，向“当前活动状态”锚点添加一个 css 类？只是为了造型。

【问题讨论】：

标签： php html css wordpress

【解决方案1】：

也许您需要更改此代码...但这里是示例。您可以看到Reference to wp_nav_menu 并添加持有人模式...稍后只需通过您的本地替换设置更改它（替换前请参阅数组）

function main_nav() { 
    $menu = wp_nav_menu( 
        array( 
            'menu' => 'main_nav', 
            'theme_location' => 'main_nav', 
            'container_class' => 'menu clearfix', 
            'link_before'     => '<span></span>',
            'echo'            => $false,
            'fallback_cb' => 'bones_main_nav_fallback' 
        )
    );

    $patterns = array(
        '<span></span><a href="home.php"',
    );
    $replacements = array(  
        '<span><img src="home.gif" /></span><a href="home"'
    );

    echo str_repalce($patterns, $replacements, $menu); 

}

顺便说一句，列表项包含 current 类的数量，因此您也可以使用 tham 来跟踪菜单的当前项。

【讨论】：