Skip to content

Всё для WordPress, веб-разработки — и не только

🚀 WPBakery Page Builder: руководство по созданию страниц с перетаскиванием

🚀 WPBakery Page Builder: руководство по созданию страниц с перетаскиванием

Кастомный макет страницы без единой строчки кода, звучит как мечта. Особенно когда тема WordPress «из коробки» не даёт нужной структуры, а верстать руками некогда. Конструкторы страниц решают эту проблему: ставишь плагин, перетаскиваешь блоки мышью и получаешь лендинг, портфолио или главную за час.

WPBakery Page Builder, один из старейших и самых распространённых конструкторов такого типа. По данным каталога CodeCanyon, у плагина более 2 миллионов активных пользователей и свыше 5 000 оценок. Он встроен в сотни премиум-тем на ThemeForest и до сих пор активно обновляется, актуальная версия 8.7.3 вышла в мае 2026.

💡 Быстрый обзор:

  • Установите WPBakery из каталога CodeCanyon или из комплекта вашей темы, активируйте и получите режим конструктора на любой странице
  • Соберите структуру: добавьте ряд, разбейте на колонки и наполните элементами, текст, кнопки, галереи, слайдеры
  • Отредактируйте визуально: перетащите блоки в нужном порядке, настройте отступы и фон через панель ряда
  • Сохраните макет как шаблон, используйте повторно на других страницах одним кликом

Что такое WPBakery Page Builder

WPBakery (ранее известный как Visual Composer), это плагин-конструктор страниц для WordPress, разработанный командой WP Bakery. Он продаётся на CodeCanyon и поставляется в составе множества популярных тем. Важный момент: не путайте его с отдельным продуктом Visual Composer на visualcomposer.com, это два разных плагина с похожими названиями.

Конструктор работает в двух режимах: бэкенд-редактор прямо в админке и фронтенд-редактор, где вы видите страницу как посетитель и меняете элементы на лету. Никакого кода, только перетаскивание и настройка через панели опций.

Установка и первые шаги

Плагин устанавливается стандартно: скачайте ZIP-архив из личного кабинета CodeCanyon или из комплекта вашей темы, загрузите через Плагины → Добавить новый → Загрузить плагин и активируйте. Лицензия Regular стоит $59 за один сайт с пожизненными обновлениями.

После активации на странице редактирования появляются новые кнопки: переход между классическим редактором и режимом конструктора, а также кнопка фронтенд-редактора.

Кнопки переключения режимов WPBakery в админке WordPress

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

Строим страницу: ряды, колонки и элементы

Ряды и колонки

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

Выбор макета колонок в редакторе WPBakery

Базовые раскладки, 1/2+1/2, 1/3+2/3, 1/4+3/4 и их зеркальные варианты. Комбинируя ряды с разными макетами, вы собираете полноценную сетку страницы без CSS.

Элементы страницы

Нажмите кнопку «Добавить элемент», откроется всплывающее меню со всеми доступными модулями. В стандартной поставке WPBakery: текстовые блоки, заголовки, кнопки, изображения, галереи, аккордеоны, вкладки, переключатели, блоки последних записей и виджеты сайдбара.

Всплывающее меню добавления элементов WPBakery

Количество элементов зависит от темы и активных плагинов. Многие премиум-темы добавляют собственные модули, адаптированные под их дизайн: карусели, разделители, поля иконок, вехи и таймлайны.

При выборе элемента открывается панель его настроек, иногда с несколькими вкладками. Ниже пример окна опций для модуля Icon Box (доступен в темах, которые его поддерживают):

Панель настроек модуля Icon Box в WPBakery

Конструктор из коробки поддерживает четыре популярных сторонних плагина: Layer Slider, Revolution Slider, Gravity Forms и Contact Form 7. Если любой из них установлен, для темы автоматически появляется элемент страницы. При вставке WPBakery показывает выпадающий список со слайдерами или формами, которые вы создали ранее. Копировать шорткоды вручную не нужно.

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

Интерфейс перетаскивания элементов в WPBakery

Любую строку или элемент можно перетащить в новое место в любой момент. Доступно дублирование строк и элементов, полезно для повторяющегося контента: одинаковых колонок, переключателей или FAQ-блоков.

Когда макет готов, сохраните его как шаблон: нажмите кнопку «Шаблоны», задайте имя и подтвердите. При создании новой страницы шаблон разворачивается со всеми сохранёнными элементами и настройками.

Параметры ряда

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

Иконки управления рядом в WPBakery, клонирование и настройка

Набор доступных опций форматирования зависит от темы. Часть разработчиков оставляют WPBakery как есть, другие расширяют панель под дизайн своей темы. Перед покупкой темы уточните, какие именно настройки конструктора в неё добавлены.

Фронтенд-редактор

WPBakery включает живой фронтенд-редактор: вы видите страницу глазами посетителя и правите текст, картинки и отступы прямо на месте. Клик по элементу, открывается панель настроек, а результат виден сразу.

Не все темы поддерживают фронтенд-редактор. Проверьте список функций темы или свяжитесь с разработчиком, чтобы узнать о совместимости. Темы, созданные с расчётом на WPBakery, обычно включают полную поддержку обоих режимов, и бэкенда, и фронтенда.

Расширения и шорткоды

Официальный сайт WPBakery Page Builder

WPBakery поддерживает интеграцию сторонних шорткодов. На странице настроек плагина перейдите на вкладку «Мои шорткоды» и нажмите «Сопоставить шорткоды». Система подтянет все зарегистрированные шорткоды с сайта и добавит их в меню элементов конструктора.

Если вы разработчик, API плагина позволяет добавить собственные модули в интерфейс конструктора. Для обычных пользователей на CodeCanyon есть десятки аддонов, расширяющих стандартный набор элементов: сетки постов, карточки товаров, продвинутые галереи и слайдеры.

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

WPBakery работает не только со страницами, но и с записями и произвольными типами контента. Перейдите в Настройки → WPBakery Page Builder и отметьте галочками типы контента, где нужен конструктор.

Страница настроек WPBakery с выбором типов контента

Плагин автоматически отображает все типы контента, зарегистрированные в теме: страницы, записи, портфолио, отзывы, продукты WooCommerce, форумы bbPress. Отметьте нужные и сохраните.

Где взять WPBakery

WPBakery Page Builder продаётся на CodeCanyon за $59, лицензия Regular для одного сайта с пожизненными обновлениями. Расширенная лицензия для включения в тему или плагин стоит дороже.

Многие премиум-темы включают WPBakery в стоимость, при покупке вы получаете лицензию на конструктор без отдельной оплаты. Если выбираете тему для нового проекта, наличие встроенного WPBakery экономит $59 и часы на проверку совместимости.

Пример страницы, собранной в WPBakery Page Builder

⁉️🤔 Частые вопросы

Visual Composer и WPBakery, это одно и то же?

Да. В 2017 году плагин Visual Composer сменил название на WPBakery Page Builder, чтобы избежать путаницы с продуктом Visual Composer Website Builder (visualcomposer.com). Код и функциональность остались те же, изменилось только название.

Нужно ли уметь программировать?

Нет. Конструктор рассчитан на полное отсутствие кода. Вы собираете страницу из готовых блоков через drag-and-drop. Понадобятся только базовые навыки работы с админкой WordPress: установить плагин, создать страницу, нажать «Сохранить».

Работает ли WPBakery с любой темой?

С большинством, да. Но глубина интеграции разная. Одни темы просто не мешают конструктору, другие добавляют собственные модули, стили и сетки. Перед покупкой темы проверьте в описании строку «Compatible with WPBakery Page Builder».

Можно ли использовать WPBakery на нескольких сайтах?

Стандартная лицензия Regular, $59 для одного проекта. Для двух и более проектов покупайте отдельные лицензии или рассмотрите расширенную, если планируете включать плагин в состав своего продукта.

Чем WPBakery отличается от Elementor?

Elementor, более новый конструктор с обширной бесплатной версией и современным интерфейсом. WPBakery, проверенный ветеран, глубоко интегрированный в экосистему ThemeForest: сотни тем поставляются именно с ним. Выбор между ними, вопрос предпочтений по интерфейсу и конкретной темы.

Стоит ли брать WPBakery в 2026

Если ваша тема уже включает WPBakery, пользуйтесь, это зрелый инструмент с регулярными обновлениями и огромной базой аддонов. Если выбираете тему с нуля, смотрите на конструктор, который вам удобнее в повседневной работе, а не на громкие сравнения. И WPBakery, и Elementor способны собрать профессиональный сайт. Решающий фактор, в каком интерфейсе вам комфортнее работать, потому что страницы вы будете править именно вы.