Elementor addons: зачем нужны, где взять и как установить?

Дата публикации: 15.10.2018

plaginy-dlya-elementorПриветствую вас, друзья 🙂

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

И сегодня на очереди у нас, по сути уникальная и слегка забавная тема, т.к. сегодняшний разговор будет посвящён плагинам для плагина 🙂

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

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

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

Уверен, что время вы проведёте с пользой 😉

Поехали! 🙂

Чем плагины для Elementor отличаются стандартных?

Прежде всего я решил познакомить вас с особенностями Elementor addons и рассказать чем они отличаются от стандартных плагинов для WordPress.

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

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

Без его наличия использовать Elementor addons у вас не получится.

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

Так что тех, кто считал, что плагины для Elementor — это виджеты, входящие в состав Elementor Pro, которые можно скачать или купить отдельно , спешу разочаровать 🙂

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

Поэтому они могут лишь дополнить Elementor Pro, но никак не заменить его 🙂

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

А где их искать и как устанавливать — обо всём этом читайте дальше.

Где скачать WordPress Elementor addons?

В отличие от Элементор шаблонов, WP Elementor плагинов нет в официальной библиотеке Elementor дополнений, доступной в самом плагине.

В ней имеются только templates и их готовые блоки. Поэтому плагины для Elementor вам придётся искать и скачивать самостоятельно.

http://cccp-blog.com/wp-includes/images/banners/templatemonster/banner_content.jpg

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

  1. TemplateMonster — единственный проверенный сайт в данном списке, с которым я уже не первый год сотрудничаю лично. Качество их продуктов всегда стабильно отличное, равно как их выбор и поддержка, где вы сможете получить ответы на все интересующие вас вопросы на русском языке. Также единственный сайт в данном списке с русскоязычным интерфейсом сайта.
  2. WPasta — хорошая подборка из 10 Elementor widgets и addons, среди которых есть как платные так и бесплатные варианты.
  3. Themeisle — также качественная подборка из 8 плагинов для Elementor, содержащих в сумме 69 дополнительных Элементор виджетов. Среди них платные, бесплатные и продукты, работающие лишь с Elementor Pro.
  4. Elementor blog — подборка Элементор плагинов, опубликованная на блоге самого Elementor. Состоит из более, чем 10 решений, среди которых есть плагины бронирования (booking plugins) для гостиниц и сервисов услуг, контактные формы и т.д.
  5. WPLift — ещё одна подборочка из 8 бесплатных и 4 платных плагинов.

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

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

Как установить Elementor addons на WordPress сайт?

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

Поскольку, как я уже говорил, Elementor addons являются, по сути, такими же Elementor плагинами, как и все остальные, то и порядок их установки будет таким же, как и в случае установки плагинов WordPress.

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

В качестве наглядного примера я решил продемонстрировать вам установку плагина JetTricks от Zemez, найти который вы можете в TemplateMonster Elementor Marketplace по приведённой ссылке.

Сайтом для его тестовой установки у меня выступит ресурс, созданный мною на поддомене текущего, который я как раз и делал в качестве наглядного пособия для написания серии статей об Elementor. Следовательно, Elementor page builder на нём также давно имеется.

Доступен сайт по следующему url — http://elementor.cccp-blog.com.

Сейчас на его страницах вы можете найти следующий контент:

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

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

Пример установки плагина для Elementor

В скачанном мною с TemplateMonster архиве находился архив с самим плагином и документация к нему с описанием лицензии, по которой он распространяется.

При приобретении товаров с TemplateMonster обязательно сохраняйте номер покупки (транзакции), который вам присваивается при оплате заказа, т.к. он пригодится вам при активации плагина или шаблона!

Заходим в админку WorPress сайта и в боковом меню выбираем пункт Плагины > Добавить новый, после чего перед нами откроется следующая страница:

ustanovka-plagina-dlya-elementor

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

Нажимаем кнопку Установить и после успешной установки Elementor плагина активируем его на следующем экране нажатием на соответствующую кнопку:

aktivaciya-plagina-dlya-elementor-wordpress

Вот и всё. После произведённых действий JetTricks у меня появился в списке установленных WordPress плагинов:

elementor-addons-spisok

http://cccp-blog.com/wp-includes/images/banners/partner_web_studio/banner_728x90.png

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

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

Для этого я создал новую страницу, которая будет доступна по url http://elementor.cccp-blog.com/vozmozhnosti-elementor-jettricks, и на экране её редактирования нажал на кнопку Редактировать в Elementor:

elementor-addons-demonstraciya-vozmozhnostej

Чтобы страница не наследовала структурные элементы главной темы сайта, в настройках макета страницы нужно выбрать Холст Elementor.

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

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

В моём случае присутствие JetTricks было заметно в нескольких местах, т.к. он имеет несколько функций.

Во-первых, это новые Elementor widgets, которые сгруппированы в блоке Jet Elements:

elementor-dopolneniya-v-interfejse-wp-elementor

Виджетов немного, всего 3.

Первым из них является HotSpots, который позволяет добавлять на страницу картинку с различными кнопками для привлечения к ним внимания, так называемые «горячие точки»:

kastomnye-elementor-widzhets

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

wp-elementor-vidzhety-nastrojka

Ну, и третий называется View More, что в дословном переводе с английского означает Показать больше:

elementor-dopolneniya-pokazat-bolshe

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

Помимо дополнительных Elementor виджетов JetTricks добавляет различные эффекты стандартным Элементор секциям, колонкам и элементам, которые также доступны в специальной секции настроек Jet Tricks на вкладке Расширенные.

Среди них можно найти возможность добавлять Parallax-эффект различным стандартным Elementor виджетам с различными опциями скорости и фиксации в зависимости от типа устройства:

plaginy-dlya-elementor-jet-tricks

Также к элементам можно применять эффект Satellite, т.е. добавлять сопутствующий текст или изображение, который будет отображаться до, после или по сторонам секции. Конфигурируется всё это дело следующим образом:

elementor-plaginy-jet-tricks-nastrojka-satellite-ehffekta

А выглядит так:

elementor-addons-jet-tricks-satellite-ehffekt

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

И ещё одной полезной фишкой выбранного мною плагина является возможность добавления подсказок к секциям и конкретным элементам с помощью опции Tooltip:

plagin-dlya-elementor-podskazka

На самом сайте выглядеть это дело будет следующим образом:

wordpress-elementor-dopolneniya-podskazka

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

Также все JetTricks виджеты показываются в Elementor навигаторе:

plaginy-dlya-elementor-v-navigatore

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

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

И напоследок я оставил, пожалуй, одну из самых вкусных плюшек JetTricks, которая позволяет секциям в качестве фона добавлять различные JavaScript-анимации с помощью опции Particles:

elementor-widgets-animirovannyj-fon

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

Сформируйте необходимый эффект с помощью визуального конструктора, сохраните его конфигурацию в JSON файл нажатием на кнопку Download current config (json) и вставьте содержимое загруженного файла в поле настроек необходимой вам Elementor секции.

Обновляете страницу и, вуаля, ваш фон теперь живой и двигается 🙂

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

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

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

Также Elementor addons позволяют экономить не только время, но и деньги. К примеру, последняя возможность JetTricks, о которой мы говорили, — эффект анимации фона — при обращении к профессионалам обошлась бы вам в дополнительные 100-300$ в зависимости от квалификации разработчика и сложности самого эффекта.

Плагин же в TemplateMonster Elementor Marketplace стоит 15$. И при этом анимация фона — не единственная возможность, которую он предлагает. Думаю, мысль вам ясна, т.к. с цифрами спорить трудно 🙂

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

Зовите своих друзей с помощью кнопочек шаринга статьи в социальных сетях — помогайте создавать качественные сайты на базе WordPress Elementor и им 🙂

Всем добра и до новых встреч! 😉

Понравилась статья? Поделись с друзьями:
  1. 5
  2. 4
  3. 3
  4. 2
  5. 1
2 голоса, в среднем: 5 из 5

Похожие темы

Комментариев пока нет... Будьте первым! :)

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *