- Описание класса
- Методы
- build_atts()
- end_el()
- end_lvl()
- start_el()
- start_lvl()
- Примеры использования
- Создание HTML-атрибутов из массива ключ/значение
- Завершение вывода элемента, если необходимо
- Завершение списка после добавления элементов
- Начало вывода элемента
- Начало списка перед добавлением элементов
- Вопросы и ответы
- Как изменить HTML-разметку элементов меню?
- Как добавить класс к элементу меню?
- Как изменить атрибуты элемента меню?
- Как добавить иконку к элементу меню?
- Как изменить порядок элементов меню?
- Как добавить подменю к элементу меню?
- Как изменить стиль активного элемента меню?
- Как скрыть определенные элементы меню?
- Как добавить дополнительные классы к списку меню?
Описание класса
Класс Walker_Nav_Menu является основным классом, используемым в WordPress для реализации HTML-списка элементов навигационного меню. Он предоставляет методы для создания и обработки элементов меню, а также для управления их выводом.
Этот класс является частью ядра WordPress и используется внутри функции wp_nav_menu() для генерации HTML-кода навигационного меню. Он позволяет разработчикам создавать свои собственные классы-наследники, чтобы настроить вывод и поведение навигационного меню в соответствии с требованиями проекта.
Методы
build_atts()— Строит строку HTML-атрибутов из массива пар ключ/значение.end_el()— Завершает вывод элемента, если это необходимо.end_lvl()— Завершает список после добавления элементов.start_el()— Начинает вывод элемента.start_lvl()— Начинает список перед добавлением элементов.
Метод build_atts() используется для построения строки HTML-атрибутов из массива пар ключ/значение. Он принимает массив атрибутов и возвращает строку, содержащую HTML-код атрибутов.
Метод end_el() вызывается для завершения вывода элемента меню. Он проверяет, нужно ли закрыть открытый тег элемента, и если это необходимо, закрывает его.
Метод end_lvl() вызывается для завершения списка после добавления всех элементов. Он закрывает открытый тег списка, если это необходимо.
Метод start_el() вызывается для начала вывода элемента меню. Он открывает тег элемента и выводит его содержимое.
Метод start_lvl() вызывается для начала списка перед добавлением элементов. Он открывает тег списка, если это необходимо.
Методы
build_atts()
Метод build_atts() используется для создания строки HTML атрибутов из массива пар ключ/значение.
Метод принимает массив $atts с опциональными HTML атрибутами и возвращает строку HTML атрибутов.
Метод build_atts() используется в классе Walker_Nav_Menu для формирования атрибутов HTML элементов меню.
Walker_Nav_Menu::build_atts( array $atts = array() ): string Метод build_atts() принимает массив $atts с опциональными HTML атрибутами и возвращает строку HTML атрибутов.
$atts (array) (Optional) — Массив пар ключ/значение HTML атрибутов. По умолчанию: array().
Метод build_atts() возвращает строку HTML атрибутов.
<?php
/**
* Пример использования метода build_atts()
*/
// Массив атрибутов
$atts = array(
'class' => 'menu-item',
'id' => 'menu-item-1',
'data-url' => 'http://example.com',
);
// Вызов метода build_atts()
$attributes = Walker_Nav_Menu::build_atts( $atts );
// Вывод строки атрибутов
echo $attributes;
?> В данном примере создается массив атрибутов $atts с ключами ‘class’, ‘id’ и ‘data-url’ и соответствующими значениями. Затем вызывается метод build_atts() класса Walker_Nav_Menu с передачей массива атрибутов. Результатом работы метода будет строка атрибутов, которая выводится на экран.
end_el()
Метод end_el() используется для завершения вывода элемента меню. Он вызывается после вывода содержимого элемента и позволяет добавить дополнительный контент, если это необходимо.
Метод работает внутри класса Walker_Nav_Menu, который используется для создания HTML-списка элементов навигационного меню.
Walker_Nav_Menu::end_el( string $output, WP_Post $data_object, int $depth, stdClass $args = null ) Метод end_el() принимает следующие параметры:
$output(обязательный) — используется для добавления дополнительного контента (передается по ссылке).$data_object(обязательный) — объект данных элемента меню. В данном методе не используется.$depth(обязательный) — глубина вложенности элемента. В данном методе не используется.$args(необязательный) — объект аргументов функцииwp_nav_menu(). В данном методе не используется.
<?php
/**
* Пример использования метода end_el()
*
* @param string $output Используется для добавления дополнительного контента (передается по ссылке).
* @param WP_Post $data_object Объект данных элемента меню. В данном методе не используется.
* @param int $depth Глубина вложенности элемента. В данном методе не используется.
* @param stdClass|null $args Объект аргументов функции wp_nav_menu(). В данном методе не используется.
*/
function custom_end_el( &$output, $data_object, $depth, $args ) {
// Добавить дополнительный контент к выводу элемента
$output .= '<span class="additional-content">Дополнительный контент</span>';
}
add_action( 'walker_nav_menu_end_el', 'custom_end_el', 10, 4 );
?> В приведенном примере кода мы создаем функцию custom_end_el(), которая добавляет дополнительный контент к выводу элемента меню. Функция привязывается к хуку walker_nav_menu_end_el с приоритетом 10 и принимает 4 аргумента.
Внутри функции мы используем переменную $output, которая передается по ссылке, чтобы добавить дополнительный контент к выводу элемента. В данном случае мы добавляем тег <span> с классом «additional-content» и текстом «Дополнительный контент».
end_lvl()
Метод end_lvl() является частью класса Walker_Nav_Menu и используется для завершения списка элементов меню после добавления элементов.
Метод работает следующим образом: после добавления всех элементов меню в список, метод end_lvl() вызывается для завершения списка. Он не принимает никаких аргументов и не возвращает значения.
Метод end_lvl() используется внутри функции walk() класса Walker_Nav_Menu для генерации HTML-кода списка элементов меню.
Walker_Nav_Menu::end_lvl( string $output, int $depth, stdClass $args = null ) Метод end_lvl() не принимает никаких аргументов и не возвращает значения.
$output (string) — Обязательный. Используется для добавления дополнительного контента (передается по ссылке).
$depth (int) — Обязательный. Глубина элемента меню. Используется для добавления отступов.
$args (stdClass) — Необязательный. Объект аргументов функции wp_nav_menu(). Содержит дополнительные аргументы из функции wp_nav_menu().
Аргументы из функции wp_nav_menu():
menu(int|string|WP_Term) — Желаемое меню. Принимает ID, слаг, название или объект меню.menu_class(string) — CSS-класс для элементаul, который формирует меню. По умолчанию ‘menu’.menu_id(string) — ID, применяемый к элементуul, который формирует меню. По умолчанию — слаг меню, увеличенный на единицу.container(string) — Обернуть лиulи каким элементом. По умолчанию ‘div’.container_class(string) — Класс, применяемый к контейнеру. По умолчанию ‘menu-{slug меню}-container’.container_id(string) — ID, применяемый к контейнеру.container_aria_label(string) — Значение атрибута aria-label, применяемого к контейнеру, если он является элементом nav.fallback_cb(callable|false) — Если меню не существует, будет вызвана функция обратного вызова. По умолчанию ‘wp_page_menu’. Установите значение false, чтобы отключить резервное меню.before(string) — Текст перед разметкой ссылки.after(string) — Текст после разметки ссылки.link_before(string) — Текст перед текстом ссылки.link_after(string) — Текст после текста ссылки.echo(bool) — Выводить меню или возвращать его. По умолчанию true.depth(int) — Сколько уровней иерархии должно быть включено. 0 означает все. По умолчанию 0.walker(object) — Экземпляр пользовательского класса обходчика.theme_location(string) — Используемое местоположение темы. Должно быть зарегистрировано с помощьюregister_nav_menu(), чтобы пользователь мог выбрать его.items_wrap(string) — Как обернуть элементы списка. Использует форматprintf()с номерованными заполнителями. По умолчанию —ulс ID и классом.item_spacing(string) — Сохранять ли пробелы в HTML-разметке меню. Принимает значения ‘preserve’ или ‘discard’. По умолчанию ‘preserve’.
<?php
/**
* Пример использования метода end_lvl() класса Walker_Nav_Menu
*/
class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
/**
* Завершает список после добавления элементов
*
* @param string $output Используется для добавления дополнительного контента (передается по ссылке).
* @param int $depth Глубина элемента меню. Используется для добавления отступов.
* @param object $args Объект аргументов функции wp_nav_menu().
*/
public function end_lvl( &$output, $depth = 0, $args = null ) {
// Код метода end_lvl()
}
}
// Использование пользовательского класса обходчика
wp_nav_menu( array(
'theme_location' => 'primary',
'walker' => new Custom_Walker_Nav_Menu(),
) );
?> start_el()
Метод start_el() используется в классе Walker_Nav_Menu для вывода элемента меню. Он вызывается для каждого элемента меню и отвечает за формирование его HTML-кода. Метод позволяет настроить вывод элемента меню в соответствии с требованиями проекта.
Walker_Nav_Menu::start_el( string $output, WP_Post $data_object, int $depth, stdClass $args = null, int $current_object_id ) Метод start_el() принимает следующие параметры:
$output(строка, обязательный) — используется для добавления дополнительного контента (передается по ссылке).$data_object(WP_Post, обязательный) — объект данных элемента меню.$depth(целое число, обязательный) — уровень вложенности элемента меню. Используется для отступов.$args(stdClass, необязательный) — объект аргументов функцииwp_nav_menu(). Содержит дополнительные параметры для настройки вывода меню.$current_object_id(целое число, необязательный) — ID текущего элемента меню.
<?php
class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
// Ваш код для формирования HTML-кода элемента меню
}
}
?> В приведенном примере показано, как создать пользовательский класс Custom_Walker_Nav_Menu, который наследуется от Walker_Nav_Menu. Метод start_el() переопределяется в пользовательском классе для настройки вывода элемента меню.
start_lvl()
Метод start_lvl() используется в классе Walker_Nav_Menu для начала списка перед добавлением элементов. Он вызывается перед каждым уровнем вложенности элементов меню.
Метод принимает следующие параметры:
$output(обязательный) — используется для добавления дополнительного контента (передается по ссылке).$depth(обязательный) — глубина элемента меню. Используется для отступов.$args(необязательный) — объект аргументов функцииwp_nav_menu().
Метод не возвращает значения.
Walker_Nav_Menu::start_lvl( string $output, int $depth, stdClass $args = null ) Код метода start_lvl() с комментариями:
<?php
/**
* Начинает список перед добавлением элементов.
*
* @param string $output Используется для добавления дополнительного контента (передается по ссылке).
* @param int $depth Глубина элемента меню. Используется для отступов.
* @param stdClass $args Объект аргументов функции wp_nav_menu().
*/
public function start_lvl( &$output, $depth = 0, $args = null ) {
// Код метода start_lvl() здесь
}
?> Метод start_lvl() принимает следующие параметры:
$output(string, обязательный) — используется для добавления дополнительного контента (передается по ссылке).$depth(int, обязательный) — глубина элемента меню. Используется для отступов.$args(stdClass, необязательный) — объект аргументов функцииwp_nav_menu().
Аргументы из функции wp_nav_menu():
menu(int|string|WP_Term, обязательный) — идентификатор, слаг, название или объект меню.menu_class(string) — CSS-класс для элементаul, формирующего меню. По умолчанию ‘menu’.menu_id(string) — ID, применяемый к элементуul, формирующему меню. По умолчанию — слаг меню, увеличенный на единицу.container(string) — обернуть лиulи каким элементом. По умолчанию ‘div’.container_class(string) — класс, применяемый к контейнеру. По умолчанию ‘menu-{menu slug}-container’.container_id(string) — ID, применяемый к контейнеру.container_aria_label(string) — атрибут aria-label, применяемый к контейнеру, если он является элементом nav.fallback_cb(callable|false) — функция обратного вызова, которая будет вызвана, если меню не существует. По умолчанию ‘wp_page_menu’. Установите значение false для отсутствия резервного варианта.before(string) — текст перед разметкой ссылки.after(string) — текст после разметки ссылки.link_before(string) — текст перед текстом ссылки.link_after(string) — текст после текста ссылки.echo(bool) — выводить ли меню или возвращать его. По умолчанию true.depth(int) — сколько уровней иерархии должно быть включено. 0 означает все уровни. По умолчанию 0.walker(object) — экземпляр пользовательского класса обходчика.theme_location(string) — местоположение темы, которое будет использоваться. Должно быть зарегистрировано с помощью функцииregister_nav_menu(), чтобы быть доступным для выбора пользователем.items_wrap(string) — как должны быть обернуты элементы списка. Использует форматprintf()с номерованными заполнителями. По умолчанию —ulс id и class.item_spacing(string) — сохранять ли пробелы в HTML-разметке меню. Принимает значения ‘preserve’ или ‘discard’. По умолчанию ‘preserve’.
<?php
/**
* Начинает список перед добавлением элементов.
*
* @param string $output Используется для добавления дополнительного контента (передается по ссылке).
* @param int $depth Глубина элемента меню. Используется для отступов.
* @param stdClass $args Объект аргументов функции wp_nav_menu().
*/
public function start_lvl( &$output, $depth = 0, $args = null ) {
// Ваш код здесь
}
?> Примеры использования
Создание HTML-атрибутов из массива ключ/значение
/**
* Builds a string of HTML attributes from an array of key/value pairs.
*
* @param array $atts The array of attributes.
* @return string The string of HTML attributes.
*/
public function build_atts( $atts ) {
$html_atts = '';
foreach ( $atts as $key => $value ) {
$html_atts .= ' ' . $key . '="' . esc_attr( $value ) . '"';
}
return $html_atts;
}
Метод build_atts используется для создания строки HTML-атрибутов из массива ключ/значение. Он принимает массив атрибутов $atts и возвращает строку HTML-атрибутов.
В примере кода выше, метод проходит по каждому элементу массива $atts и добавляет его в строку $html_atts в формате ключ="значение". Значение атрибута также проходит через функцию esc_attr, чтобы быть безопасным для вывода в HTML.
Завершение вывода элемента, если необходимо
/**
* Ends the element output, if needed.
*
* @param string $item_output The HTML output for the current menu item.
* @param object $item The current menu item.
* @param int $depth Depth of the current menu item.
* @param array $args An array of arguments.
*/
public function end_el( &$output, $item, $depth = 0, $args = array() ) {
$output .= "</li>n";
}
Метод end_el используется для завершения вывода элемента меню, если это необходимо. Он принимает следующие параметры: $item_output — HTML-вывод для текущего элемента меню, $item — текущий элемент меню, $depth — глубина текущего элемента меню, $args — массив аргументов.
В примере кода выше, метод добавляет закрывающий тег </li> в конец строки $output, чтобы завершить вывод элемента меню.
Завершение списка после добавления элементов
/**
* Ends the list of after the elements are added.
*
* @param string $output The HTML output for the menu.
* @param int $depth Depth of the menu.
* @param array $args An array of arguments.
*/
public function end_lvl( &$output, $depth = 0, $args = array() ) {
$output .= "</ul>n";
}
Метод end_lvl используется для завершения списка после добавления элементов. Он принимает следующие параметры: $output — HTML-вывод для меню, $depth — глубина меню, $args — массив аргументов.
В примере кода выше, метод добавляет закрывающий тег </ul> в конец строки $output, чтобы завершить список после добавления элементов.
Начало вывода элемента
/**
* Starts the element output.
*
* @param string $output The HTML output for the menu item.
* @param object $item The current menu item.
* @param int $depth Depth of the current menu item.
* @param array $args An array of arguments.
* @param int $id Current menu item ID.
*/
public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
$output .= "<li" . $this->build_atts( $item->classes ) . ">n";
}
Метод start_el используется для начала вывода элемента меню. Он принимает следующие параметры: $output — HTML-вывод для текущего элемента меню, $item — текущий элемент меню, $depth — глубина текущего элемента меню, $args — массив аргументов, $id — ID текущего элемента меню.
В примере кода выше, метод добавляет открывающий тег <li> в конец строки $output и вызывает метод build_atts для создания HTML-атрибутов из массива классов элемента меню.
Начало списка перед добавлением элементов
/**
* Starts the list before the elements are added.
*
* @param string $output The HTML output for the menu.
* @param int $depth Depth of the menu.
* @param array $args An array of arguments.
*/
public function start_lvl( &$output, $depth = 0, $args = array() ) {
$output .= "<ul class="sub-menu">n";
}
Метод start_lvl используется для начала списка перед добавлением элементов. Он принимает следующие параметры: $output — HTML-вывод для меню, $depth — глубина меню, $args — массив аргументов.
В примере кода выше, метод добавляет открывающий тег <ul class="sub-menu"> в конец строки $output, чтобы начать список перед добавлением элементов.
Вопросы и ответы
Как изменить HTML-разметку элементов меню?
Для изменения HTML-разметки элементов меню в WordPress можно использовать класс Walker_Nav_Menu. Этот класс предоставляет различные методы, которые можно переопределить для настройки вывода HTML-кода.
Метод start_el используется для начала вывода каждого элемента меню. В нем можно изменить HTML-разметку элемента меню, добавить или изменить классы и атрибуты.
Пример кода:
class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
$output .= '<li>';
$output .= '<a href="' . $item->url . '">' . $item->title . '</a>';
$output .= '</li>';
}
}
Как добавить класс к элементу меню?
Чтобы добавить класс к элементу меню, можно использовать метод start_el класса Walker_Nav_Menu. В этом методе можно проверить условия и добавить нужный класс к элементу меню.
Пример кода:
class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
$classes = empty( $item->classes ) ? array() : (array) $item->classes;
$classes[] = 'custom-class';
$output .= '<li class="' . esc_attr( implode( ' ', $classes ) ) . '">';
$output .= '<a href="' . $item->url . '">' . $item->title . '</a>';
$output .= '</li>';
}
}
Как изменить атрибуты элемента меню?
Для изменения атрибутов элемента меню можно использовать метод start_el класса Walker_Nav_Menu. В этом методе можно изменить или добавить нужные атрибуты к элементу меню.
Пример кода:
class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
$atts = array();
$atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : '';
$atts['target'] = ! empty( $item->target ) ? $item->target : '';
$atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : '';
$atts['href'] = ! empty( $item->url ) ? $item->url : '';
$atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args, $depth );
$attributes = '';
foreach ( $atts as $attr => $value ) {
if ( ! empty( $value ) ) {
$attributes .= ' ' . $attr . '="' . esc_attr( $value ) . '"';
}
}
$output .= '<li>';
$output .= '<a' . $attributes . '>' . $item->title . '</a>';
$output .= '</li>';
}
}
Как добавить иконку к элементу меню?
Чтобы добавить иконку к элементу меню в WordPress, необходимо использовать фильтр nav_menu_item_title. Этот фильтр позволяет изменить заголовок элемента меню перед его выводом.
function add_menu_item_icon($title, $item) {
// Получаем иконку из метаданных элемента меню
$icon = get_post_meta($item->ID, '_menu_item_icon', true);
// Проверяем, есть ли иконка
if ($icon) {
// Добавляем иконку к заголовку элемента меню
$title .= ' <i class="' . $icon . '"></i>';
}
return $title;
}
add_filter('nav_menu_item_title', 'add_menu_item_icon', 10, 2);
Как изменить порядок элементов меню?
Для изменения порядка элементов меню в WordPress можно использовать фильтр wp_nav_menu_objects. Этот фильтр позволяет изменить массив объектов элементов меню перед его обработкой и выводом.
function change_menu_order($sorted_menu_items, $args) {
// Перемешиваем элементы меню в случайном порядке
shuffle($sorted_menu_items);
return $sorted_menu_items;
}
add_filter('wp_nav_menu_objects', 'change_menu_order', 10, 2);
Как добавить подменю к элементу меню?
Для добавления подменю к элементу меню в WordPress необходимо использовать фильтр walker_nav_menu_start_el. Этот фильтр позволяет изменить вывод элемента меню перед его открытием.
function add_submenu($item_output, $item, $depth, $args) {
// Проверяем, есть ли подменю у элемента меню
if (in_array('menu-item-has-children', $item->classes)) {
// Получаем ID родительского элемента меню
$parent_id = $item->ID;
// Получаем HTML-код подменю
$submenu = wp_nav_menu(array(
'theme_location' => $args->theme_location,
'menu' => $item->menu,
'container' => '',
'menu_class' => 'sub-menu',
'menu_id' => 'submenu-' . $parent_id,
'depth' => $depth + 1,
'echo' => false
));
// Добавляем подменю к элементу меню
$item_output .= $submenu;
}
return $item_output;
}
add_filter('walker_nav_menu_start_el', 'add_submenu', 10, 4);
Как изменить стиль активного элемента меню?
Для изменения стиля активного элемента меню в классе Walker_Nav_Menu можно использовать метод start_el(). В этом методе можно добавить дополнительный класс к активному элементу, чтобы применить нужные стили.
class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
// Добавляем класс "active" к активному элементу
if ( in_array( 'current-menu-item', $item->classes ) ) {
$output .= '<li class="active">';
} else {
$output .= '<li>';
}
// Выводим содержимое элемента меню
$output .= $item->title;
// Закрываем тег li
$output .= '</li>';
}
}
Как скрыть определенные элементы меню?
Для скрытия определенных элементов меню в классе Walker_Nav_Menu можно использовать метод start_el(). В этом методе можно проверить условие и не выводить элементы, которые нужно скрыть.
class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
// Проверяем условие и не выводим элементы с определенным ID
if ( $item->ID == 2 || $item->ID == 3 ) {
return;
}
// Выводим содержимое элемента меню
$output .= $item->title;
}
}
Как добавить дополнительные классы к списку меню?
Для добавления дополнительных классов к списку меню в классе Walker_Nav_Menu можно использовать метод start_lvl(). В этом методе можно добавить нужные классы к открывающему тегу списка меню.
class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
function start_lvl( &$output, $depth = 0, $args = array() ) {
// Добавляем дополнительные классы к списку меню
$output .= '<ul class="custom-menu">';
}
}
Класс
Walker_Nav_Menuявляется ядром для реализации HTML-списка элементов меню. Он предоставляет методы для изменения стиля активного элемента меню, скрытия определенных элементов и добавления дополнительных классов к списку меню. Используя эти методы, разработчики WordPress могут легко настраивать и управлять выводом меню на своих сайтах.