如何解决Navwalker不接受菜单中定义的CSS类
所以我正在使用带有Bulma Navwalker的Bulma框架-我遇到的问题是它不接受在WordPress菜单中定义的自定义css类。
因此,我在一个父菜单项中定义了一个is-mega类,并且未在“ navbar-item has-dropdown is-hoverable”下显示。
有人看到我可能会失踪吗?
这是Navwalker:
<?php
/**
* Bulma-Navwalker
*
* @package Bulma-Navwalker
*/
/**
* Class Name: Navwalker
* Plugin Name: Bulma Navwalker
* Plugin URI: https://github.com/Poruno/Bulma-Navwalker
* Description: An extended Wordpress Navwalker object that displays Bulma framework's Navbar https://bulma.io/ in Wordpress.
* Author: Carlo Operio - https://www.linkedin.com/in/carlooperio/,Bulma-Framework
* Author URI: https://github.com/wp-bootstrap
* License: GPL-3.0+
* License URI: https://github.com/Poruno/Bulma-Navwalker/blob/master/LICENSE
*/
class Navwalker extends Walker_Nav_Menu {
public function start_lvl( &$output,$depth = 0,$args = array() ) {
$output .= "<div class='navbar-dropdown'>";
}
public function start_el( &$output,$item,$args = array(),$id = 0 ) {
$liClasses = 'navbar-item ';
$hasChildren = $args->walker->has_children;
$liClasses .= $hasChildren? " has-dropdown is-hoverable": "";
if($hasChildren){
$output .= "<div class='".$liClasses."'>";
$output .= "\n<a class='navbar-link' href='".$item->url."'>".$item->title."</a>";
}
else {
$output .= "<a class='".$liClasses."' href='".$item->url."'>".$item->title;
}
// Adds has_children class to the item so end_el can determine if the current element has children
if ( $hasChildren ) {
$item->classes[] = 'has_children';
}
}
public function end_el(&$output,$id = 0 ){
if(in_array("has_children",$item->classes)) {
$output .= "</div>";
}
$output .= "</a>";
}
public function end_lvl (&$output,$args = array()) {
$output .= "</div>";
}
}
?>
解决方法
您可以通过稍微调整步行器来实现。 Bulmapress从助行器上删除了标准类,因此可以使用自己的助行器。通过添加此选项,它将允许您从“外观”->“菜单”中添加自定义类。
<?php
public function start_el( &$output,$item,$depth = 0,$args = array(),$id = 0 ) {
// Add your custom item classes here
$custom_classes_from_menu = implode(' ',$item->classes); // turn the WP classes object array to string values
$liClasses = 'navbar-item ' . $custom_classes_from_menu; // add the values to your classes list
$hasChildren = $args->walker->has_children;
$liClasses .= $hasChildren? " has-dropdown is-hoverable": "";
if($hasChildren){
$output .= "<div class='".$liClasses."'>";
$output .= "\n<a class='navbar-link' href='".$item->url."'>".$item->title."</a>";
}
else {
$output .= "<a class='".$liClasses."' href='".$item->url."'>".$item->title;
}
// Adds has_children class to the item so end_el can determine if the current element has children
if ( $hasChildren ) {
$item->classes[] = 'has_children';
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。