Elementor Pro — многофункциональный конструктор страниц на WordPress: подробный обзор

Здравствуйте, уважаемые читатели.

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

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

Думаю вам уже интересно что же там внутри, ну чтож не буду томить и приступаю к обзору.

Elementor – что это такое?

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

Плагин имеет бесплатную версию (которая просто называется Elementor), однако в данной статье речь пойдёт про полноценную платную версию Pro со всеми её функциями и особенностями, присущими ей.

Основная аудитория плагина – дизайнеры, создатели сайтов, а также маркетологи и владельцы интернет-магазинов (Elementor Pro отлично совмещается с плагинами для электронной торговли, такими как WooCommerce, Ecwid и так далее).

Как купить и установить плагин Elementor Pro?

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

#1. Устанавливаем бесплатный плагин Элементор на сайт

Для начала необходимо просто установить бесплатную версию Элементора — для этого войдите в админку WordPress и через вкладку «Плагины» добавьте Elementor в ваш аккаунт. Далее активируйте его, и после этого перед вами откроется следующее окно.

P/S: Подробнее про установку плагина на Вордпресс можете почитать в нашей отдельной статье.

#2. Привязываем сайт к учетной записи, создаем и настраиваем её

После установки плагина Elementor необходимо будет привязать ваш сайт к учётной записи на сайте elementor.com, а также настроить её. Для того чтобы это сделать нажмите на кнопку «Create my account».

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

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

После выбора нужного вам аккаунта Google, нажмите на кнопку «Подтвердить».

Далее нажмите на кнопку «Connect», после чего этап входа в учётную запись и привязки к ней вашего сайта будет наконец-то завершён.

После этого необходимо будет осуществить стартовые настройки темы. Начинаем с выбора темы — по умолчанию Elementor предлагает установить так называемую приветственную тему с базовым шаблоном страницы. Для того, чтобы сделать это, нажмите на кнопку «Continue with Hello Theme».

После этого необходимо будет задать имя вашему сайту.

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

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

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

После этого нажмите на кнопку «Далее».

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

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

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

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

После этого вы вернетесь в Гутенберг новый редактор WordPress (ну или старый если у вас стоят соответствующие плагины, например Clearfy Pro (обзор)). В моем случае это Gutenberg и для того чтобы перейти в основное меню Вордпресс нажимаю на одноименную иконку.

Далее вы оказываетесь в основном меню админиматра на WordPress.

#3. Покупка платной версии Elementor Pro

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

Далее выберите себе подходящий план. Elementor можно купить для одного, 25 или сразу тысячи сайтов, стоимость будет составлять от 59 до 399 долларов в год. Просто кликните по тому тарифному плану, который вам приглянулся.

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

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

Далее вы перейдете к выбору способа оплаты (доступны банковские карты, а также PayPal). Выберите нужный вам формат и нажмите на кнопку «Pay now».

В моём случае выбор пал на оплату посредством сервиса PayPal.

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

Далее просто введите свой пароль и нажмите на кнопку «Log in».

Подтвердите вход, нажав на кнопку «Continue».

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

Далее нужно выполнить последнее подтверждение, нажав на кнопку «Agree & Pay», после чего будет завершен процесс покупки плагина.

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

#4. Установка и активация Elementor Pro

После того как вы совершили оплату Elementor Pro у вас откроется примерно вот такая страница .

На которой чуть ниже будет детально показан процесс установки плагина.

Для того чтобы скачать про-версию плагина Элементор, нажмите на кнопку «Download Elementor Pro».

Далее снова осуществляем установку плагина через админку Вордпресс — так же, как и вы устанавливали и обычную (бесплатную) версию плагина. После установки и полной активации перед вами откроется следующее окно:

Выберите Elementor Pro и нажмите на кнопку «Connect & Active» для того, чтобы связать ваш сайт с аккаунтом плагина.

Для подтверждения связи нажмите на кнопку «Active» в окне со скриншота ниже.

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

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

После этого можно констатировать, что установка и полная настройка плагина Elementor Pro завершена.

Как работать и пользоваться Elementor Pro?

Рассмотрим теперь, какие возможности есть у плагина, как осуществить все его настройки, а также рассмотрим, какие цели и задачи можно реализовать, используя Elementor Pro.

Настройки

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

#1. Элементор

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

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

• Submissions — в этом блоке происходит настройка методов раскрутки вашего сайта.

• Custom Fonts —  как видно из названия, позволяет имплементировать на сайт ваши собственные шрифты, отличные от тех, что есть по умолчанию.

• Custom Icons — в нем вы можете добавить собственные иконки на сайт.

• Custom Code — в этом блоке можно вставить собственные блоки в виде голого кода, а не через основной графический редактор.

• Менеджер ролей — позволяет настроить уровни доступа других пользователей к учётной записи, а также распределить права и возможности для каждого уровня.

• Инструменты —  позволяют провести расширенные настройки, а также сменить URL сайта, перейти в режим обслуживания, а также просмотреть и, при необходимости, восстановить старую версию сайта.

• Сведения о системе — блок, который не столько даёт доступ к каким-либо настройкам, сколько предоставляет вам актуальные данные о сервере, на котором базируется сайт.

• Приветствие — здесь вы можете подробнее ознакомиться с возможностями Elementor

• Помощь — при клике по этому пункту вы перейдете на страницу официального сайта с окошком поиска, куда можно будет вписать интересующий вас вопрос относительно функционала и возможностей Elementor Pro.

• License — здесь вы можете узнать всю актуальную информацию по вашей лицензии

#2. Шаблоны

Теперь перейдём к описанию большого раздела “Шаблоны”, в котором есть семь небольших подразделов.

• Сохранённые шаблоны — в данном блоке можно выбрать заранее созданный шаблон, чтобы с его помощью быстро создать новый сайт или лендинг.

• Popups — в этом блоке вы можете создавать всплывающие окна (или pop-up).

• Theme Builder — через него можно будет кастомизировать практически любую часть готового сайта.

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

• Библиотека наборов — при переходе откроется набор шаблонов, которые можно в один клик установить на ваш сайт.

• Добавить новый — этот раздел позволит вам создать свой шаблон.

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

Работа с плагином

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

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

В частности с помощью Elementor Pro можно реализовывать следующие задачи:

• Создание интернет-магазинов (при использовании плагинов для электронной коммерции типа WooCommerce и других)
• Вставка интерактивных форм, через которые можно собирать данные посетителей сайта или получать от них какие-либо ответы
• Создание всплывающих окон с важной информацией, промо-акциями или иными данными для привлечения внимания и так далее

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

Рекомендуем также посмотреть несколько видео-обзоров на Elementor Pro:

• Всё ещё актуальный обзор старой версии плагина:

• Обзор функций:

• Ещё один полезный обзор:

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

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

Советы новичкам

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

• Не пренебрегайте шаблонами – в плагине есть предустановленная библиотека шаблонов, с помощью которых можно создать несколько десятков совершенно различных по визуальному стилю страниц.
• Используйте аддоны – Elementor Pro поддерживает более сотни дополнений от сторонних разработчиков – они помогут вам расширить возможности плагина и сделать сайт по-настоящему уникальным и «кастомизированным».
• Делайте бэкапы данных – лучше всего делать бекапы сторонними плагинами.

Надеемся, что данные советы помогут вам разобраться и начать без промедления создавать идеальные интернет-страницы.

Плюсы и минусы

У каждого продукта в интернете есть как положительные стороны так и отрицательные. Давайте же рассмотрим плюсы и минусы плагина Elementor Pro:

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

Отзывы об Elementor Pro

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

Сара Вильямс — “Просто лучший”

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

Генри Рисман — “Прекрасный плагин для того, чтобы учиться веб-дизайну”

Я использовал Элементор около трёх месяцев. С самого начала я был впечатлен его редактором и скоростью работы. И после апгрейда до про-версии я смог выучить много нового о веб-дизайне и динамическом контенте на Вордпресс. Без улучшения до про-версии я бы никогда не познакомился с такими терминами, как “custom field” и “custom post type”. Элементор Про сделал меня профессиональным веб-разработчиком, несмотря на мою неспособность кодить.

Аналоги

Давайте теперь приведём список из пяти аналогов плагина Elementor Pro:

• OptimizePress — очень популярный плагин для создания целевых страниц. Читать подробный обзор OptimizePress.
• Divi Builder — еще один известный конструктор, который предлагает большой выбор модулей и шаблонов для создания страниц. Читать подробный обзор Divi Builder.
• ClickFunnels — сайт предназначенный для создания страниц, предназначенных для онлайн-торговли со множеством соответствующих инструментов и возможностей. Читать подробный обзор ClickFunnels
• LeadPages — многофункциональный сервис для создания и оптимизации целевых страниц. Читать подробный обзор LeadPages.
• ГетКурс — сервис, с помощью которого можно создавать страницы для онлайн-курсов и иных образовательных ресурсов. Читать подробный обзор GetCourse.

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

Итоги

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

И напоследок дорогие читатели у меня к вам вопрос: А для чего вы бы использовали Elementor Pro? Свой ответ пишите в комментариях под этим видео.

На этом у меня все. И до скорых встречь на страницах блога!