Как сделать popup в Elementor
Выполните следующие действия, чтобы настроить первое всплывающее окно. Используя это руководство, вы вручную вызовете модальное окно с помощью кнопки.
- Перейдите в «Панель управления» > «Шаблоны» > «Всплывающие окна» > «Добавить новый».
- Назовите свой шаблон и нажмите «Создать шаблон».
- Выберите шаблон из библиотеки или создайте свой собственный дизайн
- Нажмите «Опубликовать», затем «Сохранить и закрыть».
- Откройте новую страницу в Elementor (CTRL/CMD+E, новая страница)
- Перетащите виджет кнопки
- В разделе «Макет» выберите «Ссылка» > «Динамический» > «Действия» > «Всплывающее окно».
- Нажмите «Всплывающее окно» > «Открыть всплывающее окно» > выберите созданное всплывающее окно.
- Перейдите на живую страницу, нажмите на кнопку и увидите всплывающее окно.
Это базовая установка. Попробуйте, чтобы научиться использовать всплывающие окна Elementor Pro.
Как настроить popup в elementor
Когда вы создаете сайт WordPress, у вас есть определенные цели, ради которых вы работаете. Будь то прославление вашего веб-сайта, наличие огромного трафика или увеличение продаж, для достижения этого требуется ряд тактик.
Создание всплывающего окна обратного отсчета — еще один способ увеличить ваши продажи, создавая срочность в сознании покупателя и заставляя его действовать быстро.
Мало того, всплывающие окна обратного отсчета, когда они красиво созданы, могут повысить общий дизайн и влияние веб-сайта. В этом руководстве мы поймем, как создать всплывающее окно обратного отсчета в WordPress, используя Конструктор страниц Elementor.
Как создать всплывающее окно обратного отсчета с помощью Elementor
В этом уроке мы будем использовать Elementor Pro. С Elementor Popup Builder мы получаем множество шаблонов и дизайнов, которые можно мгновенно использовать для создания всплывающих окон.
Elementor Black Friday
Enjoy Amazing Deals Up to 50% Off
После того, как вы установили и активировали Elementor Pro, перейдите к своей панели инструментов и перейдите к параметру «Всплывающие окна» из шаблона.
Нажмите кнопку «Добавить новое всплывающее окно» на странице и двигайтесь вперед.
Вы попадете на страницу, похожую на форму, где вы будете добавлять детали своего всплывающего окна, такие как тип и имя для всплывающего окна.
После того, как вы ввели свои данные, нажмите кнопку создания всплывающего окна.
Вы будете перенаправлены в библиотеку Elementor, где увидите множество готовых всплывающих окон. Найдите строку Hello в библиотеке и выберите одну из библиотеки.
Пока мы будем создавать всплывающее окно с нуля с помощью Elementor. Оставайтесь с нами, чтобы узнать, как легко создать желаемое всплывающее окно.
Закройте всплывающую библиотеку и перейдите в «Настройки» из меню Elementor.
На вкладке «Настройки» вам необходимо заменить существующий набор на упомянутый ниже.
- Ширина: 100 VW
- Высота: 300 пикселей
- Вертикальное положение: сверху
- Входная анимация: постепенное появление
- Продолжительность анимации: 2,2 секунды.
Перейдите на вкладку «Стили» и внесите эти изменения.
- Цвет: 4EBBC6
- Тип границы: сплошной
- Ширина: 20
- Цвет границы: белый
После того, как вы внесли все указанные выше изменения, добавьте раздел с четырьмя столбцами.
Убедитесь, что столбцы выровнены по вертикали до середины.
Чтобы создать заголовок для всплывающего окна, перетащите виджет заголовка в первый столбец и введите заголовок.
Затем вам нужно добавить кнопку прямо под виджетом заголовка.
На вкладке «Содержимое» в кнопках редактирования установите текст кнопки «Купить сейчас!».
На вкладке «Стиль» кнопок редактирования внесите следующие изменения.
- Цвет фона: прозрачный
- Цвет текста: черный
- Положение границы: снизу
- Тип границы: сплошной
- Ширина границы: 2 пикселя
- Радиус границы: Нет
- Установите отступ внизу на 2 пикселя.
В библиотеке Elementor найдите обратный отсчет и перетащите виджет обратного отсчета во второй столбец.
Чтобы отредактировать виджет, перейдите в Edit Countdown, а затем в Content. Чтобы начать обратный отсчет по мере того, как посетитель приходит на ваш веб-сайт, установите тип обратного отсчета на Evergreen Timer, установите 24 часа и скройте «дни».
Придумайте сообщение, которое будет отображаться после истечения срока продажи, например «Извините! Срок действия продажи истек».
По прошествии 24 часов для пользователя всплывающее окно исчезнет и появится сообщение.
Вы также можете изменить дизайн таймера на вкладке стилей.
Затем перетащите виджеты изображений в столбцы влево, то есть в третий и четвертый столбцы. И добавьте к этим виджетам два изображения.
Ваше последнее всплывающее окно будет готово. Если вы использовали те же настройки, что и наши, всплывающее окно будет выглядеть так.
Вот как вы можете создать всплывающее окно обратного отсчета для своего веб-сайта. Вы можете изменить настройки и сделать что-то совершенно другое или выбрать одно из библиотеки всплывающих окон, Конструктор страниц Elementor имеет все параметры.
Это все от нас для этого урока. Обязательно присоединяйтесь к нам на наших Facebook и Твиттер, чтобы получать обновления о наших руководствах.
Попап конструктор для Elementor
Попап конструктор позволит вам генерировать всплывающие окна любого вида и выводить их на вашем Elementor сайте. Сконструируйте ваше Попап-окно, используя множество различных составляющих и подобрав наиболее удачное его расположение на вашем сайте; вы также можете задать триггер запуска попапа и целевую аудиторию для максимально эффективной работы. Ваш плагин может помочь клиентам подписаться на вашу рассылку, открыть для себя новые продукты, купоны, распродажи и специальные предложения, а также при помощи попапов они смогут получать сообщения о важных событиях и не только.
Генерируйте всплывающие окна для разных целей, без проблем увеличивайте показатели конверсии на сайте и многое другое!
Чем виджет Попап конструктор Elfsight лучше других?
Рассмотрите описание ведущих отличительных характеристик, которыми отличается Попап-окно. Они помогают нам быть лучше наших соперников:
- Вы можете указать триггер показа попапа
- Вы можете настроить частоту показа попапа
- Показывайте всплывающее окно только на нужных страницах
- Вы можете выбрать, на каких устройствах попап будет выводиться
- Пять вариантов раскладки для создания различных видов всплывающего окна
Как мне внедрить виджет на мой Elementor сайт
Чтобы встроить инструмент, просмотрите инструкцию.
- Используйте демо на сайте или откройте ваш аккаунт в Elfsight Apps.
- Выберите нужный инструмент и задайте подходящие настройки. Нажмите “сохранить внесенные изменения”.
- Установите код виджета на ваш Elementor сайт.
- Готово! Вы установили расширение.
Если вы не не понимаете установить плагин на ваш Elementor ресурс, вы можете обратиться к команде поддержки Elfsight.
Как настроить popup в elementor
Добавь add_on A Popup на сайт Elementor без написания кода и без головной боли
Если ваш веб-сайт Elementor запущен и работает, вы преодолели первую серьезную проблему на пути к расширению присутствия своего бизнеса в интернете. поздравляю!
Но дальше идет a tough question: как draw in, captivate, turn и поддержать больше посетителей?
Добавление Popup add_on — это proven метод увеличения взаимодействия с пользователем и конверсии , который часто suggested веб-профессионалами считается лучшим методом для amplifying
Некоторые компании сначала take a stab at делают все своими руками (diy) Popup или имеют «techie», который утверждает, что он / она может построить a Popup in ‘no time’.
Другие пытаются найти приложения с открытым исходным кодом Popup или companies abroad, которые claim to предлагают Popup приложения at rock-bottom prices.
Кроме того, настройка и обновление Popup требует еще больше времени и может вызвать новые проблемы или ошибки.
По мере роста вашей компании вы, вероятно, столкнетесь с проблемами безопасности, поскольку хакеры могут попытаться использовать Popup уязвимости в системе безопасности.
По мере роста посещаемости сайта повышенная нагрузка может вызвать проблемы с отображением Popup. Нет ничего хуже, чем Popup that stops working на видном месте, как и ваш трафик booms благодаря кампании thriving!
Поскольку веб-технологии progress, пользовательские и собственные Popup приложения потребуют больше времени и средств от keeping вашего «веб-мастера», чтобы обновить ваш сайт и сохранить его up and running.
Вот почему большинство серьезных компаний выбирают профессиональные hosting service Popup решения, такие как powr.
Для начала powr Popup для website предлагает интуитивно понятную настройку, которая может быть выполнена без кода. Запатентованный редактор powr editor позволяет настраивать wysiwyg (то, что вы видите, то и получаете), позволяя вам делать Popup обновления в реальном времени на вашей действующей странице hosting service.
Легко настраиваемый
Каждая деталь, такая как шрифты, цвета, границы и интервалы, может edited сделать ваш бренд индивидуальным shine.
Мобильный Отзывчивый
Дизайн автоматически адаптируется и выглядит flawless на любом мобильном устройстве, планшете или в веб-браузере.
Кодирование не требуется
Просто скопируйте и вставьте его на свой Elementor веб-сайт.
Поскольку powr рассчитан на масштабирование, он имеет самые передовые встроенные средства безопасности и доступные возможности большого объема.
and to top it off, доступна служба поддержки all day every day, as is the справочный центр .
Кроме того, наша команда опытных инженеров работает круглосуточно, чтобы приложения powr, такие как ваш Elementor Popup, работали на вас.
Встраивание приложения Popup на ваш сайт Elementor никогда не было проще
Создайте свое собственное приложение Popup Elementor, подберите стиль и цвета своего веб-сайта и добавьте Popup на свою страницу Elementor, пост, боковую панель, нижний колонтитул или где угодно на своем сайт.
most importantly, powr Popup имеет certified результатов. тематические исследования показали, что конверсии от powr Popup до increase превышают 30%!
Доверие миллионов
Мы обеспечиваем качество, о чем свидетельствуют более 12 387 отзывов.
1200348
Установок a Popup
8230145
ПЛАГИНЫ НА САЙТАХ
Просто
Легко ориентироваться для нетехнического человека, как я. перепробовал так много приложений, и это лучшее сочетание отличных функций для любого магазина.
Пасар Сегар | Свежий рынок в Form Builder
Это приложение было бесшовным
Это помогло мне привлечь трафик на мой сайт и привлечь больше платформ! я очень рекомендую всем!
Это приложение было бесшовным
Я был удивлен, что shopify не имеет встроенной функции для чего-то подобного, но рад, что ваше приложение отвечает всем требованиям.
Если вы все еще find it unbelievable, то take a look at то, что есть у rbia shades, компании по производству солнцезащитных очков, designs ручной работы в деревянных рамах, seen in their business.
За just months подписку с помощью всплывающего окна powr они смогли grow расширить свои контакты более чем на 250% (более 600 реальных контактов) и steadily расширили свои социальные сети до более 6000 подписчиков, использующих powr social кормить на их сайте. они added powr slider как визуальный способ быстро показать своим клиентам, поскольку они являются coming to домашней страницей, как продукты выглядят в реальной жизни. он хорошо демонстрирует их продукты и беспрепятственно дает клиентам отличный опыт работы на месте. фактически они reported, что посетители, которые взаимодействовали с приложениями powr на их сайте, были вовлечены в 2,5 раза дольше, чем любой другой человек на их сайте.
Через несколько месяцев после publicizing своего бизнеса на местных ярмарках и ремесленных выставках rbia shades искала способ продавать товары в интернете. они wanted, чтобы показать посетителям качество своего продукта, свой легкий и эргономичный дизайн в привлекательной визуальной форме. их website не предоставили для этого адекватного решения. они попробовали different third-party apps, прежде чем нашли powr slider, и ни один из них не выглядел как часть сайта, был неуклюжим и трудным в использовании.