Как добавить описание к пунктам меню в WordPress
Сегодня добавим небольшие пояснения к пунктам меню, чтобы подсказать пользователям что их ждёт по каждой ссылке.
Шаг 1. Включаем и заполняем описания пунктов меню
Переходим в раздел Внешний вид -> Меню, щёлкаем по вкладке «Настройки экрана» (1) в верхнем правом углу и отмечаем галочкой пункт «Описание» (2).
Поочередно щёлкаем по каждому пункту выбранного меню и добавляем пояснение в поле «Описание».
Жмём кнопку «Сохранить меню» в верхней правой части сайт и переходим к шагу 2.
Шаг 2. Добавляем сниппет для вывода описания пунктов меню
Большинство тем не выводит описание пунктов меню, но мы можем исправить это, добавив на сайт следующий сниппет.
|
1 2 3 4 5 6 7 8 9 |
function wpspec_menu_desc( $item_output, $item, $depth, $args ) { if ($item->description) { $item_output = str_replace( '</a>', '<span class="description">' . $item->description . '</span></a>', $item_output ); } return $item_output; } add_filter( 'walker_nav_menu_start_el', 'wpspec_menu_desc', 10, 4 ); |
Шаг 3. Корректируем оформление пунктов меню и проверяем результат
Чтобы описание не сливалось со ссылками меню, добавим немного CSS-кода. Переходим в Внешний вид -> Настроить -> Дополнительные стили и добавляем следующий код.
|
1 2 3 4 5 |
.menu-item .description { display: block; font-weight: normal; font-size: smaller; } |
Жмём кнопку «Опубликовать» и проверяем результат.
Кто знает как сделать так чтоб в описнание можно было вставлять HTML?
Просто щас он пребразует символы в HTML сущности.