Навигация и меню в Wordpress
Все, что касается создания и управления разными видами/типами меню в Wordpress сайте. Сюда же добавил статьи, рассказывающие о тех или иных видах навигации по страницам вашего веб-проекта.
Сниппеты для хлебных крошек Yoast SEO – редактирование элементов, заголовка
Уже много лет я использую модуль Yoast SEO для всего, что связано с оптимизацией вебстраниц в Вордпресс. Это самое крутое и функциональное решение в данной сфере с кучей дополнительных возможностей, позволяющих, например, вручную выбирать основную категорию записи и даже создавать хлебные крошки. О последнем пункте поговорим подробнее, точнее рассмотрим парочку сниппетов, помогающих модифицировать их вывод на сайте. Иногда бывают ситуации, когда надо добавить еще один блок ссылок или убрать лишний.
Иконки в меню WordPress — добавляем вручную и с плагином
Существует несколько причин для создания в WordPress меню с картинками (иконками). Во-первых, это отличный способ сэкономить место, заменив название главной страницы на «домик». Во-вторых, некоторые символы говорят намного больше нежели текстовые значения — кнопки Facebook, Twitter и т.п. И наконец, в-третьих, графические элементы могут сделать навигацию еще нагляднее за счет добавления изображений, например, в списке категорий. Все три варианта вы можете видеть с превьюшке поста слева. А ниже я расскажу как их можно реализовать.
Редактируем меню личного кабинета WooCommerce (как добавить / удалить пункт)
В блоге я рассматривал около десятка задач по навигации на сайте: были списки ссылок, хлебные крошки, работа с пунктами меню админки и т.п. Сегодня чуть более экзотическая ситуация, которая случается не так часто, но все же имеет место быть. Речь пойдет о личном кабинете покупателя в WooCommerce, где также используется элемент навигации. Будем учиться его модифицировать — а именно добавлять новые пункты либо скрывать ненужные. Вторая задача встречается почаще, но мы уделим внимание обеим.
Создаем WooCommerce меню категорий и не только (через админку, виджеты, плагины)
Есть у некоторых разработчиков плагинов нехорошая привычка скрывать важные опции во вкладку «Настройки экрана». Отчасти из-за этого раньше я создавал навигацию для магазина через добавление произвольных ссылок, вручную прописывая URL’ы. Каково же было мое удивление, когда в одном из проектов увидел полноценное WooCommerce меню категорий товаров. Сегодня расскажу как легко его реализовать + рассмотрю другие смежные нюансы. В работе нам помогут некоторые виджеты и, рассмотренный ранее, модуль MegaMenu.
Ссылки на предыдущие / следующие WordPress записи: функции next_post_link, previous_post_link и др.
В статье про оформление записей блога я рассмотрел примеры и коды для вывода некоторых дополнительных информационных элементов на страницах постов: связных заметок, названий тегов/категорий и т.п. Похожей фишкой также являются ссылки на предыдущие и следующие WordPress записи. Данные линки будут полезны при навигации посетителей сайта, а также являются еще одним способом перелинковки. Именно поэтому стараюсь добавлять их в каждый свой проект.
Создаем список ссылок в сайдбаре с картинками +плагины блогролла
Недавно в заметке о плагинах популярных постов меня спросили как лучше организовать простой список ссылок в сайдбаре. Причем желательно, чтобы там присутствовали миниатюры, и все было максимально легко без сверхсложных модулей. Вопрос оказался не совсем однозначным, поэтому в статье решил рассмотреть несколько ситуаций.
Отчасти решение зависит от конкретной поставленной задачи. Во-первых, какие именно объекты нужно выводить в боковой панели сайта: посты блога? перелинковку произвольных страниц? внешние линки?
Max Mega Menu — функциональный плагин мега меню для WordPress сайтов
Насколько я понимаю, под термином мега меню в WordPress подразумевают сверхфункциональное огромный блок навигации по сайту со множеством разных элементов: списками, картинками, текстами, слайдерами и т.п. Наверняка вы такие встречали. Когда-нибудь опубликую полноценную подборку по теме, но сегодня речь пойдет о вполне конкретном решении — плагине Max Mega Menu. Выбрал его так как уже тестировал в работе для WooCommerce меню, он часто попадает в списки лучших модулей, плюс тут имеется одна из самых толковых и постоянно развивающихся бесплатных (Lite) версий.
Разное обычное и мобильное меню в WordPress, функция wp_is_mobile, плагин WP Responsive Menu
В процессе работы над одним интернет-магазином у меня возникла ситуация, когда основное горизонтальное WordPress меню содержало около двух десятков ссылок. На сайте их легко можно оформить в виде выпадающих списков, но в мобильной версии все это скапливалось в одном блоке. Такой элемент выглядит «захламленным» и, вероятно, мешает некоторым пользователям сориентироваться.
Одним из выходов из ситуации есть создание альтернативного мобильного меню в WordPress, которое бы имело упрощенный вид и содержало лишь ссылки на основные разделы.
Как убрать пункты меню в WordPress админке
В блоге найдете много статей по оформлению меню сайта, которое служит навигацией для посетителей вашего веб-проекта, например, были заметки о специальной функции wp_nav_menu, использованию иконок в меню или про создание хлебных крошек. Но сегодняшний пост посвящен немного другой теме — я поделюсь приемами модификации элементов внутри админки, в частности обсудим как убрать меню в WordPress, избавиться от ненужных разделов, выборочно скрывать пункты и т.п.
Я начинал данную тему с одной лишь задачи, что требовалось для недавнего проекта, однако со временем собрал несколько полезных фишек.
Создаем хлебные крошки для WordPress сайта
Хлебные крошки в Вордпресс (Breadcrumbs) или в любой другой CMS — это дополнительная навигация по сайту, что отображает ваше положение относительно иерархии проекта. То есть, грубо говоря, данное меню показывает в каком разделе, странице или категории вы в текущий момент находитесь. Многие пользователи считают этот элемент именно «меню», т.к. он содержит активные ссылки с возможностью перехода. Не буду спорить о терминологии, а лучше расскажу обо всех сложностях и нюансах, возникающих при настройке хлебных крошек в WordPress.
Advanced Sidebar Menu — виджет зависимого бокового меню для wordpress
Давайте рассмотрим решение одной тривиальной задачи с wordpress меню которая время от времени встречается разработчикам. Бывает, что на сайтах нужно выводить сразу два меню, которые при этом между собой взаимосвязаны: одно верхнее горизонтальное 1-го уровня, а второе в сайдбаре 2-го уровня. Причем в боковом отображаются только те подпункты, для которых выбран соответствующий родительский элемент в главном меню. Например, если у вас в шапке сайта есть перечень стран, то выбрав, допустим, Италию, в сайдбаре получите только лишь список итальянских городов.
Простое раскрывающееся вертикальное меню в WordPress
Для некоторых веб-проектов разработчики используют раскрывающееся вертикальное меню, где изначально все подразделы скрыты и отображаются только при клике на родительский элемент. Несколько раз я сталкивался с данной задачей, но, убеждал заказчиков отказаться от подобной реализации. Дело в том, что для небольшого числа страниц на сайте эффективность такого решения минимальна — намного лучше, когда посетитель сразу видит все доступные ссылки.
Итак, если у вас в проекте имеется сложная структура меню со множеством подразделов и страниц в них, то в целях экономии места вполне можно использовать раскрывающийся эффект. Рассмотрим его реализацию для WP с помощью CSS и JavaScript.
Блог Wordpress Inside поможет вам научиться работать в вордпресс, закрепить и расширить имеющиеся знания. Плагины и шаблоны, разные хаки и функции wp, оптимизация и безопасность системы – все это и намного больше вы сможете найти на страницах нашего проекта!
Если хотите быстро и оперативно получать последние новости и статьи, то рекомендуем подписаться на обновления блога:
- Автоматические Woocommerce уведомления по СМС, в Viber о новых заказах и др.
- Оптимизация и ускорение Elementor – как убрать лишние стили и шрифты
- Плагин WP01 расскажет как ускорить и оптимизировать сайт на WordPress
- Что нужно знать при создании онлайн-магазина на WordPress? – этапы, хостинг, обязательные плагины
- Как откатить Вордпресс и плагины на предыдущие версии (вручную или с WP Rollback)
- Хаки для вариаций товаров в WooCommerce
- 12 советов для ускорения WordPress сайта
- WooCommerce (41)
- Безопасность (11)
- Видео (6)
- Виджеты (27)
- Возможности (139)
- Вопрос-ответ (6)
- Начинающим (51)
- Новости (45)
- Оптимизация (23)
- Плагины (241)
- Сервисы (79)
- Хаки и секреты (86)
- Шаблоны (44)
- Плагин WP-PostRatings рейтинга постов в WordPress
(5,80 из 7, голосов - 924)
- Записи и посты wordpress, оформление записи
(5,89 из 7, голосов - 46)
- Оптимизируем WordPress header и удаляем лишний код
(5,22 из 7, голосов - 41)
- 5 wordpress плагинов для кнопок социальных закладок
(5,20 из 7, голосов - 41)
- Кэширование в wordpress — выбираем лучший плагин для кэширования
(5,59 из 7, голосов - 34)
- 50+ лучших плагинов для WordPress сайта
(5,94 из 7, голосов - 31)
- Лучшие плагины картинок в WordPress — галереи, слайдеры, для миниатюр и т.п.
(6,03 из 7, голосов - 29)
- Умный копирайт в footer.php для wordpress
(5,63 из 7, голосов - 30)
- Обновление плагинов и тем в WordPress: автоматическое, через FTP, скрытие уведомлений
(5,13 из 7, голосов - 30)
- 5 плагинов популярных постов в вордпресс
(5,07 из 7, голосов - 29)

- Дизайн Мания - о веб-дизайне и не только.
- Tod's Blog - все про заработок онлайн.
- Вебдванольные заметки - обзоры веб-сервисов.
- WordpressPlugins.ru
- Majordomo - выгодные цены на виртуальный хостинг
- Популярность официального сайта онлайн казино Азино
- Как открыть собственный интернет-бизнес
- Альтернатива Android Google Voice
- Плагин миниатюр похожих записей Related Posts with Thumbnail
- Transformer Pad TF502T – бюджетный вариант планшета TF701T от ASUS
- Обзор виртуального казино Риобет
- Что делать, если сайт не приносит прибыли?
- Vivo Xplay — шестидюймовый HD-фаблет