Сервіс даних Stripo, або як спростити створення AMP-форм

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

Вступ або для чого потрібні AMP листи

Досить часто ми просимо користувачів оцінити нас, залишити відгуки та коментарі, просимо поділитися контактною інформацією, віком, статтю тощо. Форми та анкети є невід'ємною частиною email-маркетингу.

Чому саме AMP? Наші тести показали, що конверсія AMP-листів у 5 разів вища порівняно з конверсією звичайних HTML-листів.

Поспішаємо поділитися цими результатами з вами.

Сервіс даних Stripo: для чого він потрібен і як ним користуватися?

Використовуючи революційні AMP-форми, ви можете збирати адреси електронної пошти, номери телефонів, використовувати чекбокси і навіть вимірювати NPS в розсилках — все це робиться в листах.

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

Ми в Stripo робимо це за вас: ми даємо вам змогу створювати сервіси даних лише кількома кліками (без навичок програмування), де ви зберігатимете всі відповіді користувачів. Ви маєте доступ до них у будь-який час!

Тепер давайте створимо сервіс даних і використаємо його в нашому листі з AMP-формою.

Готові спробувати? Давайте зробимо це разом...

Крок 1. Створення нового сервісу

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

Варіант 1. Вибір сховища даних Stripo

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

Отже, щоб побудувати новий сервіс за допомогою Stripo, вам потрібно:

• в акаунті Stripo перейдіть до вкладки «Дані», яка знаходиться в лівій частині екрана;

• у новому вікні виберіть вкладку «Сервіси»;

• клікніть на кнопку «+ Створити сервіс».

• з'явиться «Вікно конфігурації сервісу». Тут потрібно лише дати назву вашому сервісу даних та ввести короткий опис, перше є обов'язковим, друге — опціональним;

• всі інші поля заповнюються автоматично;

• скопіюйте URL для майбутньої кампанії.

Важно зазначити:

Ми рекомендуємо вам назвати цей сервіс так само, як і назву своєї email-розсилки. Ми вважаємо, що це полегшить вам пошук і аналіз необхідних даних у вашому акаунті Stripo після завершення розсилки.

• у секції нижче активуйте кнопку «Сховище Stripo».

Варіант 2. Вибір Zapier в якості сховища даних

Щоб використовувати Zapier як сховище даних, вам потрібно виконати всі кроки, описані вище, але замість вибору Stripo у якості сховища даних ви повинні:

• виберіть «Зовнішні сховища»;

• вставити посилання на ваш Zapier Webhook — зараз ми його створимо.

Створення Zapier Webhook

Zapier пропонує широкий асортимент запсів (з'єднань).

Оскільки я хочу зберігати всі відповіді користувачів у Google Sheets, мені потрібно підключити Stripo до Zapier, а Zapier — до мого Google Drive.

Давайте це зробимо:

• у своєму акаунті Zapier у верхньому лівому кутку натисніть кнопку «Зробити Zap»;

• задайте йому назву;

• в секції «1. Коли це відбувається» вибрати «Вебхуки від Zapier»;

• в якості тригера виберіть «Зловити хук»

• клікніть «Продовжити»;

• у новому вікні клікніть на URL вебхука, яке Zapier щойно згенерував для вас;

• потім поверніться до Stripo і вставте це посилання у відповідне поле;

• тепер, будь ласка, скопіюйте URL нашого Сервісу даних;

• вставте його у форму — ви повинні замінити існуюче посилання на URL Сервісу даних;

• тепер давайте повернемося до Zapier;

• тут ми «пропускаємо» тести і натискаємо «Продовжити», оскільки нам поки що нічого тестувати;

• тепер у секції «2. Зробити це» обираємо «Google Sheets» — щоб їх знайти, потрібно ввести в пошуковому рядку Google або Sheets;

• тепер потрібно вибрати потрібну подію дії — для нашої мети нам потрібна опція «Створити рядок таблиці»;

• клікніть «Продовжити»;

• введіть свої облікові дані до акаунта Google;

• надайте Zapier доступ до вашого Google Drive;

• Zapier автоматично додасть ваш акаунт Google Drive до списку. Вам навіть не потрібно нічого вибирати;

• попередньо ви побудували Google Sheet з усіма необхідними стовпчиками. Моя мета — зібрати оцінки та відгуки. Звичайно, мені також потрібно знати, хто з реципієнтів нас оцінив. Отже, ось як виглядає моя таблиця:

• налаштуйте свою таблицю: вам потрібно вибрати «Диск», «Електронна таблиця», тобто створену вами Google Sheet, та робочий аркуш. Я обираю «Аркуш 1», оскільки хочу зберігати всі дані на одній сторінці.

• Zapier витягує назви полів з вашої таблиці;

• Zapier витягує дані з вашої AMP-форми (як ми вже говорили, ми будемо збирати адреси електронної пошти, рейтинги та відгуки);

• нам потрібно вибрати необхідні «значення» для відповідних полів;

• натисніть «Продовжити»;

• запустіть цей тест, будь ласка, щоб перевірити, чи правильно було встановлено з'єднання;

• якщо тест пройшов успішно, натисніть «Готово» та увімкніть Zapp.

Важливо:

Ми показали, як зберігати дані у нашому Сервісі та зберігати дані на зовнішньому сервісі (Zapier). Але за бажанням ви можете обрати і те, і інше. Просто перемкніть ці обидві опції:

Крок 2. Робота над AMP-формами

Тепер, коли ми маємо кінцеву точку, давайте перейдемо до створення цих AMP-форм.

Важливо зазначити:

Вищезгадана форма буде працювати лише для тих адресатів, чиї поштові клієнти вже підтримують AMP — Gmail та Mail.ru, як на десктопних, так і на мобільних екранах. Інші користувачі побачать запасний варіант, який ми разом створимо пізніше.

Наразі в Stripo існує три способи створення AMP-форм:

Спосіб 1. Створення AMP-форм за допомогою Drag-n-Drop блоків

Це, напевно, найпростіший спосіб.

Спосіб 2. Вбудовування amp-компонентів від Google AMP dev

Google надає нам усім можливість вбудовувати AMP-компоненти. Дотримуйтесь інструкцій на відповідній сторінці та вбудовуйте свою форму в наш шаблон.

Але для мене це трохи складно, тому я вважаю за краще не використовувати цей спосіб.

Спосіб 3. Використання модулів Stripo

Що ж, тепер це набагато простіше.

Після того, як ваш шаблон буде готовий, ви повинні:

• перейти до секції «Модулі»;

• ввести в консолі пошуку «Форма»;

• перетягнути вибраний модуль до свого шаблону;

• змінити його на свій розсуд;

Увага: не вносьте жодних змін до ⚡HTML частини цього модуля, оскільки це може вплинути на роботу вашої AMP-форми.

• клікніть на ⚡HTML частину цього модуля, щоб відкрити його код;

• вставте URL, яке ви скопіювали при створенні сервісу даних на кроці 1;

• вставте його, як показано на GIF-ці нижче;

• тепер ця форма буде збирати оцінки та відгуки. Але нам потрібно знати, хто їх надіслав. Тому для того, щоб отримувати електронні адреси, нам потрібно вбудувати цей зразок коду в нашу форму:

<input type="hidden" name="email" hidden value="%EMAIL|%">

Він знаходиться після </label>.

Це поле є прихованим і заповнюється автоматично. Користувачам не потрібно вводити свої електронні адреси власноруч.

Важливо:

Зверніться до вашого ESP за merge-тегом, призначеним для відображення адрес електронної пошти. Ми використовуємо eSputnik, тому в нашому випадку цей тег має вигляд %EMAIL|%. Будь ласка, не вносьте жодних змін до решти цього коду вбудовування. 

• ваш лист готовий до збору відгуків та оцінок від користувачів :).

Важливо:

Ви можете протестувати ці форми навіть у режимі попереднього перегляду редактора. Якщо все зроблено правильно, ваш лист Google заповниться наступною інформацією:

Він показує merge-тег, оскільки ми тестували лист у режимі попереднього перегляду.

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

Спосіб 4. Використання наших готових шаблонів 

Я вважаю, що це найпростіший спосіб використання AMP-форм в листах. Вже сьогодні! Найближчим часом ми випустимо наш Drag-n-Drop блок для AMP-форм — про нього ми розповімо пізніше.

Отже, щоб скористатися нашими шаблонами, потрібно:

• відкрити цей шаблон у своєму акаунті;

Важливо зазначити:

Раніше ми говорили, що вам потрібно буде створити резервну HTML-версію цього опитування. Для цього шаблону вона не потрібна, оскільки він уже містить запрошення до опитування у форматі HTML.

• в шаблоні натисніть на ⚡HTML-форму;

• відкрийте редактор коду;

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

• якщо ви хочете також збирати адреси електронної пошти, будь ласка, вставте код вбудовування, як показано в секції «Спосіб 2». Але в цьому випадку він буде знаходитися після та перед.

Крок 3. Створення запасного варіанту

Ми опублікували лонгрід, в якому показали 10 найкращих листів із запрошенням до опитування та розповіли, як їх створювати за допомогою Stripo.

Тут ми покажемо три найкращі, на мій погляд, запасні варіанти. Всі вони абсолютно веб-безпечні:

Запасний варіант 1: Збір оцінок

Як ми вже говорили, користувачі можуть оцінити наш сервіс безпосередньо в листах:

• перетягніть 4-контейнерну структуру до свого динамічного шаблону — якщо ви хочете отримати рейтинг 1-5;

• включіть цю структуру тільки в HTML-версію;

• додайте до цієї структури ще один контейнер;

• вирівняйте ці контейнери;

• завантажте до кожного контейнера зображення з цифрами «1», «2», «3», «4», «5»;

• додайте ще одну структуру з відповідною кількістю контейнерів та введіть відповідні «оцінки» до кожного зображення — за бажанням;

• додайте до кожного зображення відповідні URL.

Ваш ESP надасть вам загальну кількість кліків по кожній «оцінці».

Запасний варіант 2. Рейтинговий сервіс

Ви можете просто запитати користувачів, чи задоволені вони вашою продукцією, вибравши з варіантів «Погано», «Добре» та «Чудово».

Зробіть це так, як описано у варіанті «Запасний варіант 1», з однією лише відмінністю — вставте 3-контейнерну структуру. І все.

Запасний варіант 3. Надання посилання на зовнішнє джерело

Якщо ви збираєтеся поставити користувачам кілька питань, в якості запасного варіанту ви можете запропонувати їм пройти опитування з кількома питаннями.

Створіть форму або на своєму сайті, або за допомогою Google Forms.

Після того, як ви це зробите і у вас буде посилання на це опитування:

• додайте в шаблон структуру з 1-го контейнера;

• розмістіть в ній базовий блок «Кнопка»;

• сформуйте дизайн кнопки;

• додайте своє посилання до цієї кнопки;

• додайте чіткий текст заклику до дії над кнопкою;

• розмістіть цю структуру тільки в HTML-листах.

Важливо зазначити:

Обидві версії ваших листів — AMP та HTML — будуть містити всі частини вашого шаблону, такі як хедер, банер, футер та контактну інформацію.

А у відповідних версіях ваших листів з'являться лише AMP HTML-форми та запасні варіанти HTML.

Крок 4. Попередній перегляд листів

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

Щоб перевірити AMP-тести в Gmail, будь ласка, додайте нашу електронну адресу — info@stripo-test.email — як надійного відправника.

Детальніше про те, як переглядати листи за допомогою Stripo, читайте в нашому блозі «Попередній перегляд і тестування листів за допомогою Stripo».

Крок 5. Перевірка результатів

Для того щоб побачити результати цієї кампанії, необхідно знову зайти до секції «Дані».

Знайдіть сервіс, який ви створили раніше.

Як бачите, він показує, скільки запитів було до кожного сервісу, а також час, коли було зроблено останній запит.

Клікніть на кнопку «Скачати CSV-файл».

Ось так.

Незабаром

У найближчій перспективі ви зможете:

Використовувати чекбокси в листах

Мрії збуваються :).

Додавання чекбоксів та рейтингів до листів без навичок програмування? Зовсім скоро ви зможете це робити!

Залишайтеся з нами ;).

Невеличка порада

Це лише дружнє нагадування. Щоб мати можливість відправляти AMP-контент, необхідно:

• потрапити до вайтлиста Google;

• виправити всі помилки, якщо такі виникнуть. Ви побачите їх у режимі попереднього перегляду (інакше користувачі побачать HTML-версію листа);

• додати до цього листа запасний варіант — HTML-версію. Про це ми говорили вище;

• переконатися, що ваш ESP/CRM вміє надсилати AMP-листи;

• мати на увазі, що наразі лише Gmail (як веб-версія, так і мобільні додатки на всіх ОС) вміють рендерити AMP-листи. Незабаром до них приєднається Yahoo;

• AMP-листи втрачають свої AMP-компоненти, якщо ви їх пересилаєте.

На завершення

Сервіс даних сьогодні допомагає отримати максимальну віддачу від AMP-розсилок, допомагає легко підключити ваші email-кампанії до сервісів даних без зовнішніх серверів, без необхідності налаштування CORS та з миттєвим доступом до результатів кампанії.