是否可以在导航菜单中添加侧栏？
我希望能够在外观>菜单中添加侧栏，就像我添加页面一样。
我有一种创建额外边栏的方法，所以这不是问题（如果需要，我也可以注册几个专用边栏）。
基本上，我需要一种在菜单中显示小部件的方法，而不需要使用任何额外的插件。
这样可能吗？我需要延长吗Walker_Nav_Menu?
EDIT
我的菜单\\u walker。php如下所示：
// Allow HTML descriptions in WordPress Menu
remove_filter( \'nav_menu_description\', \'strip_tags\' );
function my_plugin_wp_setup_nav_menu_item( $menu_item ) {
if ( isset( $menu_item->post_type ) && \'nav_menu_item\' == $menu_item->post_type) {
$menu_item->description = apply_filters( \'nav_menu_description\', $menu_item->post_content );
}
return $menu_item;
}
add_filter( \'wp_setup_nav_menu_item\', \'my_plugin_wp_setup_nav_menu_item\' );
// Menu without icons
class theme_walker_nav_menu extends Walker_Nav_Menu {
public function display_element($el, &$children, $max_depth, $depth = 0, $args, &$output){
$id = $this->db_fields[\'id\'];
if(isset($children[$el->$id])){
$el->classes[] = \'has_children\';
}
parent::display_element($el, $children, $max_depth, $depth, $args, $output);
}
// add classes to ul sub-menus
function start_lvl( &$output, $depth = 0, $args = array() ) {
// depth dependent classes
$indent = ( $depth > 0 ? str_repeat( "\\t", $depth ) : \'\' ); // code indent
$display_depth = ( $depth + 1); // because it counts the first submenu as 0
$classes = array(
\'navi\',
( $display_depth ==1 ? \'first\' : \'\' ),
( $display_depth >=2 ? \'navi\' : \'\' ),
\'menu-depth-\' . $display_depth
);
$class_names = implode( \' \', $classes );
// build html
$output .= "\\n" . $indent . \'<ul class="\' . esc_attr($class_names) . \'">\' . "\\n";
}
// add main/sub classes to li\'s and links
function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
global $wp_query;
$indent = ( $depth > 0 ? str_repeat( "\\t", $depth ) : \'\' ); // code indent
static $is_first;
$is_first++;
// depth dependent classes
$depth_classes = array(
( $depth == 0 ? \'main-menu-item\' : \'\' ),
( $depth >=2 ? \'navi\' : \'\' ),
( $is_first ==1 ? \'menu-first\' : \'\' ),
\'menu-item-depth-\' . $depth
);
$depth_class_names = esc_attr( implode( \' \', $depth_classes ) );
// passed classes
$classes = empty( $item->classes ) ? array() : (array) $item->classes;
$class_names = esc_attr( implode( \' \', apply_filters( \'nav_menu_css_class\', array_filter( $classes ), $item ) ) );
$is_mega_menu = (strpos($class_names,\'mega\') !== false) ? true : false;
$use_desc = (strpos($class_names,\'use_desc\') !== false) ? true : false;
$no_title = (strpos($class_names,\'no_title\') !== false) ? true : false;
if(!$is_mega_menu){
$class_names .= \' normal_menu_item\';
}
// build html
$output .= $indent . \'<li id="nav-menu-item-\'. esc_attr($item->ID) . \'" class="\' . esc_attr($depth_class_names) . \' \' . esc_attr($class_names) . \'">\';
// link attributes
$attributes = ! empty( $item->attr_title ) ? \' title="\' . esc_attr( $item->attr_title ) .\'"\' : \'\';
$attributes .= ! empty( $item->target ) ? \' target="\' . esc_attr( $item->target ) .\'"\' : \'\';
$attributes .= ! empty( $item->xfn ) ? \' rel="\' . esc_attr( $item->xfn ) .\'"\' : \'\';
$attributes .= ! empty( $item->url ) ? \' href="\' . (($item->url[0] == "#" && !is_front_page()) ? home_url() : \'\') . esc_attr($item->url) .\'"\' : \'\';
$attributes .= \' class="menu-link \'.((strpos($item->url,\'#\') === false) ? \'\' : \'scroll\').\' \' . ( $depth > 0 ? \'sub-menu-link\' : \'main-menu-link\' ) . \'"\';
$html_output = ($use_desc) ? \'<div class="description_menu_item">\'.wp_kses($item->description, allowed_tags()).\'</div>\' : \'\';
$item_output = (!$no_title) ? \'<a \' . $attributes . \'><span>\' . apply_filters( \'the_title\', $item->title, $item->ID ) . \'</span></a>\'.$html_output : $html_output;
// build html
$output .= apply_filters( \'walker_nav_menu_start_el\', $item_output, $item, $depth, $args ).(($is_mega_menu)?\'<div class="sf-mega"><div class="sf-mega-inner clearfix">\':\'\');
}
function end_el( &$output, $item, $depth = 0, $args = array() ) {
$classes = empty( $item->classes ) ? array() : (array) $item->classes;
$class_names = esc_attr( implode( \' \', apply_filters( \'nav_menu_css_class\', array_filter( $classes ), $item ) ) );
$is_mega_menu = (strpos($class_names,\'mega\') !== false) ? true : false;
$output .= (($is_mega_menu)?\'</div></div>\':\'\') . "</li>\\n";
}
}
我还有jquery代码，可以添加下拉菜单来选择megamenu中的列数：
jQuery(document).ready(function($) {
"use strict";
var $depth_zero = $(\'#menu-to-edit\').find(\'.menu-item-depth-0\');
var $depth_one = $(\'#menu-to-edit\').find(\'.menu-item-depth-1\');
var i = 0;
$depth_zero.find(\'.field-description\').each(function(){
i++;
$(this).before(\'<p class="field-additional description-wide"><label for="add_mega\'+i+\'">Menu Type<br><select id="add_mega\'+i+\'" class="additional_input add_mega"><option value="">Default Standard Menu</option><option value="mega1">Mega Menu - Single Column</option><option value="mega2">Mega Menu - 2 Columns</option><option value="mega3">Mega Menu - 3 Columns</option><option value="mega4">Mega Menu - 4 Columns</option><option value="mega5">Mega Menu - 5 Columns</option><option value="mega6">Mega Menu - 6 Columns</option><option value="mega7">Mega Menu - 7 Columns</option></select></p>\');
var classes = $(this).siblings(\'.field-css-classes\').find(\'input\').val();
var current_c;
for (var c = 1; c <= 7; c++) {
current_c = \'mega\'+c;
if(classes.indexOf(current_c) >= 0) {
$(this).siblings(\'.field-additional\').find(\'select\').val(current_c);
}
}
});
$depth_one.find(\'.field-description\').each(function(){
i++;
var use_desc_state = ($(this).siblings(\'.field-css-classes\').find(\'input\').val().indexOf(\'use_desc\') >= 0) ? \' checked\' : \'\';
var no_title_state = ($(this).siblings(\'.field-css-classes\').find(\'input\').val().indexOf(\'no_title\') >= 0) ? \' checked\' : \'\';
$(this).before(\'<p class="field-additional description-wide"><br><label for="use_desc\'+i+\'"><input type="checkbox" id="use_desc\'+i+\'" class="additional_input use_desc" value="use_desc"\'+use_desc_state+\'>Use description field as HTML content<br></label><label for="no_title\'+i+\'"><input type="checkbox" id="no_title\'+i+\'" class="additional_input no_title" value="no_title"\'+no_title_state+\'>Hide title</label></p>\');
});
$(\'.additional_input, .edit-menu-item-classes\').change(function() {
var $parent_item = $(this).closest(\'.menu-item\');
define_classes($parent_item);
});
function define_classes($item){
var $class_field = $item.find(\'.field-css-classes input\');
var current_class_value = $class_field.val().replace(\'use_desc\',\'\').replace(\'no_title\',\'\').replace(\'mega1\',\'\').replace(\'mega2\',\'\').replace(\'mega3\',\'\').replace(\'mega4\',\'\').replace(\'mega5\',\'\').replace(\'mega6\',\'\').replace(\'mega7\',\'\').replace(\' \',\' \');
var new_class_value = [];
new_class_value.push(current_class_value.trim());
if($item.find(\'.add_mega\').length > 0 && $item.find(\'.add_mega\').val() !== \'\'){
new_class_value.push($item.find(\'.add_mega\').val());
}
if($item.find(\'.use_desc\').length > 0 && $item.find(\'.use_desc\').is(\':checked\')){
new_class_value.push(\'use_desc\');
}
if($item.find(\'.no_title\').length > 0 && $item.find(\'.no_title\').is(\':checked\')){
new_class_value.push(\'no_title\');
}
$class_field.val(new_class_value.join(\' \').trim());
}
});
我尝试添加
this code 扩展我的memgamenu，但什么都没发生。
如果我不能在这里显示侧栏，是否可以在我的描述字段中添加短代码？我该怎么做？
当我在描述字段中输入短代码时，什么都没有发生。欢迎您的帮助。
EDIT
找到了不同的方法。我向菜单页面添加了一个元框，其中列出了我的所有侧栏，然后我将侧栏的内容放在描述字段中（您需要禁用或编辑
wp_kses() 描述字段上的函数，以便它不会删除所有内容）。函数如下所示：
<?php
if ( !class_exists(\'sidebars_custom_menu\')) {
class sidebars_custom_menu {
public function add_nav_menu_meta_boxes() {
add_meta_box(
\'sidebar_menu_add\',
esc_html__(\'Add Sidebar\', \'theme\'),
array( $this, \'nav_menu_link\'),
\'nav-menus\',
\'side\',
\'low\'
);
}
public function nav_menu_link() {?>
<div id="posttype-sidebars" class="posttypediv">
<div id="tabs-panel-sidebars" class="tabs-panel tabs-panel-active">
<ul id ="sidebars-checklist" class="categorychecklist form-no-clear">
<?php $i = 0; ?>
<?php foreach ( $GLOBALS[\'wp_registered_sidebars\'] as $sidebar ) { ?>
<?php
$i++;
ob_start();
dynamic_sidebar($sidebar[\'id\']);
$sidebar_html = ob_get_contents();
ob_end_clean();
?>
<li>
<label class="menu-item-title">
<input type="checkbox" class="menu-item-checkbox" name="menu-item[-<?php echo $i; ?>][menu-item-object-id]" value="<?php echo $sidebar[\'id\']; ?>"> <?php echo ucwords( $sidebar[\'name\'] ); ?>
</label>
<input type="hidden" class="menu-item-type" name="menu-item[-<?php echo $i; ?>][menu-item-type]" value="custom">
<input type="hidden" class="menu-item-title" name="menu-item[-<?php echo $i; ?>][menu-item-title]" value="<?php echo ucwords( $sidebar[\'name\'] ); ?>">
<input type="hidden" class="menu-item-url" name="menu-item[-<?php echo $i; ?>][menu-item-url]" value="">
<input type="hidden" class="menu-item-classes" name="menu-item[-<?php echo $i; ?>][menu-item-classes]" value="menu_sidebar use_desc">
<input type="hidden" class="menu-item-description" name="menu-item[-<?php echo $i; ?>][menu-item-description]" value="<?php echo htmlentities($sidebar_html); ?>">
</li>
<?php } ?>
</ul>
</div>
<p class="button-controls">
<span class="list-controls">
<a href="/wordpress/wp-admin/nav-menus.php?page-tab=all&selectall=1#posttype-page" class="select-all"><?php esc_html_e(\'Select All\', \'theme\'); ?></a>
</span>
<span class="add-to-menu">
<input type="submit" class="button-secondary submit-add-to-menu right" value="<?php esc_html_e(\'Add to Menu\', \'theme\');?>" name="add-post-type-menu-item" id="submit-posttype-sidebars">
<span class="spinner"></span>
</span>
</p>
</div>
<?php }
}
}
$custom_nav = new sidebars_custom_menu;
add_action(\'admin_init\', array($custom_nav, \'add_nav_menu_meta_boxes\'));
原始代码来自
here
最合适的回答,由SO网友:dingo_d 整理而成
我想要的解决方案如下所示：
<?php
// Allow HTML descriptions in WordPress Menu
remove_filter( \'nav_menu_description\', \'strip_tags\' );
function my_plugin_wp_setup_nav_menu_item( $menu_item ) {
if ( isset( $menu_item->post_type ) && \'nav_menu_item\' == $menu_item->post_type) {
$menu_item->description = apply_filters( \'nav_menu_description\', $menu_item->post_content );
}
return $menu_item;
}
add_filter( \'wp_setup_nav_menu_item\', \'my_plugin_wp_setup_nav_menu_item\' );
// Menu
class my_theme_walker_nav_menu extends Walker_Nav_Menu {
public function display_element($el, &$children, $max_depth, $depth = 0, $args, &$output){
$id = $this->db_fields[\'id\'];
if(isset($children[$el->$id])){
$el->classes[] = \'has_children\';
}
parent::display_element($el, $children, $max_depth, $depth, $args, $output);
}
// add classes to ul sub-menus
function start_lvl( &$output, $depth = 0, $args = array() ) {
// depth dependent classes
$indent = ( $depth > 0 ? str_repeat( "\\t", $depth ) : \'\' ); // code indent
$display_depth = ( $depth + 1); // because it counts the first submenu as 0
$classes = array(
\'navi\',
( $display_depth == 1 ? \'first\' : \'\' ),
( $display_depth >= 2 ? \'navi\' : \'\' ),
\'menu-depth-\' . $display_depth
);
$class_names = implode( \' \', $classes );
// build html
$output .= "\\n" . $indent . \'<ul class="\' . esc_attr($class_names) . \'">\' . "\\n";
}
// add main/sub classes to li\'s and links
function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
global $wp_query;
$indent = ( $depth > 0 ? str_repeat( "\\t", $depth ) : \'\' ); // code indent
static $is_first;
$is_first++;
// depth dependent classes
$depth_classes = array(
( $depth == 0 ? \'main-menu-item\' : \'\' ),
( $depth >= 2 ? \'navi\' : \'\' ),
( $is_first == 1 ? \'menu-first\' : \'\' ),
\'menu-item-depth-\' . $depth
);
$depth_class_names = esc_attr( implode( \' \', $depth_classes ) );
// passed classes
$classes = empty( $item->classes ) ? array() : (array) $item->classes;
$class_names = esc_attr( implode( \' \', apply_filters( \'nav_menu_css_class\', array_filter( $classes ), $item ) ) );
$is_mega_menu = (strpos($class_names,\'mega\') !== false) ? true : false;
$use_desc = (strpos($class_names,\'use_desc\') !== false) ? true : false;
$is_sidebar = (strpos($class_names,\'menu_sidebar\') !== false) ? true : false;
$no_title = (strpos($class_names,\'no_title\') !== false) ? true : false;
if(!$is_mega_menu){
$class_names .= \' normal_menu_item\';
}
// build html
$output .= $indent . \'<li id="nav-menu-item-\'. esc_attr($item->ID) . \'" class="\' . esc_attr($depth_class_names) . \' \' . esc_attr($class_names) . \'">\';
// link attributes
$attributes = ! empty( $item->attr_title ) ? \' title="\' . esc_attr( $item->attr_title ) .\'"\' : \'\';
$attributes .= ! empty( $item->target ) ? \' target="\' . esc_attr( $item->target ) .\'"\' : \'\';
$attributes .= ! empty( $item->xfn ) ? \' rel="\' . esc_attr( $item->xfn ) .\'"\' : \'\';
$attributes .= ! empty( $item->url ) ? \' href="\' . (($item->url[0] == "#" && !is_front_page()) ? home_url() : \'\') . esc_attr($item->url) .\'"\' : \'\';
$attributes .= \' class="menu-link \'.((strpos($item->url,\'#\') === false) ? \'\' : \'scroll\').\' \' . ( $depth > 0 ? \'sub-menu-link\' : \'main-menu-link\' ) . \'"\';
$html_output = ($use_desc) ? \'<div class="description_menu_item">\'.wp_kses($item->description, allowed_tags()).\'</div>\' : \'\';
if ($is_sidebar) {
ob_start();
dynamic_sidebar($item->description);
$sidebar_html = ob_get_clean();
$sidebar_output = \'<div class="sidebar_menu_item">\'.$sidebar_html.\'</div>\';
$item_output = $sidebar_output;
} else{
$item_output = (!$no_title) ? \'<a \' . $attributes . \'><span>\' . apply_filters( \'the_title\', $item->title, $item->ID ) . \'</span></a>\'. $html_output : $html_output;
}
// build html
$output .= apply_filters( \'walker_nav_menu_start_el\', $item_output, $item, $depth, $args ).(($is_mega_menu)?\'<div class="sf-mega"><div class="sf-mega-inner clearfix">\':\'\');
}
function end_el( &$output, $item, $depth = 0, $args = array() ) {
$classes = empty( $item->classes ) ? array() : (array) $item->classes;
$class_names = esc_attr( implode( \' \', apply_filters( \'nav_menu_css_class\', array_filter( $classes ), $item ) ) );
$is_mega_menu = (strpos($class_names,\'mega\') !== false) ? true : false;
$output .= (($is_mega_menu)?\'</div></div>\':\'\') . "</li>\\n";
}
}
//Sidebars in Menu
if ( !class_exists(\'sidebars_custom_menu\')) {
class sidebars_custom_menu {
public function add_nav_menu_meta_boxes() {
add_meta_box(
\'sidebar_menu_add\',
esc_html__(\'Add Sidebar\', \'theme\'),
array( $this, \'nav_menu_link\'),
\'nav-menus\',
\'side\',
\'low\'
);
}
public function nav_menu_link() {?>
<div id="posttype-sidebars" class="posttypediv">
<div id="tabs-panel-sidebars" class="tabs-panel tabs-panel-active">
<ul id ="sidebars-checklist" class="categorychecklist form-no-clear">
<?php
$i = -1;
foreach ( $GLOBALS[\'wp_registered_sidebars\'] as $sidebar ) {
ob_start();
dynamic_sidebar($sidebar[\'id\']);
$sidebar_html = ob_get_clean();
?>
<li>
<label class="menu-item-title">
<input type="checkbox" class="menu-item-checkbox" name="menu-item[<?php echo esc_attr($i); ?>][menu-item-object-id]" value="<?php echo $sidebar[\'id\']; ?>"> <?php echo ucwords( $sidebar[\'name\'] ); ?>
</label>
<input type="hidden" class="menu-item-type" name="menu-item[<?php echo esc_attr($i); ?>][menu-item-type]" value="custom">
<input type="hidden" class="menu-item-attr-title" name="menu-item[<?php echo esc_attr($i); ?>][menu-item-attr-title]" value="<?php echo ucwords( $sidebar[\'name\'] ); ?>">
<input type="hidden" class="menu-item-title" name="menu-item[<?php echo esc_attr( $i ); ?>][menu-item-title]" value=" " />
<input type="hidden" class="menu-item-url" name="menu-item[<?php echo esc_attr($i); ?>][menu-item-url]" value="">
<input type="hidden" class="menu-item-classes" name="menu-item[<?php echo esc_attr($i); ?>][menu-item-classes]" value="menu_sidebar">
<input type="hidden" class="menu-item-description" name="menu-item[<?php echo esc_attr($i); ?>][menu-item-description]" value="<?php echo $sidebar[\'id\']; ?>">
</li>
<?php
$i --;
}
?>
</ul>
</div>
<p class="button-controls">
<span class="list-controls">
<a href="<?php echo admin_url( \'nav-menus.php?page-tab=all&selectall=1#posttype-sidebars\' ); ?>" class="select-all"><?php esc_html_e(\'Select All\', \'theme\'); ?></a>
</span>
<span class="add-to-menu">
<input type="submit" class="button-secondary submit-add-to-menu right" value="<?php esc_html_e(\'Add to Menu\', \'theme\');?>" name="add-post-type-menu-item" id="submit-posttype-sidebars">
<span class="spinner"></span>
</span>
</p>
</div>
<?php }
}
}
$custom_nav = new sidebars_custom_menu;
add_action(\'admin_init\', array($custom_nav, \'add_nav_menu_meta_boxes\'));
这将创建一个边栏列表，您可以将其放在菜单中，它们将有一个类
menu_sidebar 如果需要，可以使用它来设置小部件的样式。
希望这对有同样需求的人有所帮助。
