Главная › Новости

Как в wordpress добавить меню? – шаблон горизонтального меню

Опубликовано: 30.04.2018

Как добавить иконки в меню Wordpress

Всем привет, сегодня я хочу рассказать вам как можно в wordpress добавить меню. Казалось бы не сложная задача, но хороших 10 - 15% вопросов связаные именно с меню, ведь несмотря на то, что у вордпресс есть специальная функция wp_nav_menu - разработчики шаблонов то и дело маются ерундой и делают его через всем известное место. Далее я покажу вам пошаговую инструкцию как создать шаблон меню.

В качестве примера предлагаю вам, вместе со мной, сделать простенькое, одноуровневое, горизонтальное меню wordpress.

Как добавить категорию меню wordpress. Woocommerce - настройка меню

Если вы искали информацию о выпадающих меню wordpress, советую обратить внимание на эти статьи:

Горизонтальное выпадающее меню Вертикальное выпадающее меню

В этих статьях описан механизм создания меню, вам будет достаточно скопировать html и CSS с примеров и вывести через php меню для WordPress как описано ниже в этой статье.

Как создать и добавить подрубрики в меню WordPress

Навигация по странице:

Для начала нам потребуется хтмл код для меню, им мы и займемся.

Горизонтальное меню wordpress на HTML+CSS

к меню Я не буду особо много времени уделять моментам по созданию Html и CSS для нашего меню. Постараюсь просто привести части кода и краткое описание к ним.

Html код нашего меню будет самый простой:

<nav id="nav1"> <ul> <li><a href="#">Главная</a></li> <li><a href="#">О нас</a></li> <li><a href="#">Отзывы</a></li> <li><a href="#">Новости</a></li> <li><a href="#">Статьи</a></li> <li><a href="#">Вопрос/Ответ</a></li> <li><a href="#">Контакты</a></li> </ul> </nav>

Именно таким списком ul по-умолчанию генерирует меню вордпресс.

Стили для этого горизонтального меню, также будут несложные, хотя тут вы можете найти код для растягивания меню на всю ширину блока.