Бывает, что в WordPress возникает необходимость добавить свое меню — горизонтальное, вертикальное, выпадающее, со своим стилем и т. д. Чтобы создать меню в WordPress, мы напишем функцию добавления меню и разместим ее в нужной части темы WordPress. Добавим функцию создания меню в файл wp-content/themes/ваша_тема/functions.php. Если в папке с вашей темой этот файл отсутствует, просто создайте его.
Добавьте в functions.php:
function my_menu() {
Теперь нужно сформировать меню и его пункты. В примере я буду выводить меню, состоящее из тэгов и категорий WordPress. Для начала нам нужно создать само меню:
echo "<ul class='my_menu'>";
Далее нужно создать пункт меню «Категории» и выпадающее меню категорий. Для генерации списка категорий будет использоваться функция wp_list_categories(). Подробнее про использование этой функции вы можете узнать из статьи как программно вывести список категорий и терминов таксономии в WordPress.
Я буду выводить список категорий без учета иерархии:
echo " <li>Категории"; echo " <ul>"; //Выводим подменю $args = array( 'orderby' => 'name', 'hierarchical' => false, 'title_li' => "", //Скрываем заголовок у списка ); wp_list_categories($args); //Выводим список категорий echo ' </ul>'; echo ' </li>'; //Закрывающий тег пункта меню "Категории"
Далее выводим второй пункт — меню «теги» и его подменю — список тэгов:
echo " <li>Тэги"; echo ' <ul>'; //Выводим подменю $args = array( 'orderby' => 'name', 'taxonomy' => "post_tag", //Указываем тип таксономии - список тэгов 'title_li' => "", //Скрываем заголовок у списка ); wp_list_categories($args); //Выводим список тэгов echo ' </ul>'; //Закрывающий тэг подменю echo ' </li>'; //Закрывающий тег пункта меню "Тэги" echo '</ul>'; //Закрываем тэг меню 'my_menu'
Функция my_menu целиком:
<?php function my_menu() { echo "<ul class='my_menu'>"; echo " <li>Категории"; echo ' <ul>'; $args = array( 'orderby' => 'name', 'hierarchical' => false, 'title_li' => "", //Скрываем заголовок у списка ); wp_list_categories($args); //Выводим подменю категорий echo ' </ul>'; //Закрывающий тэг подменю echo ' </li>'; //Закрывающий тег пункта меню "Категории" echo " <li>Тэги"; echo ' <ul>'; $args = array( 'orderby' => 'name', 'taxonomy' => "post_tag", //Указываем имя таксономии - список тэгов 'title_li' => "", //Скрываем заголовок у списка ); wp_list_categories($args); //Выводим подменю тэгов echo ' </ul>'; //Закрывающий тэг подменю echo ' </li>'; //Закрывающий тег пункта меню "Тэги" echo '</ul>'; //Закрываем тэг меню 'my_menu' }
После этого нужно вызвать функцию my_menu() в коде темы. Для примера я размещу эту функцию в файле шапки (header.php) моей темы. Вы можете разместить эту функцию где угодно, в подвале (footer.php), или сайдбаре (sidebar.php) например:
<?php my_menu(); //Вставляем функцию в код скрипта темы, в моем случае в header.php ?>
HTML код полученного в результате работы функции меню:
<ul class="my_menu"> <li>Категории <ul> <li class="cat-item cat-item-41"><a href="">CMS</a> </li> <li class="cat-item cat-item-4"><a href="">PHP</a> </li> <li class="cat-item cat-item-34"><a href="">PHP для новичков</a> </li> <li class="cat-item cat-item-5"><a href="">SQL</a> </li> <li class="cat-item cat-item-39"><a href="">Wordpress</a> </li> <li class="cat-item cat-item-10"><a href="">Администрирование UNIX</a> </li> <li class="cat-item cat-item-3"><a href="">Администрирование Web-сервера</a> </li> <li class="cat-item cat-item-9"><a href="">Администрирование Windows</a> </li> </ul> </li> <li>Тэги <ul> <li class="cat-item cat-item-12"><a href="">Apache</a></li> <li class="cat-item cat-item-40"><a href="">linux</a></li> <li class="cat-item cat-item-43"><a href="">VirtualBox</a> </li> </ul> </li> </ul>
Теперь осталось применить CSS стили к данному меню, сделав его к примеру, выпадающим. Как это сделать читайте в статье Создание горизонтального выпадающего меню на чистом CSS.
Статьи по теме: