Полезные сниппеты для меню WordPress

Разработка кастомного меню на WordPress — звучит немного пугающе, но зачастую плагины для меню увеличивают не только ваше общее количество плагинов, но уменьшают скорость загрузки сайта и не позволяют отобразить меню точно в соответствии с дизайном. Мы даем вам сниппеты для вывода меню в WordPress, которые мы часто используем.

Отображение меню в кастомной теме WordPress.

Чаще всего для вывода меню в теме создают location(s). Оразец кода ниже нужно поместить в файл functions.php.

/**
 * Register for theme menu.
 */
function theme_register_menu() {
	register_nav_menu( 'primary', 'Primary Menu' );
	register_nav_menu( 'settings', 'Settings Menu' );
}
add_action( 'after_setup_theme', 'theme_register_menu', 11 );

Далее для вывода меню в шаблонах темы (обычно header.php) нужно использовать код:

/**
 * Displaying the theme menu.
 */
$args = array(
	'menu'              => 'primary',
	'menu_id'           => 'main_menu',
	'theme_location'    => 'primary',
	'container'         => ''
);
wp_nav_menu( $args );

Чтобы удалить ссылки из меню или вывести пункты меню как текст:

Все сниппеты ниже нужно вставлять в файл functions.php.

/**
 * Adding span to a menu. 
 * Class text allows wrapping menu item within span tag instead of a tag.
 * Class disable allows to remove menu item wrapper at all.
 */
function span_to_nav_menu( $item_output, $item, $depth, $args ) {
	if ( isset( $item->classes ) && !empty( $item->classes ) ) {
		if ( in_array( 'text', (array) $item->classes ) ) {
			$item_output = '<span class="title">'. $item->title .'</span>';
		} elseif ( in_array( 'disable', (array) $item->classes ) ) {
			$item_output = '';
		}
	}
	return $item_output;
}
add_filter( 'walker_nav_menu_start_el', 'span_to_nav_menu', 10, 4 );

Разрешить вставлять шорткоды к заглавия пунктов меню в WordPress нужно использовать код:

/**
 * Allow shortcodes in a menu in the title.
 */
add_filter('wp_nav_menu_items', 'do_shortcode');

Добавляем HTML код или шорткоды в описание пунков меню в WordPress сниппетом:

/**
 * Allow HTML and shortcodes in a menu in the description.
 */
remove_filter( 'nav_menu_description', 'strip_tags' );
function my_plugin_wp_setup_nav_menu_item( $menu_item ) {
  if ( ! is_admin() && isset( $menu_item->post_type ) ) {
    if ( 'nav_menu_item' == $menu_item->post_type ) {
      $menu_item->description = do_shortcode($menu_item->post_content);
    }
  }

  return $menu_item;
}
add_filter( 'wp_setup_nav_menu_item', 'my_plugin_wp_setup_nav_menu_item' );

Этот код добавляет дополнительную обертку сабменю.

Не забудьте указать walker в агрументах при выводе меню: ‘walker’ => new Custom_Sublevel_Walker

/**
 * Extending menu walker. Allow to wrap submenus. Just an example.
 */
class Custom_Sublevel_Walker extends Walker_Nav_Menu
{
    function start_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);
        if ( $depth == 0 ) {
        	$output .= "\n$indent<div class='sub-menu-wrap first_level_menu'><ul class='sub-menu row'>\n";
        } elseif( $depth == 1 ) {
        	$output .= "\n$indent<div class='sub-menu-wrap second_level_menu'><ul class='sub-menu row'>\n";
        } elseif( $depth == 2 ) {
        	$output .= "\n$indent<div class='sub-menu-wrap third_level_menu'><ul class='sub-menu'>\n";
        } else {
        	$output .= "\n$indent<div class='sub-menu-wrap fourth_level_menu'><ul class='sub-menu'>\n";
        }
    }
    function end_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);
        $output .= "$indent</ul></div>\n";
    }
}

Надеемся, что сниппеты для меню WordPress, которые мы привели в этой статье, окажутся для вас полезными и вы оставите нам хороший отзыв) Если же нет, то расскажите о вашей задаче и мы попробуем вам помочь.