Лучшие плагины конструкторы страниц для WordPress. WordPress Конструктор страниц WordPress, не имеющего никаких ограничений RoyalSlider - сенсорный слайдер для WordPress

Пытаетесь решить, какой конструктор страниц лучше для вашего сайта?

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

Я собираюсь объективно сравнить эти восемь конструкторов в пяти категориях:

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

Вот восемь конструкторов которые мы рассмотрим.

  • Elementor
  • Beaver Builder
  • Divi Builder
  • Thrive Architect
  • SiteOrigin Page Builder
  • WPBakery Page Builder(он же Visual Composer)
  • Themify Builder
  • Brizy

А в конце будет сравнительная таблица.

1. Elementor

Первоначально запущенный в 2016 году, Elementor является одним из самых молодых конструкторов страниц в этом списке. Но даже при позднем старте Elementor быстро собрал более 800 000 активных установок на WordPress.org, что делает его одним из самых популярных.

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

Цена: Есть бесплатная версия. Версия Elementor Pro начинается с $ 49 за использование на одном сайте.

Интерфейс — 5/5

Интерфейс Elementor разделен на две основные части, с третьей областью для некоторых более мелких настроек:

  • 1 — это предварительный просмотр вашего проекта. Это практически то, как ваши посетители увидят это. Вы также можете вводить текст непосредственно в этом интерфейсе, а также перетаскивать различные элементы, чтобы переупорядочить их.
  • 2 — это показывает список элементов, которые вы можете использовать. Вы просто перетаскиваете их. И когда вы выбираете отдельный элемент или раздел, здесь вы будете его стилизовать.
  • 3 — это поможет вам получить доступ к превью страницы, отмены/повтора изменений и другим более мелким функциям.

Например, рассмотрим, как вы можете перетащить текстовый виджет, а затем просто начните вводить текст на странице (встроенное редактирование), чтобы его изменить:

В бесплатной версии Elementor включает 28 бесплатных виджетов. И вы также можете использовать все основные виджеты WordPress. Версия Pro добавляет еще ~ 30 виджетов, что дает вам в общей сложности 58 виджетов в версии Pro:

Бесплатная версия также поставляется с ~ 40 бесплатными шаблонами. И версия Pro добавляет сотни дополнительных шаблонов.

Шаблоны бывают двух форматов:

  • Страницы — полностраничные проекты, которые вам просто нужно редактировать.
  • Блоки — отдельные разделы, которые вы можете собрать вместе, как Lego.

Так же, уже появляются отдельные библиотеки с сторонними виджетами и шаблонами для Elementor.

Варианты стилизации — 5/5

Когда вы нажимаете на любой раздел, столбец или виджет, Elementor предлагает три вкладки стиля в левой боковой панели.

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

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

  • Пользовательские поля/отступы.
  • Пользовательские классы/идентификаторы CSS. С Elementor Pro вы можете напрямую добавлять стили CSS в отдельные элементы.
  • Контроль адаптивности. Вы можете отображать / скрывать элементы на определенных устройствах.

Эти функции доступны в Elementor Pro:

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

Деактивация плагина — 5/5

Если вы дезактивируете Elementor, он оставляет чистый код. Например, если у вас есть заголовок

с Elementor, у вас все равно будет заголовок

после деактивации Elementor. Он просто будет использовать стиль вашей темы.

2. Beaver Builder

Beaver Builder довольно долгое время был на рынке конструкторов страниц. Он выводит чистый код(для конструктора страниц), популярен как для конечных пользователей, так и для разработчиков, и получает регулярное внимание за счет новых функций и обновлений.

Также есть некоторые официальные дополнения, с которыми вы можете добиться большей гибкости — в частности, дополнительная тема Beaver Builder и расширение Beaver Themer.

Цена: Ограниченная бесплатная версия. Начинается с $ 99 за использование на ограниченных сайтах.

Интерфейс — 5/5

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

  • 1 — кнопка, чтобы открыть область боковой панели
  • 2 — это предварительный просмотр вашего проекта

Честно говоря, использование встроенного редактирования со всплывающим меню немного неудобно. Но вы можете легко привязать редактор к боковой панели, чтобы исправить это.

В бесплатной версии Beaver Builder дает вам доступ только к 6 модулям, хотя вы также можете использовать стандартные виджеты WordPress.

Премиум-версия, с другой стороны, дает вам доступ к 30 модулям. Они также являются модульными, поэтому вы можете включать или отключать их по мере необходимости.

В премиум-версии вы также получаете доступ к ~ 56 страницам шаблонов, а также возможность сохранять свои собственные проекты в качестве шаблонов.

Варианты стилизации — 5/5

Чтобы создать свои модули и разделы, вы можете:

  • Использовать всплывающее окно по умолчанию
  • Вставьте окно в сторону, чтобы создать боковую панель (это можно увидеть в примере ниже).

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

И Beaver Builder также предлагает очень уникальный переключатель, который позволяет показывать или скрывать отдельные модули на основе того, авторизировался ли пользователь в системе:

  • Beaver Themer. Хотя это отдельное расширение, оно добавляет полную функциональность построения темы, как в Elementor.
  • White labeling. Вы можете легко переименовать Beaver Builder, если вы создаете сайты для клиентов.
  • Beaver Builder theme. Эта дополнительная тема дает вам еще больший контроль над тем, как выглядит ваш сайт.

Хотя уникальные функции хороши, я считаю, что цена за них высокая.

Деактивация плагина — 5/5

Как и Elementor, Beaver Builder оставляет 100% чистый код с правильным форматированием HTML.

3. Divi Builder

Divi Builder — популярный конструктор от разработчика премиальных тем Elegant Themes. Хотя он чаще всего используется как часть темы Divi, Divi Builder также является автономным плагином, который вы можете использовать и с другими темами.

В отличие от предыдущих двух конструкторов страниц, Divi Builder позволяет редактировать ваш контент, используя как внешний интерфейс, так и интерфейс административной панели, хотя большинство пользователей, вероятно, предпочтут визуальный интерфейс.

Цена: Доступен в рамках членства в Elegant Themes за $ 89

Интерфейс — 4/5

Внутренний(backend) интерфейс Divi Builder выглядит так:

Но большую часть времени вы будете использовать внешний интерфейс интерфейса. Divi Builder определенно уникален. Я лично не фанат, но я знаю много людей, которые любят его.

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

Как и в предыдущих двух конструкторов страниц, вы также можете использовать встроенное редактирование текста прямо на странице:

Включенные виджеты/шаблоны — 5/5

Divi Builder включает в себя 46 модулей, которые вы можете использовать для создания ваших проектов:

Вы также получаете доступ к массивным 316 заранее построенным шаблонам, разбитым по 40 различным макетам, а также есть возможность сохранять свои собственные проекты в качестве шаблонов:

Варианты стилизации — 5/5

Как и Beaver Builder, Divi Builder позволяет вам стилизовать элементы из всплывающего окна, которое можно, при желании, вывести в сторону.

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

Вы даже можете добавить пользовательский CSS к основному элементу или до/после основного элемента. Редакторы CSS даже включают базовую проверку и автозаполнение! И вы также можете открыть подборщик цветов прямо из редактора:

В целом, Divi Builder действительно продвигает границы с помощью своих вариантов стилизации — это хорошие функции.

Другие примечательные особенности — 5/5

  • A/B тестирование. Одной из лучших дополнительных функций является встроенная система A/B тестирования от Divi Builder. Ни один другой разработчик страниц не позволяет так легко разделить тест в ядре.
  • Тема Divi. Сопряжение Divi Builder с темой Divi дает вам полный контроль над внешним видом вашего сайта.
  • Элементы управления доступом пользователей. Divi Builder включает в себя мощные средства контроля доступа на основе ролей.
  • Элементы управления WordPress. Вы можете настроить, как некоторые элементы выглядят, используя собственный WordPress Customizer.

Деактивация плагина — 3/5

Одна из критических замечаний Divi Builder всегда заключалась в том, что он основан на шорткодах. Это означает, что если вы когда-нибудь отключите его, он оставит позади кучу коротких кодов в вашем контенте.

В то время как это немного сбивает, это сейчас не проблема, когда существуют плагины, такие как Shortcode Cleaner. Вы потеряете форматирование — токое как тег

, но вы не потеряете сам контент.

4. Thrive Architect

Конструктор страниц Thrive Architect — обновленная версия того, что было когда-то Thrive Content Builder. Новый интерфейс имеет много общего с интерфейсом Elementor, который вы увидите через секунду.

Хотя любой может использовать его, он особенно популярен среди блоггеров и маркетологов из-за его концентрации на коэффициентах конверсии. И одна из вещей, которые мне лично нравятся в Thrive Architect, заключается в том, что ее стиль по умолчанию выглядит довольно неплохо прямо из коробки.

Цена: от 67 $

Интерфейс — 5/5

Как я уже сказал, вы увидите некоторые общие черты между интерфейсом Thrive Architect и интерфейсом Elementor (Elementor пришел первым, на случай, если вам интересно):

Это то же, вы видели выше:

  • 1 — это предварительный просмотр вашего проекта. Это похоже на то, что ваши посетители увидят. Вы также можете вводить текст непосредственно в этом интерфейсе, а также перетаскивать различные элементы, чтобы переупорядочить их.
  • 2 — это показывает список элементов, которые вы можете использовать. Вы просто перетаскиваете их. И когда вы выбираете отдельный элемент или раздел, здесь вы будете его стилизировать.
  • 3 — это поможет вам получить доступ к превью, изменениям отмены/повтора и другим более мелким функциям.

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

И Thrive Architect также предлагает истинное встроенное редактирование текста. На самом деле, Thrive Architect имеет самые удобные встроенные функции редактирования по сравнению с другими конструкторами страниц, на мой взгляд:

Включенные виджеты/шаблоны — 4/5

Thrive Architect предлагает 40 различных виджетов, в том числе некоторые аккуратные, такие как вечный таймер обратного отсчета.

Thrive Architect также включает сотни шаблонов, разделенных на ~ 36 «наборов». И вы также можете сохранить свои собственные образцы в качестве шаблона.

Варианты стилизации — 5/5

Thrive Architect отличается от Elementor в том, как он управляет стилем. Вместо того, чтобы давать вам вкладки, Thrive Architect включает все в одном столбце.

Параметры стиля довольно детализированы и включают в себя гибкие элементы управления и пользовательске отступы:

Вы также можете добавить свой собственный CSS на уровне страницы. Для отдельных элементов вы можете назначать только классы CSS или идентификаторы.

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

И еще одна интересная вещь — насколько хорошо он интегрируется с другими продуктами Thrive Themes. Например:

  • Если вы используете Thrive Optimize, вы можете запускать тесты A / B с помощью Thrive Architect.
  • Если вы используете Thrive Leads, вы можете легко интегрировать подробные настройки в Thrive Architect.

Деактивация плагина — 5/5

Thrive Architect оставляет 100% чистый код, как например Elementor и Beaver Builder.

5. SiteOrigin Page Builder

Конструктор страниц SiteOrigin Page Builder кажется что существовал всегда. И в этом «всегда» ему удалось собрать более 1 миллиона активных инсталляций на WordPress.org, что делает его самым популярным плагином для компоновки страниц, указанным в этом обзоре.

Хотя SiteOrigin Page Builder является немного более легким, чем большинство других конструкторов в этом списке, он предлагает отличную производительность и массу полезных элементов управления CSS.

Цена: Бесплатно. Пакет SiteOrigin Premium начинается с 29 $

Интерфейс — 3/5

SiteOrigin имеет два интерфейса, которые вы можете использовать для создания своего дизайна.

У вас есть оригинальный редактор бэкэнд:

Вы можете перетаскивать блоки вокруг или щелкнуть по определенному блоку, чтобы отредактировать его.

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

Если вам нужен предварительный просмотр в прямом эфире, SiteOrigin Page Builder добавил режим live-редактора:

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

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

Включенные виджеты/шаблоны — 2/5

Помимо основных виджетов WordPress, SiteOrigin Page Builder также предлагает бесплатный плагин Widgets Bundle, который добавляет модульный набор из 23 виджетов, которые вы можете использовать. Он также включает ~ 25 предварительно построенных шаблонов, которые вы можете использовать, хотя это довольно скудно по сравнению с другими конструкторами страниц.

Варианты стилизации — 3/5

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

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

Вы также получаете множество опций стиля, отличных от CSS, — но не так много, как в других плагинах. Если вы разработчик, планирующий использовать свой собственный CSS, вы, вероятно, можете поставить плагину 5 для этой категории. Но я сбиваю его до 3, потому что я думаю, что он не подходит для обычных пользователей.

Другие примечательные особенности — 2/5

SiteOrgin Page Builder довольно легкий, но вы получаете базовый конструктор постов в пакете SiteOrigin Premium.

Деактивация плагина — 4/5

SiteOrigin Page Builder оставляет за собой сочетание чистого HTML и коротких кодов. То есть некоторые из виджетов, как текстовый редактор, оставляют чистый HTML-код, в то время как другие — как виджет кнопки — оставляют короткие коды.

6. WPBakery Page Builder(Visual Composer)

WPBakery Page Builder, ранее известный как Visual Composer, является еще одним массово популярным конструктором премиум-страниц. Большая часть этой популярности исходит из того факта, что WPBakery Page Builder связан с 99% тем в ThemeForest. Но факт остается фактом: он используется на огромном количестве сайтов.

Интерфейс — 3/5

Как и Divi Builder, WPBakery Page Builder дает вам как визуальное редактирование, так и редактирование в административной пенели.

Вы можете использовать интерфейс административной панели, если хотите:

Но я думаю, что большинство людей будут счастливее на лицевой стороне, которая выглядит так:

Вы вставляете новые элементы и стилизуете их с помощью всплывающих окон — нет области боковой панели и нет встроенного редактирования.

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

WPBakery Page Builder предлагает 39 элементов, а также всех обычных виджетов WordPress. Некоторые из этих элементов будут объединены в другом конструкторе страниц, однако, поэтому фактическое число больше похоже на ~ 33:

Вы также получаете ~ 86 шаблонов. Некоторые шаблоны представляют собой полные страницы, а другие — просто разделы.

Варианты стилизации — 3/5

По сравнению с чем-то вроде Elementor или Divi Builder параметры стиля WPBakery Page Builder немного ограничены.

У вас есть хороший контроль над строками:

Но варианты стилизации отдельных элементов ограничены.

Если вы хотите использовать свой собственный CSS, вы можете добавить собственный класс или идентификатор CSS к отдельным элементам или добавить фактические стили на уровне страницы:

Другие примечательные особенности — 3/5

Я не уверен, что WPBakery Page Builder обладает особенно заметными уникальными функциями. Но то, что у него есть, — это массовое сообщество сторонних разработчиков. В то время как многие другие разработчики страниц имеют сторонние надстройки, WPBakery Page Builder уникален в количестве, которое содержит более 250+ надстроек.

Деактивация плагина — 3/5

Как и Divi Builder, WPBakery Page Builder оставляет за собой недостаток шорткодов в вашем контенте, если вы его деактивируете.

7. Theimify Builder

Themify Builder — это, что неудивительно, предложение компании Themify. Theimify связывает его со многими своими темами, чтобы предоставить клиентам легкие настройки. Но вы также можете приобрести его как отдельный плагин и использовать его с любой темой.

Цена: Бесплатная lite версия. Pro начинается с $ 39 или $ 59 (в зависимости от надстроек)

Интерфейс — 3/5

Подобно Divi Builder и WPBakery Page Builder, Themify Builder позволяет создавать ваши проекты с использованием интерфейсов как на внутреннем(бэкэнд), так и на визуальном(фронтэнд) интерфейсах.

Интерфейс бэкэнд выглядит следующим образом:

Но опять же, большинство людей, вероятно, захотят использовать визуальный интерфейс, который работает так:

  • 1 — позволяет вставлять новые модули (2 разных способа)
  • 2 — просмотр в прямом эфире
  • 3 — адаптивный просмотр, отмена/повтор и другие настройки

Нет встроенного редактирования — вам нужно будет отредактировать текст во всплывающем окне:

Включенные виджеты / шаблоны — 3/5

Themify Builder предлагает 21 модуль, а также все обычные виджеты WordPress.

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

Варианты стилизации — 4/5

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

  • Content(Содержание)
  • Styling(Стилизирование)(показано ниже)
  • Visibility(Видимость — позволяет скрыть элемент на определенных устройствах)
  • Animation(Анимация)

Еще одна приятная вещь заключается в том, что Themify Builder позволяет настраивать ваши отзывчивые точки остановки.

Другие примечательные особенности — 3/5

Одна интересная вещь в Themify Builder заключается в том, что она по-прежнему позволяет использовать обычный редактор WordPress, тогда как другие разработчики страниц заставляют вас использовать интерфейс конструктора страниц для всего. Содержимое Themify Builder помечено в редакторе WordPress, чтобы вы могли размещать контент вокруг него:

Деактивация плагина — 5/5

Theimify Builder значительно улучшился в отношении блокировки. Теперь, если вы деактивируете его, он оставляет ваш контент позади с чистым HTML.

8. Brizy

Запущенный в апреле 2018 года, Brizy на сегодняшний день является «самым молодым» конструктором страниц в этом списке. Но он исходит от известного разработчика — ThemeFuse — и быстро собрал 9 000 активных установок. Кроме того, он просто предлагает уникальный подход к некоторым частям построения страниц, что делает его интересным предложением.

Интерфейс — 5/5

Brizy — исключительно визуальный конструктор страниц.

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

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

Посмотрите, что я имею в виду:

Результатом является очень быстрый способ создания страниц.

Включенные виджеты/шаблоны — 3/5

Сейчас Brizy предлагает 17 элементов. Это число мало, но Brizy все еще нова, поэтому, надеюсь, он со временем увеличивается.

Он также включает более 150 блоков(шаблонов), которые вы можете использовать.

Варианты стилизации — 5/5

Из-за того, как работает интерфейс Brizy, нет установленной формулы для изменения параметров стиля, таких как у других конструкторов страниц.

Вы можете расширить боковую панель для расширенных настроек, таких как интервалы и настраиваемые элементы управления:

Вы также можете добавить базовый стиль на уровне страницы, чтобы вам не пришлось вручную редактировать каждый отдельный элемент:

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

Другие примечательные характеристики — 4/5

Интерфейс Brizy уже довольно уникален. Но команда работает над версией Brizy Pro, которая добавит:

  • Дизайн шапки с использованием того же интерфейса Brizy
  • Глобальные баннеры, которые синхронизируются на нескольких страницах
  • А/В тестирование страниц

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

Деактивация плагина — 4/5

Brizy оставляет позади в основном чистый HTML-код, если вы его деактивируете. Но он по-прежнему оставляет кучу divs с Brizy CSS-классами в коде, что немного расстраивает отступы и требует очистки.

Какой конструктор страниц для WordPress лучше?

Итак, какой из этих восьми разработчиков страниц вы должны выбрать? Ну, вот как складываются счета (по порядку):

Конструктор страниц Итог (25 Максимум) Интерфейс Виджеты/Шаблоны Стилизация Доп. функции

Деактивация плагина

Elementor 25 5 5 5 5 5
Beaver Builder 23 5 4 5 4 5
Divi Builder 22 4 5 5 5 3
Thrive Architect 22 5 4 5 3 5
Brizy 21 5 3 5 4 4
Themify Builder 18 3 3 4 3 5
WPBakery Page Builder 15 3 3 3 3 3
SiteOrigin Page Builder 14 3 2 3 2 4

Если вы ищете лучшее решения цена/функции, вот еще одна таблица, сравнивающая оценку с параметрами ценообразования:

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

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

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

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

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

Современные конструкторы дают возможность не только использовать в контенте новые элементы, но также и значительно изменять структуру и вёрстку.

Некоторые современные темы, в основном, только платные, имеют в своём составе функции конструктора. Ниже мы расскажем про лучшие плагины конструкторы страниц для WordPress, которые дают эти возможности бесплатно или условно-бесплатно.

Кстати, осиновая цель использования таких конструкторов - это создание лендингов. В них есть всё, что для этого нужно.

Elementor

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

После установки и активации плагина в стандартном редакторе WordPress появляется кнопка “Редактировать в Elemetor”. После её нажатия открывается редактор со множеством элементов:

  • колонки;
  • текстовые блоки;
  • изображения;
  • видео;
  • кнопки;
  • иконки;
  • списки;
  • виджеты из WordPress;
  • и многое другое.

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

Этот плагин от разработчиков из Elementor.com условно-бесплатный. Функций из бесплатной версии хватит для большинства пользователей. За дополнительные возможности придётся заплатить. Интерфейс на русском языке.

Page Builder

Лучшие плагины конструкторы страниц для WordPress продолжает продукт от SiteOrigin, который называется очень просто – Page Builder, то есть конструктор страниц. Плагин не хуже, чем Elemetor, и немного попроще.

После активации плагина в редакторе появляется дополнительная вкладка “Page builder”. При переходе в неё открывается полноценный конструктор. В редакторе можно размещать виджеты самого плагина и WordPress. Также можно опубликовать и другие виджеты, которые установлены на сайте. Можно изменять вёрстку страницы и задавать количество колонок.

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

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

KingComposer

Лучшие плагины конструкторы страниц для WordPress не смогут обойтись без королевского экземпляра KingComposer от King-Theme – разработчиков популярных премиум-тем. Плагин бесплатный.

После установки и активации в редакторе появляется новая кнопка “Edit width King Composer”. После нажатия на неё откроется полноценный конструктор страниц. Можно добавлять необходимое количество колонок, и в каждую колонку помещать элементы. Элементы для публикации разделены на группы:

  • блог;
  • контент;
  • медиа;
  • социальные сети;
  • виджеты.

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

Плагин полностью бесплатный, но пока русского интерфейса у него нет. Придётся ограничиться английским.

Free Landing Pages Builder by Wishpond

Плагин разработанный Wishpond, который, как понятно по названию, представляет собой конструктор страниц для создания лендингов. Продукт условно-бесплатный.

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

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

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

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

Сегодня мы хотим представить вам подборку из 10 лучших WordPress-плагинов для создания посадочных страниц, которые помогут вам раскрутить собственный бизнес и увеличить доход. Ознакомьтесь с подборкой, и расскажите нам, что вы думаете по поводу представленных плагинов! Наслаждайтесь!

1. Landing Pages

Этот плагин позволяет создавать посадочные страницы (или страницы-заглушки ) для сайта на CMS WordPress . Он предоставляет владельцам сайтов возможность отслеживать показатели конверсии, проводить сплит-тестирование. При разработке плагина особое внимание уделялось внутренней оптимизации сайтов, за счет чего он поможет вам увеличить количество лидов и конвертировать их в постоянных клиентов!

2. Ultimate Landing Page

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

3. Ultimate Coming Soon Page

Ultimate Coming Soon Page поможет быстро и просто настроить страницу с оповещением о скором открытии или запуске вашего проекта. Плагин Ultimate Coming Soon Page будет работать с любой темой оформления WordPress .

4. Beaver Builder

Beaver Builder – это drag and drop конструктор страниц, который работает через интерфейс WordPress и позволяет создавать красивые шаблоны и посадочные страницы без необходимости писать какой-либо код.

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

5. Coming Soon Page

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

6. Landing Pages Builder

Создавайте посадочные страницы, проводите A/B-тестирование и многое другое. Привлекайте новых лидов, повышайте уровень конверсии и управляйте вашими посадочными страницами при помощи единого интерфейса. Теперь вы можете запускать рекламные объявления с функцией автоматической оптимизации для получения лучшего результата.

7. Bulk City Landing Page Creator

Плагин создает несколько страниц на WordPress , в заголовках и содержимом которых будет упоминаться заданный вами город. Плагин умеет работать с родительскими страницами, шаблонами, а также с заголовками и контентом страниц. Количество создаваемых страниц напрямую зависит от количества строк в тексте с указанием города и штата (пример строки: Athens,GA ).

8. Site Offline or Coming Soon

Вы можете использовать этот плагин для включения/выключения режима «оффлайн » на сайте. Если включить режим «оффлайн », то обычные посетители с помощью страницы-заглушки будут оповещены о ведущихся на сайте технических работах, в то время как администраторы смогут видеть полную версию сайта. Удобный плагин для тех, кому нужно оповестить пользователей о скором запуске проекта.

9. Coming Soon Page

Coming Soon Page – отличный способ дать понять, что ваш проект скоро начнет свою работу. Когда плагин Coming Soon Page активирован, он позволяет вам собирать email-адреса заинтересованных посетителей. Кроме того, следует отметить, что этот плагин не привязан к определенной теме оформления, и поэтому будет прекрасно работать с любым установленным шаблоном.

10. Maintenance Page

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

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

Дизайн сайта влияет на продвижение сайта по трём направлениям:

  • Адаптивность, кроссбраузерность и кроссплатформенность. Если сайт отображается на каком-либо устройстве, операционной системе или браузере как-то некорректно, не полноценно, то это плохо скажется на его ранжирование при тех условиях, при которых он работает плохо.
  • Юзабилити и поведенческие факторы. Расположение элементов на сайте, их внешний вид влияют на юзабилити, удобство использования и поведенческие факторы. Также общее впечатление от внешнего вида тоже не стоит на последнем месте для поведенческих факторов. От этого зависит и продвижение сайта.
  • Читабельность. Хорошо оформленные тексты легко читать и воспринимать посетителям. Это положительно сказывается на поведенческих факторах и вообще на мнении о сайте.

BBSpoiler

Удобный плагин, который создаёт спойлеры. Спойлеры - это такие элементы, которые прячут часть текста. Если кликнуть на них, то текст раскрывается. Таким образом можно удобно экономить пространство в длинных статьях, убирая в спойлер текст, который, скорее всего, читателю не понадобится. Кому понадобится, тот сможет развернуть спойлер.

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

BBSpoiler на русском языке и бесплатный. Разработан Flector и имеет более 9 000 установок.

Shortcodes Ultimate

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

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

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

Это бесплатный плагин, разработан русскоязычным программистом Vladimir Anokhin, и имеет более 700 000 скачиваний.

WPi Designer Button

Позволяет создавать красивые кнопки. В нём есть множество готовых стилей и иконок. Для кнопок можно задавать свои стили, описания с подсказками, надписи, ссылки.

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

Разработан wooprali, установлен более 6 000 раз, совершенно бесплатный.

Cool Tag Cloud

Плагины для дизайна сайта на WordPress продолжает тот, который создаёт облако меток. В WordPress есть собственный встроенный виджет облака. Однако, он примитивный, выглядит не очень красиво и настроек в нём мало.

Cool Tag Cloud создаёт новый виджет, который выглядит намного красивее встроенного, так же имеет множество настроек стиля и цветов.

Плагин полностью бесплатный и на русском языке. Разработан Flector и имеет более 10 000 установок.

Menu Icons

Очень простой плагин, который добавляет во встроенный редактор меню WordPress возможность назначать к пунктам навигации какие-либо иконки. После активации появляется новая опция для добавления иконки. Можно выбрать картинку из готового набора.

Никаких других настроек у плагина нет. Поэтому всё очень просто. Разработан ThemeIsle и имеет более 100 000 активных установок. И, конечно же, он бесплатный.

myStickymenu

Это плагин для дизайна сайта на WordPress полезен тем, что помогает создать “липкое” меню. Это такое меню, которое при прокрутке всегда остаётся в поле зрения вверху экрана. Этот приём используется во многих современных темах и он удобен.

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

Плагин бесплатный, разработан m.r.d.a, имеет более 30 000 установок.

SiteOrigin CSS

Если уж и говорить про плагины для дизайна сайта на WordPRess, то среди них обязательно должен быть такой, который позволяет изменить внешний вид активированной темы. SiteOrigin CSS – это как раз один из таких вариантов.

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

Плагин бесплатный, разработан специалистами из SiteOrigin.

WPBakery Page Builder for WordPress - это популярный визуальный конструктор страниц для WordPress, разработанный компанией WPBakery Inc в 2013 году. Используется для создания landing page. Уже тогда им пользовалось 25000 разработчиков. В 2019 году это число перевалило за 1500000 человек. Плагин поставляется как вместе с купленными темами бесплатно, так и платно.

С 2015 года компания Wix и uCoz начали пропагандировать идею о том, что для создания ресурса не требуется знание языков программирования. Якобы процесс займет 30 минут, и всё готово. Это, конечно, круто, но возможности при использовании конструкторов такого типа сильно ограничены. Сайт строится из стандартных блоков, нет возможности использовать свой HTML код или скрипты. Если вам чего-то не хватает, то купите Premium аккаунт. Дорогой хостинг, домен и постоянное высасывание денег надоедает людям. Попытки создания интернет-ресурса заканчивались через пару дней.

Плюсы использования WPBakery Page Builder:

  • Установка на личный хостинг
  • Работа на 99% тем;
  • Front End и Back End редактирование;
  • Библиотека шаблонов;
  • Адаптивный дизайн;
  • 45+ элементов + установка дополнений (Addons);
  • Использование Bootstrap сетки.

Минусы:

  • Бесплатно предоставляется только с премиум темами;
  • Не работает на 1% из-за кривых рук разработчиков тем.

Популярные дополнения (addons) для WPBakery Page Builder

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

  • Massive Addons
  • Visual Composer Extensions Addon
  • Kaswara - Modern
  • Ultimate Addons
  • Visual Composer KIT (VCKit) Addon
  • Visual Composer Extensions Addon All in One
  • Video & Parallax Backgrounds
  • Team Showcase for Visual Composer WordPress Plugin
  • Visual Composer - Sortable Grid & Taxonomy Filter
  • Visual Composer Add-on Image Hotspot with Tooltip
  • Testimonials Showcase
  • Unique Hover Effects
  • Modal Popup Box For
  • Smart One Page Navigation - Addon For Visual Composer
  • Ultimate MailChimp Form Builder for Visual Composer
  • Fast Gallery for Visual Composer WordPress Plugin
  • Food Menus Addons for Visual Composer WordPress Plugin
  • Visual Composer | Pricing Tables By NBGoyani
  • Visual Composer Add-on Bookshelf
  • Vera - Essential Multimedia Addons for Visual Composer

Как установить WPBakery Page Builder на сайт

  1. Для начала приобретите VC в магазине codecanyon.net . После оплаты в личном кабинете появится ссылка для загрузки и код активации. Если плагин предоставлен вместе с купленной премиум темой, то архив с плагином находится в загружаемых файлах темы.
  2. Зайдите в панель управления > Плагины > Добавить новый > Загрузить плагин. Теперь появится область с кнопкой выбора файла. Найдите.zip архив VC и нажмите кнопку Установить. Продвинутые пользователи могут использовать FTP. Если вы новичок, то воспользуйтесь нашей инструкцией по установке плагинов .
  3. После успешной загрузки, WordPress предложит активировать новый плагин и ввести лицензионный ключ. Ввод ключа нужен для поддержи и обновления.
  4. Установка Visual Composer завершена .

Настройка WPBakery Page Builder

Чтобы настроить конструктор для WordPress пройдите в меню плагина > Основные настройки.

В основных настойках не отключайте адаптивный дизайн. В пункте “Google font subsets” отметьте кириллические шрифты как на картинке ниже. Так как у нас ещё нет шаблонов, ничего не выберем в пункте “Default template for post types”. Если хотите пройти обучающий тур, то нажмите кнопку “Reset”. Во время работы будут приходить подсказки на английском языке.

Самой важной настройкой будет вкладка “Role Manager”, так как тут происходит выбор типа страниц, на которых будет включен конструктор. Представлены роли пользователей, которые у есть на сайте. Я пользуюсь только администратором, поэтому расскажу на его примере.

Типы записей:

  • Page only - Visual Composer работает только на страницах
  • Custom - самостоятельный выбор. В моем случае это Страницы, записи в блоге и портфолио.
  • Disable - Выключить. Этот пункт можно использовать для авторов.

Backend editor - конструктор в админ-панели WordPress. Вы можете расставлять блоки, заполнять их, но результат увидите только после сохранения и перехода на сайт. Оставляем его включённым. Не рекомендую отключать классический редактор, поэтому “Disable Classic editor” не отмечаем.

Frontend editor - визуальный редактор. Открывается сайт, где вы можете вставлять и редактировать блоки. Главный плюс - вы видите, как будет выглядеть контент на ПК, планшете, телефоне в горизонтальном и вертикальном режиме. Оставляем этот пункт включенным.

В последующих пунктах ничего не меняем. Делаем настройки, как на скриншоте. Настройка окончена.

Как пользоваться конструктором страниц для WordPress

  1. Создаем страницу, прописываем название и URL.
  2. Переходим в Backend editor.

  3. Кликаем по”Добавить блок”, и у нас откроется такое окно:

    Здесь присутствуют как предустановленные блоки, так и блоки от установленных расширений.
  4. Нажимаем на “Ряд”. Этот блок позволяет разметить область на столбцы, применить к нему анимацию. Обязательно сначала воспользуйтесь этим блоком, так как все остальные блоки вы будете вставлять в него. Представьте, что контент разделен на сектора и каждый сектор - свой ряд. Ряд можно сравнить с папкой на компьютере. При перемещении папки, файлы внутри перемещаются вместе с ней. Так и здесь.
  5. Ряд мы разделим на 2 части. Для этого наводим на кнопку со строчками. Выбираем 1/2 + 1/2.

  6. Нажимаем на + в первой колонке. Откроется меню выбора блоков, жмем на “Текстовой блок”. Нас встречает текстовой редактор с рыба-текстом. В “CSS анимация” можно выбрать нужный эффект. После внесения изменение > “Safe changes”
  7. Во вторую колонку мы вставим картинку, выбираем блок”Фото”. Источником изображения выбираем библиотеку сайта. Нажимаем на зеленый плюс и щелкаем на нужную картинку. Размер изображения можно прописать в пикселях или выражениями (“thumbnail”, “medium”, “large”, “full”). Ниже вы можете выбрать анимацию, эффект для фото, а также прикрепить ссылку, по нажатию на которую будет происходить переход.
  8. Сохраняем изменения и смотрим получившийся результат.

Многие скажут, ну и что? Это делается и в простом визуальном редакторе. Но легко ли интегрировать анимацию для текста и эффекты для картинок? Быстро разделить текст на столбцы? Знатоки скажут да, но обычному пользователю это может показаться проблемным.

Предлагаю вам изучить официальный YouTube канал разработчиков. Полезные видео, инструкции и многое другое.

Подведем итоги

Отзыв на WPBakery Page Builder будет таковым: Возможности почти безграничны, и вы можете легко себе сделать Landing на своём website используя конструктор страниц для CMS WordPress. Если вы занимаетесь созданием сайтов, либо подбираете себе премиум тему, то пользоваться данным конструктором придётся.

В комментариях расскажите о своем опыте использования визуальных редакторов для сайта. Что вы используете? Если 10 человек поделятся этой записью у себя в социальных сетях, я выложу актуальную версию VC в ознакомительных целях.

Купить Visual Composer можно по ссылке - codecanyon.net . Попробовать плагин в Demo режиме можно по ссылке - vc.wpbakery.com/try/ . На странице введите своё имя, Email и выберите, какую страницу вы хотите создать.