Question

是否可以在菜单中添加某种类似“箭头”或跨度的类（在Wordpress中）？看来你可以这样做是使用javascript，但我想知道是否有PHP解决方案......

在WP 3.0中，我看到活动菜单上有“父”或“祖先”类，但这只适用于活动菜单，我也需要它用于非活动菜单

Answer 1

这个功能真的应该在WordPress核心！
无论如何，我看了你在另一个答案的评论中发送的菜单模板源，并找到了一个（相当hacky）方法来添加一个带有孩子的菜单项的类。它基本上是默认walker的子类，以扩展其默认行为。如果你把它放在你的主题functions.php中，那可能是最好的。这是代码：

<?php
class Arrow_Walker_Nav_Menu extends Walker_Nav_Menu {
    function display_element($element, &$children_elements, $max_depth, $depth=0, $args, &$output) {
        $id_field = $this->db_fields['id'];
        if (!empty($children_elements[$element->$id_field])) { 
            $element->classes[] = 'arrow'; //enter any classname you like here!
        }
        Walker_Nav_Menu::display_element($element, $children_elements, $max_depth, $depth, $args, $output);
    }
}
?>

要调用它，当您在主题中调用walker时，您需要添加wp_nav_menu()参数，如下所示：

<?php 
wp_nav_menu(array('walker' => new Arrow_Walker_Nav_Menu, [other arguments...]))
?>

希望对你有用！我只是在表面上测试它，但它似乎工作。如果有任何边缘情况，添加类失败，请告诉我。

Answer 2

我不知道任何原生的WordPress支持，但您可以使用一些jQuery轻松完成。

<script type="text/javascript">
$("#menu-id ul li:has(ul)").addClass("parent");
</script>

Answer 3

如果你像我一样想在你的父菜单项中添加一个HTML箭头，请在Donald Harvey的客户步行者类中添加这样一行：

$element->title .= '<span class="caret down-caret">&#x25BC;</span>';

您还可以将该HTML直接添加到WP管理员＆gt;中的菜单标签上。菜单页面，但这不是一个很好的方式。

我在这里写了一些关于此问题的http://cameronnokes.com/blog/adding-an-icon-to

Answer 4

只需将其粘贴到您的css代码中即可按预期工作。

.nav-menu li > a:after {
    color: #888;
    content: ' ▾';
}

.nav-menu li > a:hover:after {
    color: #444;
    content: ' ▾';
}

.nav-menu li > a:only-child:after {
    content: '';
}

^{聚苯乙烯。别忘了设置页面UTF-8}

Answer 5

如果主菜单具有子菜单

，则可以简单而简单地将类父级添加到主菜单中

<script type="text/javascript">
jQuery(document).ready(function($) {
    $("ul.sub-menu").parents().addClass('parent');  
});
 </script>

风格是

    <style type="text/css">
       .main-navigation .parent > a, .main-navigation .parent > a:hover {
            background-image: url("images/arrow.png");
            background-position: right center;
            background-repeat: no-repeat;
     }  

    </style>

Answer 6

我不知道什么是问题，但我们可以在css这样的菜单中添加箭头：

.menu li > a:after {
    color: #fff;
    content: ' ▾';
}

.menu li > a:only-child:after {
    content: '';
}

PHP / Wordpress - 向父菜单添加箭头

6 个答案: