在菜单导航中使用分隔符-在哪里添加代码?

时间:2012-12-09 作者:RKB

我在我的博客上找到了两种在导航菜单中分隔页面的方法(http://reasonandfolly.com) 但无法确定需要修改哪些php或css文件才能获得结果,并且承认不知道“span class”和“span divider”之间的区别在我更好地掌握基本的WP编码之前,我非常感谢您的帮助。以下任何一个例子都能满足我的需要。问题是,我如何实现?

  1. http://www.themezilla.com < span class = " divider " > / < /span >

  2. http://chimpchomp.us < span id = " divider " > // < /span >

这是当前我的标题中的代码。php文件:

   </div><!-- /logo -->
                <nav>
                    <?php wp_nav_menu( array( \'menu\' =>  __(\'Main Menu\', \'meanthemes\'), \'theme_location\' => \'primary\', \'container\' => false, \'menu_id\' => false, \'menu_class\' => false ) ); ?>
                </nav><!-- /nav -->
            </div>  
        </header><!-- /header -->

2 个回复
SO网友:Mridul Aggarwal

这是我过去使用过的代码之一。下面的代码用于您的函数。php

class MP_Footer_Menu extends Walker_Nav_Menu {

    function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) {
        STATIC $counter = 0;
        if ($counter++)
            $output .= \'<li class="divider">/</li>\';
        parent::start_el($output, $item, $depth, $args, $id);
    }

}
这是在传递给的数组中传递的额外参数wp_nav_menu. 它应该存在于php模板文件中(可能是header.php或footer.php)
\'walker\' => new MP_Footer_Menu()

如果您无法确定放置此行的确切位置,可以在文件夹范围内搜索wp_nav_menu 在您的主题中(&A);然后更新您的问题副本,粘贴附近的一些代码&;然后有人会告诉你确切的地点。

这应该可以使分隔符就位,但您很可能还需要一些CSS。我建议,一旦完成上述操作;如果您在CSS中遇到一些问题,请转到https://stackoverflow.com/ &;单独问这个问题。你会在那里得到更好的CSS答案。

SO网友:Matt Keys

假设您的菜单有这样的结构(粗略键入):

<ul id="my_menu">
    <li><a>Home</a></li>
    <li><a>About</a></li>
    <li><a>Contact</a></li>
</ul>
您可以像这样使用CSS:

#my_menu a:after {
    content: \'//\';
}
#my_menu a:last-child:after {
    content: \'\'; /* Hide for last menu item */
}
应该提到的是,如果您必须支持IE8浏览器,那么最后一个子选择器在IE8中不起作用。另一种方法是使用:before和:first child,它在IE8中有支持:

#my_menu a:before {
    content: \'//\';
}
#my_menu a:first-child:before {
    content: \'\'; /* Hide for first menu item */
}

结束

相关推荐

Thesis -style Navigation

我正在研究一个主题,我希望用户能够像论文一样选择要在主题选项页面中显示的页面。我已经在谷歌上搜索了几个小时的逆向工程论文,但还没有找到一个很好的解决方案。我想知道是否有人做过这件事或看过教程。