Илья Чигарев

Сделаю для вас сайт, который станет источником клиентов, дохода, продвижения

Обзор плагина WPBar от WPShop: Как сделать удобное мобильное меню для WordPress без программирования

WPbar Разработка сайта

Если вы когда-нибудь заходили на любимый сайт со смартфона и раздражались из-за того, что кнопку корзины или поиска нужно долго искать, вы не одиноки. Большинство посетителей сегодня заходят на сайты именно с телефонов. И если им неудобно, они просто уходят к конкурентам.

Чтобы решить эту проблему, известная команда разработчиков WPShop (создатели популярной темы Reboot и плагина Clearfy Pro) выпустила новый плагин — WPBar. Давайте разберемся, что это за инструмент, зачем он нужен вашему сайту и как им пользоваться, даже если вы совсем не разбираетесь в коде.

Обзор плагина ВПбар

Что такое WPBar и зачем он нужен?

WPBar — это плагин, который добавляет на ваш сайт аккуратную плавающую панель с иконками (меню). Чаще всего она закрепляется внизу экрана на мобильных телефонах. Вспомните приложение ВКонтакте или любой мобильный банк — там всегда есть нижняя панель с главными кнопками. WPBar делает точно такую же панель для вашего сайта на WordPress.

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

Кому и для каких сайтов подойдет WPBar?

Этот плагин универсален, но особенно полезен будет для трех типов сайтов:

  • Интернет-магазины (на базе WooCommerce): Это просто находка! Вы можете закрепить внизу экрана кнопку «Корзина», чтобы покупатель всегда видел, сколько товаров он уже выбрал, и мог оформить заказ в один клик.
  • Блоги и информационные сайты: Сделайте быстрый доступ к самым важным рубрикам, кнопке поиска по статьям или добавьте иконку «Вверх», чтобы читатель мог мгновенно вернуться к началу страницы.
  • Сайты-визитки и лендинги: Разместите на панели кнопки для быстрой связи — иконку телефона, Telegram или кнопку заказа обратного звонка.

Подробный разбор: что умеет плагин?

Разработчики постарались сделать интерфейс максимально простым для новичков. Все настраивается мышкой в админке WordPress.

1. Что можно добавить на панель?

Вы собираете свое меню как конструктор. В него можно добавить:

  • Обычные ссылки на любые страницы.
  • Полноценные меню (которые вы заранее создали в WordPress).
  • Кнопку поиска по сайту.
  • Специальные кнопки интернет-магазина (корзина, личный кабинет).
  • Любой свой текст или HTML-код.
Обычное состояние панели
Обычное состояние панели
Просмотр меню
Просмотр меню
Поиск прямо из плавающей панели на сайте
Поиск прямо из плавающей панели на сайте

Экскурсия по настройкам: как всё устроено внутри

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

ЕСЛИ ВАМ НУЖЕН САЙТ, ТО...

Я могу его сделать для вас. Меня зовут Илья - являюсь автором блога, занимаюсь разработкой сайтов на Wordpress более 10-ти лет. Специализируюсь на форматах: блог, лендинг, сайт-визитка, корпоративный сайт.

В портфолио найдете мои работы, а детали по разработке читайте по ссылке.

1. Вкладка «Элементы» (Ваш конструктор)

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

  • Добавление и сортировка: Вы можете легко менять элементы местами, просто перетягивая их мышкой (drag-and-drop).
  • Управление: Любую кнопку можно временно отключить (переключателем слева), скопировать или удалить.
  • Разнообразие кнопок: На скриншоте видно, что можно добавить самые разные типы кнопок: «Главная страница», «Поиск записей», кнопку «Поделиться», вызов полноценного меню или просто произвольную ссылку («Бонус»).
Элементы WPBar
Элементы WPBar

2. Вкладка «Внешний вид» (Дизайн в один клик)

Здесь вы наводите красоту. Для новичков это самая приятная часть, потому что в плагине уже есть 6 стильных готовых пресетов (шаблонов дизайна):

  • По умолчанию и Чистый светлый — классические аккуратные варианты.
  • Скруглённый тёмный и Ночная линия — стильные темные темы, которые отлично смотрятся на современных сайтах.
  • Линейные вкладки — компактный дизайн.
  • Apple Glass — красивый полупрозрачный стиль с эффектом размытия фона (блюром), как в современных смартфонах.

Если захочется больше индивидуальности, ниже есть раскрывающиеся списки («Панель», «Иконки», «Счётчик» и т.д.), где можно вручную поменять цвета, размеры и тени.

Настройка дизайна
Настройка дизайна

3. Вкладка «Настройки» (Поведение панели)

Здесь задаются правила того, как панель будет физически вести себя на экране устройства:

  • Ширина и скрытие: Можно задать максимальную ширину меню и указать, на каких экранах его нужно прятать. Например, по умолчанию стоит 768 px — это значит, что на больших мониторах компьютеров панель исчезнет, чтобы не мешать, а на телефонах останется.
  • Появление при прокрутке: Вы можете сделать так, чтобы меню появлялось не сразу, а только когда читатель проскроллит страницу вниз на определенное количество пикселей.
  • Умное скрытие: Очень крутая фишка — тумблер «Показывать только при прокрутке вверх». Если его включить, меню будет прятаться, пока человек увлеченно читает (листает вниз), и мгновенно появится, как только он чуть-чуть сдвинет экран вверх.
  • Отступ контента: Плагин сам следит за тем, чтобы плавающая панель не перекрывала важный текст или подвал вашего сайта на телефоне (режим «Авто»).
Настройки WPBar
Настройки WPBar

4. Вкладка «Правила показа» (Где выводить панель)

Максимально простая, но важная настройка. Вы выбираете область видимости меню. В базовом варианте можно выбрать «Весь сайт», и панель заработает на всех страницах. При желании здесь же можно настроить исключения (например, скрыть меню на странице оформления заказа, чтобы ничто не отвлекало покупателя).

Вы сами решаете, где именно на сайте появится меню:

Курс по созданию сайта

Новый курс 2025 года "Идеальный сайт на Wordpress 2.0"


Если вы давно мечтаете сделать свой сайт на WordPress, который будет приносить реальный доход и клиентов, то курс для вас.

Посмотреть детали

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

5. Вкладка «Предварительный просмотр» (Результат)

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

Предварительный просмотр виджета
Предварительный просмотр виджета

Идеальный помощник для интернет-магазина

Если у вас магазин на плагине WooCommerce, WPBar станет вашим лучшим другом. В нем есть специальные элементы именно для продаж:

  • Умная корзина: Иконка корзины не просто висит в меню, она показывает цифру — сколько товаров человек уже добавил.
  • Личный кабинет: Быстрый доступ к профилю покупателя.
  • Поиск по товарам: Человек может в любой момент нажать на лупу и найти нужную вещь. Это сильно сокращает путь от поиска товара до его покупки.
Пример корзины
Пример корзины

Главные технические плюсы плагина

  1. Фокус на мобильные устройства: По умолчанию панель настроена так, чтобы появляться только на экранах телефонов и планшетов (до 768 пикселей в ширину). Именно там она нужнее всего.
  2. Не тормозит сайт: Команда WPShop славится тем, что пишет очень «чистый» код. Плагин не создает лишней нагрузки на базу данных, меню загружается мгновенно и не портит показатели скорости сайта.
  3. Запуск за 3 шага: Чтобы всё заработало, нужно всего лишь: создать панель и добавить кнопки -> выбрать готовый дизайн -> нажать «Опубликовать».

Сколько стоит WPBar?

WPBar — это премиум-плагин, бесплатной версии у него нет. Однако продукты WPShop всегда отличаются адекватными ценами. Обычно компания предлагает лицензии на 1, 3 или неограниченное количество сайтов.

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

Цена плагина WPBar
Цена плагина WPBar

Плюсы и минусы плагина WPBar

Плюсы:

  • Очень простая настройка (справится новичок).
  • Готовые красивые дизайны.
  • Идеальная интеграция с интернет-магазинами на WooCommerce.
  • Сайт не начинает тормозить после установки плагина.
  • Отличная техподдержка на русском языке.

Минусы:

  • Плагин платный, поэтому протестировать его бесплатно не получится.
  • Из минусов все) Если найдете больше, пишите в комментариях.

Заключение

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

Для меня теперь это топ 2 обязательный плагин на всех сайтах после Clearfy Pro.

Добавляйтесь в мой телеграм. Там больше советов про сайты, заработок, фриланс. И можем лично пообщаться.

Заказать сайт
Поделитесь в соцсетях? Благодарю ✌
Илья Чигарев

Меня зовут Илья. Делаю сайты на заказ и веду блог, где рассказываю как зарабатывать на сайте от 100 тысяч в месяц. Посмотрите мою историю, чтобы познакомиться со мной. Подписывайтесь на все соцсети, чтобы не пропускать фишки и секреты по заработку и продвижению.

Добавить комментарий

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

Новый курс по созданию лендинга в Elementor

Уже уходите?

Чтобы не терять связь, подпишитесь на мой Телеграм. Там делюсь секретами, лайфхаками и сервисами для сайта и заработка в интернете.

Заберите бонусы бесплатно!

Страница откроется в новой вкладке