Получите всплывающее окно для своего сайта
Вы также можете добавлять всплывающие окна на свой сайт с помощью виджетов или плагинов, например, Всплывающее окно от Elfsight. Неважно, какую платформу вы используете — WordPress, Shopify, Magento, Woocommerce или Joomla — для каждой из них найдется свое всплывающее окно.
Выбрав виджет всплывающего окна для своего сайта, вы получите следующие преимущества:
- Объявляйте о распродажах, специальных предложениях, собирайте отзывы и подписчиков.
- Выбирайте, на каких страницах вашего сайта будет отображаться всплывающее окно.
- Выбирайте, на каких устройствах всплывающее окно будет активно для ваших пользователей.
- Создайте привлекательный визуальный дизайн, который идеально впишется в ваш сайт.
Выберите лучший шаблон и создайте свое всплывающее окно прямо сейчас!
Виджет Popup работает со всеми платформами, которые позволяют встраивать элементы HTML в код, включая Joomla, GoDaddy, Drupal, OpenCart, Wix, PrestaShop, Jimdo и Blogger. Теперь, когда вы знаете, что такое всплывающее окно и какие преимущества оно может принести вашему сайту, давайте узнаем, как его создать и добавить.
Почему всплывающее окно важно
Всплывающие окна уже давно используются маркетологами. Например, окна автоматически открывались после закрытия, и их нельзя было удалить, пока не было выполнено целевое действие. В прошлом мошенники использовали всплывающие окна для внедрения вредоносного ПО.
К счастью, негатив вокруг всплывающих окон постепенно спадает. При правильном использовании всплывающие окна являются ценным маркетинговым инструментом. Например, SUMO проанализировал 2 миллиарда всплывающих окон и обнаружил, что их коэффициент конверсии может достигать 40% и более. Самое главное здесь — правильно использовать этот инструмент.
BlogMarketingAcademy утверждает, что всплывающие окна на сайте показали лучший показатель кликабельности по сравнению с другими видами рекламы — около 2%. А BitNinja увидел 114%-ный рост конверсий после внедрения всплывающих окон на своем сайте.
Как добавлять всплывающие окна в HTML-код
HTML помогает пользователям создавать веб-страницы и веб-сайты для любых целей. Создание веб-сайта может показаться простым, и это так, но добавление некоторых дополнительных элементов, таких как всплывающее окно, в HTML-код сайта может оказаться не таким уж простым. Вот где могут пригодиться некоторые сторонние решения, такие как Elfsight Popup. Давайте рассмотрим, как добавить код HTML-сайта во всплывающее окно.
Ниже приведены шаги, которые необходимо выполнить, чтобы всплывающее окно работало на вашем HTML-сайте:
- Создайте и настройте свой уникальный всплывающий виджет с помощью конфигуратора. Вы можете добавить любой контент во всплывающее окно, включая другие элементы HTML.
- После того, как вы создали всплывающее окно для своего HTML-сайта, сохраните результаты.
- Скопируйте код виджета из появившегося поля.
- Вставьте скопированный код всплывающего окна в поле HTML вашего сайта.
Вот и все, ваше всплывающее окно готово, и все, что вам теперь нужно сделать, это проверить, правильно ли оно работает на вашем HTML-сайте. Однако, если вам нужно вставить другой элемент HTML в ваш всплывающий виджет, ознакомьтесь с этими инструкциями:
- Откройте конфигуратор виджетов и перейдите в раздел HTML.
- Выберите блок HTML, который нужно добавить во всплывающее окно.
- Вставьте код HTML элемента, который вы хотите отобразить в виджете, в раздел кода HTML.
Подробнее о добавлении всплывающих окон на ваш HTML-сайт и о том, как с ними работать →
Обратите внимание, что некоторые CMS может не позволить вам добавить HTML-код для установки виджета Elfsight. Здесь вам может потребоваться преобразовать код установки. Давайте посмотрим, как это сделать с помощью iFrame.
40+ отличных шаблонов всплывающих окон для вашего сайта
А теперь давайте рассмотрим несколько интересных примеров шаблонов всплывающих виджетов для вашего сайта. Это может быть особенно полезно для пользователей, которые не знают, с чего начать, и ищут вдохновения.
Всплывающее окно с намерением выйти
Всплывающее окно с намерением выйти появляется на веб-сайте в тот момент, когда пользователь собирается нажать кнопку закрытия.
Всплывающее окно уведомления
Всплывающее окно уведомления полезно в самых разных ситуациях — от уведомления о начале скидок до запуска распродажи.
Всплывающая форма
Всплывающая форма позволяет вам выполнять самые разные задач, таких как сбор адресов электронной почты или отзывов от ваших пользователей.
Не забудьте ознакомиться с другими более 40 великолепных шаблонов всплывающих виджетов. Вы обязательно найдете тот, который соответствует вашим потребностям!
Как установить всплывающее окно в iFrame
Ниже приведены шаги, которые необходимо выполнить для преобразования установочного кода всплывающего окна Elfsight в формат iFrame:
- Перейдите в приложения Elfsight, настройте свой всплывающий виджет и получите его установочный код.
- Скопируйте идентификатор виджета. Вы можете найти их здесь:
3. Преобразуйте код. Используйте следующий код, заменив «WIDGET_ID» на свой собственный идентификатор виджета:
<iframe src='https://sandbox.elfsightcdn.com/WIDGET_ID' width='100%' height='1000' frameborder='0'></iframe>4. Отрегулируйте высоту в соответствии с размером виджета.
Вот и все! Это все, что вам нужно сделать, чтобы преобразовать код всплывающего окна в формат iFrame. Также могут быть ситуации, когда вам нужно встроить блок iFrame во всплывающий виджет. Например, iFrame можно использовать для реализации различных типов элементов iFrame через URL. Давайте подробнее рассмотрим, как добавить блок iFrame в ваш всплывающий виджет:
- В конфигураторе всплывающих окон в приложениях Elfsight откройте «Блоки» и выберите iFrame.
- Установите правильные настройки для этого блока:
- URL. Введите в это поле ссылку, которая будет преобразована в iFrame.
- Ширина используется для настройки ширины элемента iFrame во всплывающем окне.
- Раздел Высота позволяет изменить высоту iFrame по умолчанию.
