Описание пунктов меню? Пользовательский ходок для wp_nav_menu ()
Нормальное меню Wordpress выглядит следующим образом:
Главная | Блог | О нас | Контакт
Но я видел много страниц с описаниями по этим ссылкам:
Главная страница | Наши блоги | О нас | Контакт
.... встретиться с нами ... | Читать дальше | основная информация | контактная форма
Как это сделать?
(Я хочу, чтобы это была основная функция для всех моих тем, поэтому никаких плагинов, пожалуйста, я просто хочу знать, как это делается)
4 ответа
Для навигационного меню вам нужен пользовательский ходок.
В принципе, вы добавляете параметр 'walker'
в < code> wp_nav_menu () и вызовите экземпляр расширенного класса:
wp_nav_menu (
массив (
'menu' => 'главное меню',
'container' => ЛОЖНЫЙ,
'container_id' => ЛОЖНЫЙ,
'menu_class' => '',
'menu_id' => ЛОЖНЫЙ,
'depth' => 1,
'walker' => новый Описание_Walker
)
);
Класс Описание_Walker
расширяет Walker_Nav_Menu
и изменяет функцию start_el (& $ output, $ item, $ depth, $ args)
для поиска $ item- >. описание
Основной пример:
/**
* Создайте HTML-список элементов навигационного меню.
* Замена для родного Уокера, используя описание.
*
* @see https://wordpress.stackexchange.com/q/14037/
* @author fuxia
* /
class Описание_Walker расширяет Walker_Nav_Menu
{
/**
* Запустите вывод элемента.
*
* @param string $ output Передано по ссылке. Используется для добавления дополнительного контента.
* @param object $ item Объект данных элемента меню.
* @param int $ depth Глубина элемента меню. Может использоваться для заполнения.
* @param array | object $ args Дополнительные строки. На самом деле всегда
экземпляр stdClass. Но это WordPress.
* @return void
* /
function start_el (& $ output, $ item, $ depth = 0, $ args = array (), $ id = 0)
{
$ classes = empty ($ item-> классы)? array (): (array) $ item-> classes;
$ class_names = join (
''
, apply_filters (
'Nav_menu_css_class'
, array_filter ($ classes), $ item
)
);
! empty ($ class_names)
и $ class_names = 'class = ". esc_attr ($ class_names).'" ';
$ output. = "<li id = 'menu-item- $ item-> ID' $ class_names>";
$ attributes = '';
! empty ($ item-> attr_title)
и $ attributes. = 'title = "'. esc_attr ($ item-> attr_title). '' ';
! empty ($ item-> target)
и $ attributes. = 'target = "'. esc_attr ($ item-> target). '"';
! empty ($ item-> xfn)
и $ attributes. = 'rel = "'. esc_attr ($ item-> xfn). '"';
! empty ($ item-> url)
и $ attributes. = 'href = "'. esc_attr ($ item-> url). '"';
//вставить описание только для элементов верхнего уровня
//вы можете изменить это
$ description = (! empty ($ item-> description) и 0 == $ depth)
? '<small class = "nav_desc">' , esc_attr (описание $ item->). '& Л; /малый >' : '';
$ title = apply_filters ('the_title', $ item-> title, $ item-> ID);
$ item_output = $ args-> before
, "<атрибуты>"
, $ Args- > link_before
, $ название
, «& Л; /а > '
, $ Args- > link_after
, $ описание
, $ Args- > после того;
//Поскольку $ output вызывается по ссылке, нам ничего не нужно возвращать.
$ output. = apply_filters (
'Walker_nav_menu_start_el'
, $ item_output
, $ item
, $ depth
, $ args
);
}
}
Или, альтернативно как комментарий @nevvermind , вы можете наследовать все функции родительской функции start_el
и просто добавить описание в $ output
:
function start_el (& $ output, $ item, $ depth = 0, $ args = array (), $ id = 0)
{
parent :: start_el ($ output, $ item, $ depth, $ args);
$ output. = sprintf (
'& Л; я >% s & л; /& я GT;',
esc_html (описание $ item->)
);
}
Пример вывода:
wp -admin /nav-menus.php
, чтобы получить возможность редактировать это поле. Если вы не используете WP, просто уничтожаете свой полный контент в нем.
Связанные ошибки
И это так.
Поскольку WordPress 3.0 , вы не нуждаетесь в специальном ходоке больше!
Существует walker_nav_menu_start_el
фильтр, см. https://developer.wordpress.org/reference/hooks/walker_nav_menu_start_el/
Пример:
function add_description_to_menu ($ item_output, $ item, $ depth, $ args) {
if (strlen (описание $ item->)> 0) {
//append описание после ссылки
$ item_output. = sprintf ('<span class = "description">% s </span>', esc_html (описание $ item->));
//вставляем описание как последний элемент * в * ссылку ($ input_output заканчивается на «</a> {$ args-> after}")
//$ item_output = substr ($ item_output, 0, -strlen ("</a> {$ args-> after}")). sprintf ('<span class = "description">% s </span>', esc_html (описание $ item->)). "& Л; /а > {$ args- > после того, как}";
}
return $ item_output;
}
add_filter ('walker_nav_menu_start_el', 'add_description_to_menu', 10, 4);
Это не лучше или хуже других предложений; это просто другое. Он короткий и сладкий тоже.
Вместо того, чтобы использовать поле описания в качестве @toscho , вы можете заполнить поле «Название» на каждый пункт меню с нужным текстом, а затем используйте этот CSS:
.menu-item a: после {content: attr (название); }
Было бы также легко использовать jQuery , чтобы добавить его, но текст достаточно декоративен, что CSS кажется подходящим .
Вы также можете записать элемент <span>
после метки навигации в меню и использовать следующее правило CSS для изменения его display
(это inline
):
span {display: block}