在我的WordPress菜单中,我有一个顶部或标题菜单项。我知道如何找到它并使用CSS隐藏它,但这并不是我想要的。
目前,我有菜单栏,按下时,转到fa角向下和标题菜单项,按下时,转到实际菜单。我想删除这个由标题菜单项和fa角度向下组成的间歇菜单阶段,这样用户就可以直接从条形图进入实际菜单。我已经查看了标题。php并找到fa-bars
, 但没有任何东西表明它的属性,在navwalker中。php中,我发现fa角向下,但没有指示它是如何连接到fa条的。
我假设我只需要移除navwalker的某个部分。php,但哪一部分?
这是我的导航器。php:https://github.com/ColorlibHQ/shapely/blob/master/inc/class-wp-bootstrap-navwalker.php
这是我的标题。php:https://github.com/ColorlibHQ/shapely/blob/master/header.php
页码为here
这里是php,我认为它可以控制它。
$item_output = $args->before;
/*
* Glyphicons
* ===========
* Since the the menu item is NOT a Divider or Header we check the see
* if there is a value in the attr_title property. If the attr_title
* property is NOT null we apply it as the class name for the glyphicon.
*/
if ( ! empty( $item->attr_title ) ) {
$item_output .= \'<a\' . $attributes . \'><span class="glyphicon \' . esc_attr( $item->attr_title ) . \'"></span> \';
} else {
$item_output .= \'<a\' . $attributes . \'>\';
}
$item_output .= $args->link_before . apply_filters( \'the_title\', $item->title, $item->ID ) . $args->link_after;
$item_output .= ( $args->has_children ) ? \' </a><span class="dropdown-toggle shapely-dropdown" data-toggle="dropdown"><i class="fa fa-angle-down" aria-hidden="true"></i></span>\' : \'</a>\';
$item_output .= $args->after;
$output .= apply_filters( \'walker_nav_menu_start_el\', $item_output, $item, $depth, $args );
}// End if().
}
以下是html:
<i class="fa fa-bars"></i>
</div>
<div class="module-group right">
<div class="module left">
<div class="collapse navbar-collapse navbar-ex1-collapse"><ul id="menu" class="menu"><li id="menu-item-3530" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-3530 dropdown"><a title="Contact" href="https://4309.co.uk/contact/">Contact </a><span class="dropdown-toggle shapely-dropdown" data-toggle="dropdown"><i class="fa fa-angle-down" aria-hidden="true"></i></span>
SO网友:RiddleMeThis
这是一个编码非常糟糕的菜单。为了真正修复它,您还需要编辑正在使用的JS。
作为一个非常简单的解决方法,请在style.css
...
.mobile-menu ul.dropdown-menu.active {
display: block !important;
}
注意:有几个实例
.mobile-menu ul.dropdown-menu.active
, 确保编辑媒体查询中未包含的内容。
将上述规则更改为。。。
.mobile-menu ul.dropdown-menu.active,
.mobile-menu ul.dropdown-menu {
display: block !important;
}
现在,当您单击第一个菜单时,默认情况下应打开第二个菜单。
由于您不再需要第二个菜单,因此可以将其隐藏。将此添加到样式表中。。。
.mobile-menu .shapely-dropdown {
display: none !important;
}