Як створювати та додавати попапи у WordPress

Віджети входять до 10 найкращих тактик і технологій, які підвищують ефективність email-маркетингу, тому не дивно, що ви зацікавлені в тому, як створити попап у WordPress. Спойлер: це дуже просто.

У цьому керівництві ми проведемо вас через покроковий процес створення кастомних віджетів у нашому конструкторі попапів для WordPress і покажемо, як додати попап на WordPress сайти. Ми також поділимося порадами, які допоможуть вам збільшити конверсію (підписку на розсилку, реєстрації, продажі тощо) на 110%, згідно з результатами нашого клієнта. Отже, до роботи!

Переваги використання плагіна для попап-повідомлень у WordPress

Створення форм підписки на сайті, сповіщень або рекламних оповіщень з використанням плагіну попап-форм для WordPress надає ряд переваг, які можуть покращити користувацький досвід, взаємодію та рівень конверсії вашого сайту. Ось розбиття ключових переваг.

Нативний підхід. Плагін контактної форми розроблений спеціально для WP, що забезпечує його бездоганну інтеграцію з існуючою структурою вашого WordPress сайту, темою та іншими плагінами. Крім того, він може ефективно використовуватись разом з WP попап-формою для покращеної функціональності та взаємодії. Така сумісність зменшує ризик конфліктів або проблем, які можуть виникнути при використанні сторонніх інструментів для додавання попапів.

Централізоване управління. Використовуючи плагін попапів, всі функціональності вашого сайту, включаючи попапи, керуються з панелі інструментів WordPress. 

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

Присвячена підтримка. Плагіни WordPress зазвичай мають підтримку з боку розробників, також можна знайти допомогу у WP спільноті. Ця підтримка може бути більш адаптивною та обізнаною щодо специфічних для WordPress питань.

До речі, у нас є детальний огляд найкращих плагінів для попапів WordPress 2024 року. Стаття допоможе вам зорієнтуватися в плюсах і мінусах популярних плагінів для попап-форм у WordPress.

Регулярні оновлення. Плагіни Popup maker часто оновлюються, щоб забезпечити сумісність з останньою версією WordPress, забезпечуючи вам постійні технічні покращення та патчі безпеки.

Як створити і додати попап-форму в WordPress (6 простих кроків із Claspo)

Якщо ви цікавитесь, як створити попап-сторінку у WordPress без головного болю та високих витрат, ви потрапили за адресою! З Claspo надзвичайно легко і навіть весело створювати попап-форму у WordPress і додавати її на ваш сайт лише за кілька кліків. 

Завдяки нашим готовим шаблонам та зручному редактору з функцією drag-and-drop, ви можете створити спливаючу форму для WordPress всього за кілька кліків — без залучення розробників чи дизайнерів. Незалежно від того, чи хочете ви створити форму збору контактів, показати промоакцію або збільшити список розсилки, Claspo робить це швидко та інтуїтивно зрозумілим. Насправді, ви можете налаштувати ваші спливаючі форми WordPress менш ніж за п'ять хвилин.

Хочете підтвердження? Давайте створимо спливаючу форму WordPress у кілька кроків. 

Крок 1: Оберіть Шаблон — економте час і бюджет

Наша бібліотека містить більше 1000 готових шаблонів віджетів для різних завдань — від простих інструментів до просунутих макетів спливаючих форм WordPress з кнопками, що привертають увагу, включаючи сценарії, які активуються натисканням кнопки WordPress. Для вашої зручності, ми розділили їх на 36 сценаріїв використання. Додатково, ви можете фільтрувати дизайни за макетом, індустрією та темою. Це дозволяє швидко знайти найкращий спливаючий елемент для WordPress, базуючись на ваших конкретних цілях, та налаштувати шаблон за допомогою нашого редактора спливаючих елементів WordPress.

Налаштування готового шаблону заощаджує вам гроші на роботу дизайнера при створенні спливаючої форми WordPress для розсилки. Розташування полів і елементів форми, їх кількість, розмір і шрифти — все налаштовано на досягнення найкращих результатів від вашого повідомлення. Потрібні натхнення чи ідеї для ваших спливаючих елементів WordPress? Перегляньте ці приклади захоплюючого копірайтингу.

Крок 2: Налаштуйте будь-який елемент віджета

Наступним кроком давайте розглянемо, як створити спливаючу сторінку в WordPress, змінюючи різні елементи шаблона віджета. Завдяки розширеним інструментам, створення чудової користувацької контактної спливаючої форми неймовірно легке — навіть якщо ви використовуєте безкоштовне рішення для спливаючих елементів WordPress, таке як Claspo.

Виберіть кольори та стиль

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

Проте, у редакторі Claspo ви легко можете налаштувати колір і стиль:

• кнопок заклику до дії,
• заголовків,
• основного тексту,
• значка закриття,
• фону і так далі.

Також зверніть увагу на радіокнопки, які дозволяють виконувати первинну сегментацію підписників безпосередньо в спливаючому вікні WordPress. У нашому прикладі, користувачам пропонуються два варіанти отримання персоналізованого вмісту електронної пошти. Ви також можете використовувати прапорці й випадаючий список для цієї мети.

Наші шаблони підписки на розсилку також мають додаткові екрани, які відображають статус підписки: успішно, вже підписаний та помилка. Це перший пункт прямого спілкування з вашим підписником, що знімає будь-які сумніви щодо успішності дії. Наш конструктор попапів для WordPress дозволяє швидко їх налаштувати.

Додавання зображень у попап для WordPress

Цікавитесь, як створити вікно попап у WordPress, яке приверне увагу відвідувачів? Додайте зображення. 40% споживачів найбільше цінують зображення у дизайні вебсайту. У конструкторі Claspo ви можете додавати медіафайли таких форматів:

• PNG 
• JPEG 
• SVG 
• GIF
• WebP
• AVIF

Немає зображення? Не проблема. У нашому редакторі є бібліотека зображень і іконок. Знайти потрібне легко, ввівши ключове слово в пошукове поле.

Інший цікавий елемент дизайну попапів, який ви можете знайти у нашому редакторі, це плаваючі зображення. Завдяки цій функції ви можете розмістити зображення у будь-якому місці віджета, наприклад, зліва, по нижньому краю, у верхньому правому куті і т.д. Таким чином, ви можете створити нестандартний попап у WordPress з унікальними формами та більш тривимірним виглядом.

Насолоджуйтесь відеопрогравачем попапів для WordPress

Бажаєте дізнатися, як створити попап-сторінку у WordPress, яка відтворює відео? З Claspo ви можете зробити це у декілька кліків. Просто додайте посилання на відео YouTube, і воно з\'явиться в попапі.

Для відтворення відео ви можете вибрати між відтворенням за ініціативою користувача (клік користувача) або автоматичним відтворенням.

Важлива примітка: Автовідтворення за замовчуванням вимикає звук відео через обмеження браузерів на автозапуск звуку. Користувачі можуть ввімкнути звук у будь-який час.

Увімкніть багатомовність: розмовляйте мовою своїх клієнтів

Ви працюєте на глобальному ринку або в країні з кількома основними мовами і цікавитеся, як додати форму попапів у WordPress, що підтримує багатомовність? Claspo має рішення для вас. Завдяки нашій функції багатомовності мова віджета автоматично підлаштовується під браузери ваших відвідувачів або заздалегідь обрану мову сайту, забезпечуючи плавний користувацький досвід у різних регіонах. 

Не потрібно створювати попап у WordPress з кількома версіями; просто додайте іншу мову прямо в редакторі. Наш конструктор попапів автоматично перекладає ваш текст на мову доданої версії, і все, що вам потрібно, це зробити кілька налаштувань.

Використовуйте елементи, що підвищують конверсію

Хочете підвищити коефіцієнт конверсії? Плагін модального вікна для WordPress дозволяє створювати попапи з елементами високого впливу та розумними полями, які спонукають користувачів до дій. Ось деякі з найбільш ефективних компонентів, які варто включити.

Відносний таймер зворотного відліку

Підвищуйте конверсію спливаючих вікон WordPress за допомогою FOMO: створіть відчуття терміновості за допомогою наших персоналізованих таймерів зворотного відліку, які починаються індивідуально для кожного відвідувача. Це забезпечує всім чесний шанс на вашу пропозицію, максимізуючи охоплення та конверсію. Як тільки відносний таймер зворотного відліку у користувача закінчується, пропозиція зникає лише для нього, але інші відвідувачі сайту все ще можуть переглядати повідомлення про спливаючий віджет WordPress на вашому сайті.

Вбудований промокод

Додайте промокод у спливаюче вікно електронної пошти WordPress, щоб перетворити відвідувачів вебсайту на підписників і покупців. Клієнти можуть скопіювати промокод безпосередньо з віджету та застосувати його під час оформлення замовлення. Наприклад, ви можете запропонувати відвідувачам одноразовий промокод і запросити їх підписатися для отримання персоналізованих пропозицій та знижок пізніше. Залучайте користувачів промокодом для знижки або безкоштовної доставки. До речі, відповідно до досліджень, 81% споживачів вважають безкоштовну доставку найпривабливішою акцією.

Віджет-слайдер

Слайдер - це тип попапу з кількома прокрученими екранами. Представте все, що вам потрібно, в одному вікні замість того, щоб дратувати ваших користувачів кількома спливаючими вікнами. Використовуйте слайдер для:

• Додавання необмеженої кількості зображень або відео в одне спливаюче вікно.
• Просування кількох пропозицій або продуктів.
• Демонстрації різного використання одного товару.
• Представлення нових функцій та багато іншого.

Опитування на вихід 

Один з найпоширеніших способів збирання підписок - це спливаюче вікно на вихід з WordPress, де відвідувач, який залишає сайт, отримує пропозиції знижок, подарунків або інших бонусів для заохочення до цільової дії, в цьому випадку підписки. 

Ми також пропонуємо опитування на вихід

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

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

Запуск спливаючого вікна

Існує міф, що спливаючі вікна дуже дратівливі, але це стосується будь-якого маркетингового каналу, використаного необдумано. Налаштовуючи спливаюче вікно на сайті WordPress, розгляньте можливість додавання запуску до вибраного шаблону. Це може бути іконка або кнопка, яку користувач може натиснути, щоб відкрити віджет. Оскільки запуск невеликий, він займає мінімальну площу екрану, не блокуючи контент і не дратуючи користувача. Проте він може містити коротку, привабливу пропозицію, щоб зацікавити відвідувачів і стимулювати їх відкрити повнорозмірне спливаюче вікно контактної форми WordPress або будь-який інший віджет.

Ви можете вибрати запуск із наших шаблонів і налаштувати його зміст та дизайн відповідно до вашого віджету. Далі підключіть його до бажаного спливаючого вікна.

Редагуючи будь-який віджет, ви можете швидко переключатися між настільним та мобільним режимами та налаштовувати, як контент буде відображатися на різних екранах. На заключному етапі редагування спливаючого вікна натисніть кнопку перегляду в реальному часі, щоб переконатися, що все виглядає ідеально.

Крок 3: налаштуйте правила відображення та таргетинг

Ще один важливий крок при створенні спливаючого вікна на WordPress - це встановлення зручних для користувачів правил відображення віджетів (або тригерів). Ви можете налаштувати їх для запуску або, якщо ви його не використовуєте, безпосередньо для спливаючого вікна.

Віджети Claspo мають попередньо визначені правила відображення, такі як час і частота появи віджета, тож ви можете бути впевнені, що вони не є нав'язливими. Проте ви можете налаштувати тригери на основі поведінки ваших відвідувачів і встановити, щоб віджет активувався лише тоді, коли всі задані умови будуть виконані.

Наприклад, ви можете налаштувати, щоб спливаюче вікно показувалося лише новим користувачам, які ще не підписалися. Це забезпечить, що люди в вашому списку розсилки не побачать пропозицію. Крім того, для покращення користувацького досвіду для тих, хто ще не підписався, ви можете налаштувати, щоб віджет припинив відображатися, якщо користувач закриє його один або більше разів.

Унікальні функції Claspo для ненав'язливого відображення

Ви не хочете відволікати своїх відвідувачів занадто великою кількістю спливаючих вікон у WordPress. Для цього у нас є попередньо визначені правила відображення віджетів.

Інтервал тиші.

Встановіть буферний час між відображенням віджетів, щоб уникнути перевантаження відвідувачів. Стандартний інтервал у 3 хвилини забезпечує плавний перегляд, але його легко налаштувати. Однак у налаштуваннях спливаючого вікна ви можете налаштувати цю умову на основі середнього часу, який відвідувачі проводять на вашому сайті чи конкретних сторінках.

Захист від накладень. Зосередьтеся на створенні чудового контенту, а не на управлінні правилами відображення віджетів. Claspo автоматично запобігає зіткненню спливаючих вікон на екранах відвідувачів, навіть за наявності однакових правил відображення.

варіанти таргетингу

Ви можете персоналізувати досвід відвідувачів, орієнтуючись на конкретні сегменти. Claspo пропонує кілька підходів до цього.

Ідентифікація новачків. Claspo дозволяє додати спливаюче вікно до WordPress і відображати його винятково для відвідувачів, які вперше відвідали сайт.

Геотаргетинг. Налаштовуйте віджети для конкретних аудиторій - від цілих країн до регіонів і міст. 

Таргетинг за UTM. Якщо ви використовуєте UTM-теги в різних кампаніях і рекламних повідомленнях, додайте їх під час налаштування віджету. Тоді він буде відображатися лише для тих відвідувачів, які прийшли на сайт з певного джерела трафіку.

Тип пристрою. Укажіть, на яких пристроях має відображатися спливаюче вікно: настільних комп’ютерах, мобільних пристроях або на обох. Останній варіант встановлено за замовчуванням.

Крок 4: Інтегруйте плагін Claspo з вашим маркетинговим програмним забезпеченням

Дані, зібрані контактною формою у спливаючому вікні в WordPress, слід перенести в базу контактів для подальшого використання в маркетингових цілях, таких як сегментація, надсилання триггерних електронних листів або повідомлень тощо. Claspo гармонійно інтегрується з багатьма популярними ESP, CDP і CRM — просто оберіть необхідний сервіс із випадаючого списку та швидко інтегруйте.

Інтеграція Claspo з будь-якою маркетинговою системою, яку ви використовуєте через Zapier, така ж проста.

Крок 5: Легко інтегруйте Claspo з WordPress

Отже, ви створили гарний віджет. Тепер настав час дізнатися, як додати форму спливаючого вікна в WordPress, і це легше, ніж ви думаєте.

Найпростіший спосіб — використати плагін Claspo для WordPress, який автоматично встановлює скрипт на всі сторінки вашого сайту. Просто виконайте ці швидкі кроки:

1. Під час онбордингу, коли ви будете готові опублікувати віджет, виберіть Встановити через WordPress у вікні Перед публікацією віджету.

Пропустили цей крок? Не проблема. Просто перейдіть до Скрипт → Встановити скрипт у вашому обліковому записі Claspo, перейдіть до WordPress і натисніть Встановити.

2. У вікні, що з'являється, натисніть Копіювати ID, щоб зберегти свій унікальний ID скрипта; він вам знадобиться через хвилину. Після цього натисніть Перейти до WordPress, щоб перейти до сторінки плагіна.

3. Тепер вам потрібно Завантажити файл плагіна Claspo.

4. У вашій панелі WordPress перейдіть до Плагіни → Завантажити плагін, після чого завантажте файл, який ви щойно завантажили.

Ви можете перетягнути його у виділену область або вибрати вручну і натиснути Відкрити.

5. Після завершення встановлення ви побачите Claspo у меню зліва.

6. Натисніть Claspo, вставте ID скрипту, який ви раніше скопіювали, у поле Ввести ID скрипту, і натисніть Підключити.

7. Готово! Скрипт Claspo тепер активний на всіх сторінках вашого сайту.

Хочете перепровірити? Поверніться до вікна Встановлення скрипту за допомогою WordPress у вашому акаунті Claspo і натисніть Перевірити, щоб підтвердити, що все працює.

Скрипт буде автоматично додано на всі сторінки вашого сайту. Так просто!

Крок 6: Перевірте та опублікуйте форму

Після того як ви успішно встановили скрипт, який додає спливаюче вікно до WordPress, ви можете використовувати режим тестування, щоб побачити, як віджет працює на вашому сайті. У цьому випадку його бачите лише ви. Якщо ви повністю задоволені результатом і переконалися, що він правильно відображається на різних пристроях і браузерах, переходьте до публікації форму підписки на спливаюче вікно. Тоді насолоджуйтеся збільшенням конверсій, яке принесе кампанія із спливом. 

Легко подолати виклики WP Popup

Створення та інтеграція різних попапів часто є викликом для власників сайтів на базі WordPress та email-маркетологів. До цих викликів входять підтримка візуальної привабливості, залучення користувачів без втручання, запуск модальних попапів WordPress для підписки без відволікання від основної конверсії, робота з мультимовною аудиторією тощо. Ми пропонуємо найкращі рішення для всіх цих проблем. Крім того, всі наші користувачі мають доступ до розширених функцій, таких як вбудоване A/B тестування. З його допомогою ви можете експериментувати з такими параметрами, як: розміщення (на всьому сайті або на певній сторінці), CTA, копірайтинг, дизайн елементів, тригери (затримка в часі, намір виходу, тригер кліку тощо) та інші.

Створення вражаючих попапів, які відповідають бренду вашого сайту, займає лише шість кроків і кілька хвилин. Тож спробуйте Claspo сьогодні і переконайтеся, як створення та управління попапами в WordPress ніколи не було легшим та ефективнішим. Особливо тому, що наша безкоштовна версія на все життя не обмежує вашу креативність, а навпаки стимулює блискавичний успіх. Усі шаблони та розширені можливості, такі як A/B тестування або гейміфікація, які доступні лише в платній версії інших сервісів, відкриті для користувачів нашого безкоштовного плану. Тож сміливо обирайте шаблон попапа та легко створюйте свій попап!