Найти в Дзене
WPShop

Меню сайта WordPress нового уровня — обзор WPBar

Навигация — ключевой элемент любой веб-страницы, который определяет, насколько удобно пользователю ориентироваться в содержимом сайта. Для платформы WordPress есть множество способов организовать меню, но далеко не все из них одинаково удобны, особенно на мобильных устройствах. Решить эту проблему помогает плагин WPBar от WPShop — расширение для реализации плавающего меню с иконками, которое улучшает взаимодействие пользователя с сайтом. WPBar — это плагин для WordPress, который добавляет на сайт плавающую панель навигации. Такое меню остаётся в зоне видимости пользователя во время прокрутки страницы, обеспечивая быстрый доступ к ключевым разделам ресурса. Дополнительно предусмотрены гибкие параметры отображения: панель можно показывать только после прокрутки страницы на заданное количество пикселей или выводить её исключительно при прокрутке вверх. Эти настройки позволяют адаптировать поведение меню под особенности сайта и сценарии взаимодействия посетителей. Плагин подходит для сайто
Оглавление

Навигация — ключевой элемент любой веб-страницы, который определяет, насколько удобно пользователю ориентироваться в содержимом сайта. Для платформы WordPress есть множество способов организовать меню, но далеко не все из них одинаково удобны, особенно на мобильных устройствах. Решить эту проблему помогает плагин WPBar от WPShop — расширение для реализации плавающего меню с иконками, которое улучшает взаимодействие пользователя с сайтом.

Новый плагин плавающего меню WPBar
Новый плагин плавающего меню WPBar

Что представляет собой WPBar

WPBar — это плагин для WordPress, который добавляет на сайт плавающую панель навигации. Такое меню остаётся в зоне видимости пользователя во время прокрутки страницы, обеспечивая быстрый доступ к ключевым разделам ресурса.

Дополнительно предусмотрены гибкие параметры отображения: панель можно показывать только после прокрутки страницы на заданное количество пикселей или выводить её исключительно при прокрутке вверх. Эти настройки позволяют адаптировать поведение меню под особенности сайта и сценарии взаимодействия посетителей.

Плагин подходит для сайтов услуг, блогов и корпоративных проектов, а также для интернет-магазинов на базе WooCommerce.

Основные возможности:

  • вывод плавающего меню с иконками;
  • поддержка любых стандартных меню WordPress;
  • вывод категорий и рубрик — удобно для блогов и интернет-магазинов.
  • наличие готовых пресетов оформления плавающей панели.
  • полная адаптивность для мобильных и десктопных устройств.
  • возможность отключения отображения панели на десктопах.
  • расширенные возможности кастомизации внешнего вида.

Принцип работы

WPBar выводит на сайте горизонтальную панель навигации — она прикрепляется к краю экрана и остается видимой при прокрутке страницы. Благодаря этому посетитель всегда может перейти к нужному разделу, не возвращаясь в верхнюю часть сайта.

Такое плавающее меню сайта WordPress особенно полезно на длинных страницах блогов, каталогов товаров или при большом количестве разделов — оно упрощает ориентацию и способствует повышению вовлеченности.

Демонстрация настроек WPBar

Элементы панели

Работа с панелью начинается с управления её элементами. В редакторе можно добавлять новые кнопки, удалять ненужные, менять их порядок и редактировать содержимое. Для каждого элемента настраиваются ссылка, иконка и подпись.

Также предусмотрена возможность регулировать размер элементов — их можно сделать больше или компактнее в зависимости от приоритетов навигации. Это позволяет акцентировать внимание пользователя на ключевых разделах сайта и выстроить удобную структуру меню.

Первый блок настроек
Первый блок настроек

Внешний вид панели

Следующий блок — оформление. Здесь доступны готовые пресеты, которые позволяют быстро задать общий стиль панели, а также расширенные параметры кастомизации.

Второй блок настроек, пресеты плагина
Второй блок настроек, пресеты плагина

Можно изменить внутренние и внешние отступы, цвет фона, добавить или настроить тень, задать радиус скругления углов и другие визуальные характеристики. Отдельно настраивается внешний вид самих элементов — их цвет, отступы и общее поведение в интерфейсе.

Второй блок настроек, настройка отступов панели
Второй блок настроек, настройка отступов панели

Для интернет-магазинов на WooCommerce предусмотрена дополнительная кастомизация счётчика корзины. Его можно стилизовать так, чтобы он гармонично вписывался в дизайн сайта и при этом оставался заметным для пользователя.

Второй блок настроек, счетчик для карзины
Второй блок настроек, счетчик для карзины

В этом же разделе доступно поле для добавления собственных CSS-стилей. Оно работает как встроенный редактор: достаточно прописывать правила, начиная с селектора, чтобы детально управлять отображением панели и реализовывать индивидуальные дизайнерские решения.

Второй блок настроек, дополнительные стили
Второй блок настроек, дополнительные стили

Особенно удобно, что все изменения можно сразу увидеть в предпросмотре панели, который отображается справа. Любые правки стиля, размера элементов или иконок отображаются в реальном времени, что позволяет быстро оценить результат и скорректировать оформление до публикации.

Предпросмотр плавающего меню
Предпросмотр плавающего меню

Настройки панели

Блок настроек отвечает за поведение панели на сайте. Здесь можно задать максимальную ширину, определить, скрывать ли панель на экранах шире определённого значения, а также настроить её появление после прокрутки страницы на указанное количество пикселей.

Дополнительно доступен тумблер «Показывать только при прокрутке вверх», который позволяет сделать отображение менее навязчивым. Отдельно регулируется поведение отступа контента, чтобы панель корректно взаимодействовала со структурой страницы.

Третий блок настроек, общие настройки
Третий блок настроек, общие настройки

Правила показа меню

Завершающий блок — это правила отображения панели. В нём определяется, где именно будет выводиться меню. Можно выбрать показ на всех страницах блога, только на главной, на одиночных записях или на страницах товаров WooCommerce.

Также доступен выбор конкретных страниц, рубрик блога и категорий WooCommerce. Благодаря этому панель можно использовать как универсально по всему сайту, так и точечно — в нужных разделах проекта.

Четвертый блок настроек, правила показа
Четвертый блок настроек, правила показа

Практическая ценность WPBar

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

Плавающее меню в блоге
Плавающее меню в блоге

Для интернет-магазинов WPBar предоставляет удобное управление корзиной и профилем пользователя, а кастомизация счётчика товаров позволяет сделать интерфейс более наглядным и удобным для покупателей.

-11

Кроме того, разработчики планируют добавить возможность вывода содержания статей прямо в меню, что откроет новые сценарии использования для блогов и информационных ресурсов. Это обещает быть особенно интересным для сайтов с длинными публикациями или большим количеством рубрик, где удобная навигация критически важна.

Итог

WPBar — гибкий плагин для создания плавающего меню WordPress с полной кастомизацией и удобным управлением элементами. Он подходит для различных типов сайтов, упрощая навигацию и повышая удобство использования.

Благодаря настройкам внешнего вида и поведения панели, WPBar делает меню функциональным, стильным и адаптированным под любые устройства.

Если вы ещё не пробовали этот плагин, протестируйте WPBar сами и оцените, как легко можно создать удобное и привлекательное меню для вашего сайта.