AMP-формы на примере опроса EMX
Вместо тысячи догадок - лучше один раз прямо спросить у подписчика.
EMX в одном из своих писем решили спросить мнение подписчиков о рассылке:
Рассмотрим поэтапно как создавалось это письмо.
Для начала, чтобы создать общую структуру формы, необходимо перейти в компоненты/amp-form/добавить.
Перетаскивая блоки в нижнюю часть строим желаемую структуру. В поле “системное имя” необходимо указать системное названия поля, используя латинские символы и цифры, а в названии поля выводимое пояснение для пользователя.
Некоторый вопросы в данном случае нужно сделать обязательными для заполнения, для этого кликаем на шестеренку и в выпадающем списке проверки выбираем “обязательное”
Заполнив все поля сохраняем получившуюся форму.
Сразу после этого будет сформирован код для вставки формы в письмо или же можно скачать полный код amp-письма, состоящего из этой формы.
На этом можно было бы остановиться - в коде уже есть и проверка заполненности обязательных полей, и отображение сообщения об успешной отправки формы и возможность просмотра и выгрузки результатов, но в письме EMX стандартную форму amp4email немного переработали.
Здесь видоизменен вывод ошибок - вместо отображения ответов сервера, как предлагается по-умолчанию, был добавлен обработчик для form
on="submit-error: AMP.setState({'errors': 'errors'})Данное состояние используется для вывода класса, через который организована подсветка обязательных полей.
При успешной же отправки формы также используется изменение состояния, по факту которого отображается блок с предложением скачать подарок:
<form method="POST" on="submit-success: AMP.setState({'submited': 'submited', confForm44: true}); submit-error: AMP.setState({'errors': 'errors'})" action-xhr="https://amp4email.ru/amp/post/44?key=XXX&format=json">
Результаты
Больше половины подписчиков (50,82%) увидело AMP-версию письма.
38% пользователей заполнили и отправили форму
В сравнении с прошлым кейсом, здесь ощутимо подрос процент уникальных открытий amp-версии письма (50,82% против 45,52%). Это связано, главным образом с тем, что mail.ru починили отображение amp-писем в своем приложении на iOS.
AMP-версии
и отправили форму
И теперь можно с уверенностью сказать, что AMP - это эффективный инструмент сбора обратной связи с подписчиков, который работает у большей половины подписчиков.