Эта статья основана на моем опыте последних трех лет, когда я переходил от одного редактора WP к другому.
Наконец-то я нашел тот, который мне нравится, и ниже я скажу, какой именно.
В конце концов, WordPress уже поставляется с редактором под названием TinyMCE, который технически является WYSIWYG-редактором.
Я должен пояснить, что под WYSIWYG-редактором я понимаю редактор, в котором вы видите то, что получается в процессе создания страницы или сообщения.
В TinyMCE вы не знаете точно, как будет выглядеть результат, пока не нажмете «сохранить» и не увидите предварительный просмотр.
Все рассмотренные здесь WYSIWYG-редакторы позволяют осуществлять редактирование в реальном времени (за исключением Page Builder от Site Origin — о нем подробнее позже). Это означает, что вы видите конечный результат в том виде, в котором он отображается на странице, по мере редактирования страницы или сообщения .
Вот почему настоящий WYSIWYG-редактор, он же drag-and-drop редактор или визуальный редактор, просто необходим занятым блоггерам, которым нужно быстро загружать свои статьи или посты в блог.
Недавно я сменил визуальный редактор, который я использую, с Site Origin’s Page Builder Premium на Thrive Architect. Прежде чем сделать шаг, я провел довольно много исследований: вот претенденты, которых я рассматривал.
Раскрытие информации: Некоторые ссылки в этом сообщении являются «партнерскими ссылками». Это означает, что если вы нажмете на ссылку и приобретете товар, я получу партнерскую комиссию.
Какой лучший WYSIWYG-редактор для WordPress?
#1 — Visual Composer
Visual Composer — один из самых продаваемых конструкторов страниц для WordPress. Это определенно претендент на звание лучшего WYSIWYG-редактора WordPress.
Он имеет полнофункциональный внутренний и внешний редактор и работает с любой темой WordPress.
Visual Composer поставляется с более чем 45 модулями контента, включая:
- сетки постов
- поддержка медиа
- диаграммы
- фон презентации
- карусель презентации
- YouTube
- Vimeo
- самостоятельно размещенное видео
Некоторые из других возможностей Visual Composer:
- Простой в применении эффект параллаксного фона для разделов, строк и колонок
- CSS градиентный фон с поддержкой альфа-канала
- Поддержка постов, пользовательские страницы и посты
- Поддерживает шорткоды WordPress
- Система шаблонов позволяет сохранять пользовательские элементы дизайна в виде шаблонов
- Оптимизировано для SEO, так что ваш контент готов к хорошему старту в плане ранжирования по ключевым словам
- Полностью отзывчив на мобильных устройствах
- Полная история изменений
- Поддерживает предопределенные виджеты WordPress
- Редактор боковых панелей
- Редактор заголовков
- Редактор футеров
- Переносите свои шаблоны Visual Composer с одного сайта на другой за считанные секунды
- Совместимость с Gutenberg — добавьте блоки Gutenberg на свой сайт. добавлять блоки Gutenberg в любое место макета страницы
В двух словах
Хорошо работает для базовых макетов. Макет и пользовательский интерфейс не очень интуитивно понятны. Не очень большой выбор элементов контента по сравнению с другими конструкторами страниц.
Ценообразование
- Бесплатно
- От $49 в год
#2 — Site Origin Page Builder
С более чем миллионом активных установок Site Origin Page Builder является одним из самых популярных конструкторов страниц WordPress. Его популярность отчасти объясняется тем, что он бесплатный (хотя вы можете приобрести премиум-пакет виджетов).
Вот некоторые из особенностей:
- работает с любой темой WordPress
- выбирайте точное количество строк для каждой добавляемой колонки
- Используйте все существующие виджеты WordPress
- Отзывчивый дизайн
- Posts, Поддерживаются страницы и пользовательские типы постов
- Инструмент истории изменений позволяет отменить изменения
Хотя конструктор страниц Site Origin является бесплатным, существует Premium Widget Bundle ($29), который включает такие дополнения, как:
- Аккордеон
- Блочная анимация
- Контактная форма
- Виджет призыва к действию
- Lightbox
- Parallax слайдеры
- Testimonials
Site Origin Page Builder интегрируется с любой темой WP, так что это не обязывает вас к определенной теме.
Не имеет такого количества опций стиля, как другие визуальные редакторы WordPress. Для продвинутой стилизации вы должны быть знакомы с CSS.
Site Origin имеет как внутренние, так и внешние редакторы. Но внешний редактор не такой продвинутый, как другие рассмотренные здесь wysiwyg-редакторы.
Site Origin Page Builder — backend
Изменения, которые вы делаете во внешнем редакторе, видны не сразу — вам придется подождать несколько секунд, пока страница перезагрузится.
Из-за этого он кажется неуклюжим по сравнению с другими редакторами и замедляет процесс создания новой записи в блоге.
Site Origin Page Builder — Live Editor
Еще одна проблема, которую я обнаружил в Site Origin Page Builder, заключается в том, что трудно найти нужное место для вставки элемента, например, нового абзаца, заголовка или изображения.
В редакторе Live Editor добавить элемент (или форму) можно только на левой панели. Но очень трудно понять, где вы находитесь на левой панели.
Было бы неплохо, если бы они добавили такую функцию: когда вы наводите курсор на элемент в правой панели, он автоматически прокручивается вниз в левой панели и выделяет соответствующий блок в левой панели. Таким образом, вы будете знать, куда вставить новый элемент или модуль.
Я написал в Site Origin Page Builder об этом чуть больше года назад. Но они, очевидно, не приняли это во внимание.
И последнее соображение:
Если вы удалите Site Origin Page Builder, он оставит смесь чистого HTML и шорткодов. Это означает, что страницы, созданные с помощью Site Origin, могут быть недоступны для редактирования в другом конструкторе страниц.
В двух словах
Конструктор страниц Site Origin не находится на одном уровне с Elementor и Thrive Architect. На мой взгляд, он не участвует в конкурсе на звание «лучший WYSIWYG-редактор WordPress».
Во-первых, «Живой редактор» не является настоящим внешним редактором. Изменения не отображаются мгновенно при редактировании — после каждого изменения происходит задержка перезагрузки страницы. Это очень замедляет работу.
Ценообразование
- Site Origin Page Builder можно скачать бесплатно
- Site Origin Premium стоит от $29 в год
#3 — Divi Builder
Конструктор Divi Builder изначально был частью темы Divi от Elegant Themes. Но теперь это отдельный конструктор страниц, который работает с любой темой WordPress.
Некоторые из особенностей:
- Редактирует как внешнюю, так и внутреннюю часть
- Полностью отзывчивый дизайн
- Поддержка пользовательских постов, страниц и сообщений
- Поставляется с 46 модулями конструктора страниц
- Быстрый и простой в использовании
- Позволяет проводить A/B тестирование различных макетов
- Поддержка пользовательских CSS
В двух словах
Имея более 500 000 клиентов, Divi Builder является одним из самых популярных редакторов WordPress. Он поставляется с более чем 20 различными макетами и шаблонами для различных типов сайтов
Однако Divi Builder в значительной степени полагается на шорткоды. Это означает, что вы не сможете переключиться на другой конструктор страниц. По сути, вы застряли в использовании Divi Builder. Это серьезный недостаток, который, по моему мнению, выводит его из гонки за лучший WYSIWYG-редактор WordPress.
Цены
- Чтобы загрузить Divi Builder, вы должны стать членом Elegant Themes, что стоит 89 долларов США в год.
- Это также дает вам доступ к каждой теме и плагину, созданному Elegant themes — неплохая сделка!
#4 — Elementor Page Builder
Elementor Page Builder — относительно новый визуальный редактор WordPress (запущен в 2016 году), но уже имеет более 1 000 000 активных установок.
Описывает себя как «Ведущий в мире конструктор страниц WordPress».
Насколько я знаю, это единственный конструктор страниц WordPress с открытым исходным кодом. Тысячи разработчиков расширили базовую функциональность Elementor, создавая темы, дополнения и другие продукты.
Вот некоторые из особенностей:
- Система шаблонов позволяет сохранять макеты и повторно использовать их в других местах вашего сайта
- Позволяет добавлять виджеты, созданные другими плагинами WordPress
- Поставляется с более чем 300 шаблонами,
- Истинное фронтенд-редактирование — смотрите на свою страницу в реальном времени по мере ее редактирования
- Оставляет чистый код (если отключить Elementor)
- Создайте целую целевую страницу с помощью Elementor’s Canvas
- Более 80 элементов дизайна, включая виджеты изображений и основной текст продвинутые аккордеоны, слайдеры, отзывы, иконки, социальные сети, вкладки,
- Работает с любыми темами и плагинами WordPress
- История изменений позволяет быстро исправить любые ошибки простым нажатием клавиши
- Встраивание постов и видео Facebook на ваши страницы
- Поддерживает дизайн, реагирующий на мобильные устройства
Elementor front-end модификация
В двух словах
Это один из самых продвинутых конструкторов страниц. Благодаря стремлению стать лучшим визуальным редактором WordPress, вы можете быть уверены в постоянных улучшениях.
Одним из больших преимуществ является то, что бесплатная версия дает вам доступ примерно к 90% того, что делает платная версия. Однако в Elementor отсутствует какая-либо ориентация на конверсию, поэтому это не лучший выбор для маркетологов.
Некоторые, без сомнения, считают Elementor лучшим WYSIWYG-редактором для WordPress. Но если ваша цель — максимизировать конверсию с вашего сайта, то я думаю, что это звание принадлежит Thrive Architect.
Ценообразование
#5 — Thrive Architect
Здесь я могу потерять некоторую объективность, поскольку я только что перешел на Thrive Architect (с Site Origin Page Builder) и я очень впечатлен!
Thrive Architect основан на предыдущем конструкторе страниц Thrive, Thrive Content Builder, который был значительно переработан и получил множество новых функций.
Отличие Thrive Architect от других визуальных редакторов заключается в его направленности на конверсию. Именно поэтому он стал любимцем блоггеров и маркетологов.
Thrive Architect имеет настраиваемые кнопки, свидетельства, таймеры обратного отсчета и модули генерации лидов, которые интегрируются со всеми основными инструментами маркетинга электронной почты.
Если вы уже используете Thrive Leads, вы можете добавить свои собственные opt-in модули одним нажатием кнопки.
Одним из аспектов Thrive Architect, который мне очень нравится, является возможность масштабирования изображения с помощью слайдера (в моем предыдущем конструкторе страниц у вас было только 5 или 6 фиксированных размеров):
Еще одна интересная опция в Thrive Architect — возможность наложить цветной слой поверх изображения.
А если вы действительно хотите привлечь внимание людей, вы можете добавить анимированные заголовки (я использовал обе техники на рисунке ниже):
Автоматизация типа Focus в Thrive Architect
Фронтальное редактирование — это абсолютный восторг — возможно, лучший опыт фронтального редактирования среди всех визуальных редакторов:
Еще одна вещь, которую я люблю в Thrive Architect — это расширенные элементы управления тенью.
Мне нравится накладывать тени на экраны, чтобы они выделялись на фоне текста. В моем предыдущем редакторе не было возможности сделать это, поэтому мне приходилось добавлять тени в графическом приложении, что отнимало много времени.
С Thrive Architect это всего лишь клик!
Thrive Architect’s Drop Shadow controls
Помните, я говорил, что Thrive Architect специализируется на преобразовании?
Неудивительно, что Thrive Architect содержит мощный конструктор целевых страниц.
Это некоторые из готовых (но настраиваемых) разделов, которые вы можете добавить на свои целевые страницы:
- Социальное доказательство/Свидетельство Раздел
- Образ героя Раздел
- CTA Раздел
- Особенности Раздел
Раздел
- Как это работает
- Бонусный раздел
- Гарантийный раздел
- Воронки продаж
Вот некоторые другие особенности Thrive Architect:
- Отзывчивый мобильный…
- Встроенная система шаблонов позволяет
- Сохранять и загружать макеты
- История изменений и отмена и
- Кнопки Redo вносят исправления
- Стилизованные пулевые точки
- Списки (как этот)
- Сетки характеристик (с изображениями или иконками)
- Динамические таймеры обратного отсчета
- Модули opt…в
- События страницы — отображение всплывающего окна лайтбокса на основе определенных триггеров
Команда Thrive Themes постоянно добавляет новые функции и возможности в Thrive Architect. И это гарантирует, что данный редактор WordPress будет оставаться лучшим WYSIWYG-редактором для WordPress.
В двух словах
Thrive Architect — это идеальный конструктор страниц для маркетологов или тех, кто хочет превратить посетителей в подписчиков или клиентов. Thrive Architect специализируется на конверсии и имеет больше инструментов для конверсии, чем любой другой известный мне конструктор страниц. Thrive Architect часто сравнивают с Elementor по внешнему виду и ощущениям. Но мне больше нравится пользовательский интерфейс Thrive Architect, чем Elementor. По моему мнению, Thrive Architect — лучший WYSIWYG-редактор в WordPress.
Ценообразование
Thrive Architect является частью Thrive Suite, который стоит $90 в квартал
#6 — Beaver Builder
С более чем 500 000 активных установок, Beaver Builder является одним из самых популярных конструкторов страниц WordPress. Он также является одним из самых простых в использовании — так что это отличный выбор для начинающих блоггеров.
Вот некоторые из возможностей, которые предлагает Beaver Builder:
- Работает с любой темой WordPress
- Живое редактирование на переднем плане — видите свои изменения по мере их внесения
- Поддержка виджетов и шорткодов WordPress
- Поддержка классов CSS и пользовательских идентификаторов
- Если вы удалите Beaver Builder, Ваш контент передается в родной редактор WP
- Оптимизирован для мобильных устройств
- Поставляется с десятками готовых шаблонов страниц
- Предлагает модули для слайдеров, карусели, фоны, блоки контента, кнопки и многое другое
Я должен сказать, что пользовательский интерфейс Beaver Builder кажется немного простым по сравнению с Elementor или Thrive Architect:
ВКоротко
Beaver Builder — отличный вариант для начинающих, поскольку его использование не требует больших усилий для обучения. Он предлагает не так много модулей, как некоторые другие конструкторы страниц. С другой стороны, если вы захотите вернуться к редактору WordPress, Beaver Builder оставляет 100% чистый код. Таким образом, вы сможете редактировать свои предыдущие сообщения в редакторе WordPress и большинстве других конструкторов страниц.
Ценообразование
- $99 в первый год, затем продление со скидкой 40%
#7 — Gutenberg WordPress Editor
WordPress всегда поставлялся с предустановленным редактором. Но недавно WordPress выпустил новый редактор с перетаскиванием, совершенно бесплатный, под названием Gutenberg.
Gutenberg имеет очень чистый и интуитивно понятный пользовательский интерфейс:
Gutenberg UI Editor
Как только вы установили Gutenberg, он становится редактором по умолчанию — вам не нужно его выбирать.
Редактор Gutenberg работает на основе блоков, которые вы вставляете на свою страницу или пост, нажимая на символ «плюс»:
Пользовательский интерфейс редактора Gutenberg
Хотя Gutenberg — это огромный шаг вперед по сравнению с редактором TinyMCE с открытым исходным кодом, который поставляется с WordPress, ему все еще не хватает некоторых расширенных функций, которые можно получить в платных конструкторах страниц.
Вот пример блоков, поставляемых с Gutenberg
- Блок краткого содержания
- Расширенный блок списка
- Блок кнопок
- Блок изображений
- Расширенный блок видео
- Блок контента
- Блок Google Maps
- Блок расширенных таблиц
- Блок аккордеонов
- Блок свидетелей
- Блок социальных ссылок
Хотя мне нравится чистый и аккуратный интерфейс, Я заметил несколько ошибок (в версии, которую я использовал):
- Было трудно редактировать пермалинки в Gutenberg
- маркированный список должен оставаться внутри своего блока, иначе весь текст в блоке превращается в маркированные пункты
Здесь я должен упомянуть, что Gutenberg не был хорошо рассмотрен. На официальном сайте WordPress редактор Gutenberg получил 1791 отзыв и в среднем 2,2 звезды из 5.
В двух словах
Gutenberg — это элегантный, не требующий особых усилий конструктор страниц с перетаскиванием. Но ему определенно нужно еще немного поработать, прежде чем он приблизится к тому, чтобы конкурировать с любым из рассмотренных выше конструкторов страниц. Конечно, он бесплатный, но Site Origin, Elementor и Visual Composer предлагают полнофункциональные бесплатные версии.
Цены
- Бесплатно (включен в WordPress)
Резюме — лучший WYSIWYG-редактор для WordPress
Когда я искал новый конструктор страниц для WordPress, это были ключевые функции, которые я искал:
- Простой в использовании интерфейс
- Истинно фронтальное редактирование (т.е. вы видите изменения мгновенно, во время редактирования страницы)
- Полностью отзывчивый на мобильных устройствах
- Работает с любой темой WordPress
- Поддерживает все предопределенные виджеты WordPress
- Система шаблонов позволяет сохранять пользовательские элементы и макеты и использовать их повторно
- История изменений, которая позволяет быстро вернуться к вашей История изменений, позволяющая быстро вернуться к предыдущим версиям
- Модуль содержания
- Поддерживает пользовательские CSS
- Оставляет код чистым
Elementor и Thrive Architect кажутся двумя наиболее продвинутыми конструкторами страниц WordPress и оба отвечают моему списку минимальных требований.
В итоге я выбрал Thrive Architect по двум причинам:
Причина №1
При редактировании страницы в Thrive Architect формы находятся на одной стороне экрана, а элементы управления для каждой формы — на другой.
Но в Elementor формы и элементы управления находятся на одной стороне экрана.
Это означает, что в Elementor вы делаете гораздо больше кликов, чем в Thrive Architect. В Elementor после завершения стилизации абзаца, заголовка или изображения необходимо щелкнуть мышью назад, чтобы перейти к меню форм.
В то время как в Thrive Architect формы все еще находятся там, на другой стороне экрана.
Причина №2
Как и большинство блоггеров, я пытаюсь превратить посетителей в подписчиков (и в конечном итоге в покупателей).
Ориентация Thrive Architect на конверсию стала для меня решающим фактором. В Thrive Architect больше модулей, связанных с конверсией, чем в любом другом конструкторе страниц WordPress.