У каждого путешествия есть отправная точка, для посетителей вашего только что созданного веб-сайта все начинается с формы подписки. Вы можете продавать продукт в Интернете или просто создавать и делиться контентом в своем пользовательском блоге. В любом случае, всегда полезно дать посетителям возможность показать, что они заинтересованы в вашем продукте или контенте и что они хотят вернуться снова и снова. Более простой способ — предоставить им простую форму, чтобы закрыть этот пробел и создать мост между вами и их почтовым ящиком.
Раньше вам приходилось создавать целый рабочий процесс, который позволял бы отправлять форму на странице на ваш сервер, который затем сохранял бы данные в базе данных подписанных пользователей, с которыми вы могли бы позже запросить и связаться. С тех пор это стало намного проще, так как многие новые решения теперь доступны в виде услуги, которую, к счастью, вы можете интегрировать в ЛЮБОЙ веб-сайт и платформу!
Представляем конвертер
Одна из самых плавных интеграций, которую мне удалось осуществить и которая дала невероятные результаты, — это использование сервиса ConvertKit.
ConvertKit — это полный набор инструментов для создания и удержания аудитории. В их списке функций вы можете создавать автоматические воронки электронной почты для своих подписчиков, создавать невероятные шаблоны электронной почты в их редакторе и, конечно же, встраивать формы подписки по электронной почте на свой веб-сайт.
ConvertKit может бесплатно использовать большинство своих функций до 1000 подписчиков на бесплатном плане, что является отличной суммой для начинающих! Вероятно, к тому времени, когда вы достигнете этого порога, вы должны быть на пути к разблокировке большего. До тех пор вы можете собирать подписчиков и управлять ими через невероятную панель инструментов из своей учетной записи, не теряя контроля над эффективностью вашей целевой страницы!
Пошаговое руководство (5 мин.)
Хватит разговоров, пора запачкать руки (в коде). Теперь я покажу вам, как вы можете интегрировать регистрационную форму ConvertKit в свое приложение или на веб-сайт всего за несколько минут!
Шаг №1 — Создайте форму регистрации
На своей панели инструментов на странице Целевые страницы и формы нажмите "Создать новый".
На следующих страницах выберите Форма, после чего мы реализуем форму Встроенная. На следующей странице вы можете выбрать любую тему по своему вкусу, чтобы использовать ее в качестве шаблона для формы (вы можете отредактировать ее позже). В качестве примера я выбираю Клэр.
В редакторе форм можно настраивать все: от текста кнопок и цветов до добавления дополнительных полей и вставки в них собственного пользовательского CSS.
Шаг № 2 — Скопируйте свое творение
Если вы довольны результатом, нажмите Встроить вверху, затем выберите вкладку HTML и скопируйте все содержимое внутри.
Шаг № 3 — Добавьте форму на свой сайт
Теперь этот шаг разделен на две части. Во-первых, вам нужно добавить тег ‹script› и его содержимое в тело HTML-файла, где будет размещена эта форма, прямо внизу. Это должно выглядеть примерно так, как на картинке ниже:
Теперь, когда скрипт добавлен, форма сможет обмениваться данными с ConvertKit и правильно отправлять данные подписчиков.
Осталось только добавить тег ‹form› и все его содержимое в тело этой страницы, и вы готовы к работе! Чтобы добавить некоторые стили, вы можете написать CSS как обычно, используя правильные селекторы для результирующего HTML.
Примечание. Если вы используете React, вам необходимо адаптировать синтаксис HTML к JSX, где, например, теги ‹input› всегда должны закрываться символом '. /'.
Окончательные результаты
Вы можете посмотреть демо здесь и ознакомиться с исходным кодом на GitHub.
Надеюсь, к концу чтения у вас будет вот такая простая маленькая страничка. Если нет, то смело обращайтесь ко мне!
