Как создать email-рассылку в Tilda

Конструктор сайтов Tilda позволяет создавать email-письма из готовых блоков, спроектированных дизайнерами. Для этого достаточно вставить свой контент в интерфейс сервиса и получить красивое письмо, адаптированное под десктопные и мобильные устройства. Знать вёрстку и языки программирования не обязательно (но нужен сервис рассылок).

В Tilda можно создать письмо, но сразу отправить его получателям нельзя. Для отправки нужно регистрироваться в сервисе рассылок, например, в Unisender. Если проводить аналогию, то Tilda — это ручка, которой вы пишете письмо, а Unisender — почтальон, который это письмо доставит получателям.

Сервис рассылок можно интегрировать с Tilda. Тогда письма можно будет отправлять напрямую из интерфейса. А можно выгрузить HTML-код и использовать в почтовой программе. В статье расскажем, как создать email в Tilda и отправить его — с помощью внутренних инструментов и через Unisender.

Как создать письмо в Tilda

Редактор писем Tilda доступен только на платных тарифах, но его можно использовать бесплатно 2 недели — как на вновь созданных аккаунтах, так и на уже существующих, если до этого триал не был подключен. Чтобы перейти к конструктору писем, достаточно открыть раздел «Мои сайты», выбрать «Ещё» и в раскрывшемся меню — «Создать рассылку».

При создании рассылки вам предложат ввести её название. На странице можно подключить домен и установить нужные настройки. Рассылка может состоять из нескольких писем, поэтому нужно сначала создать рассылку, а затем — письмо. 

При выборе «Создать новое письмо» вам предложат выбрать один из 11 шаблонов. Пропустить этот этап нельзя. При этом сервис никак не ограничивает вашу фантазию — при помощи конструктора любой шаблон можно изменить до неузнаваемости или и вовсе целиком переделать, от порядка блоков до их внешнего вида.

Шаблоны рассчитаны под разные цели письма — от сообщения о распродаже до подборки кейсов и приглашения на вебинар. Наиболее простой шаблон — «Сообщение»: это просто картинка, текст и подпись. Если вы планируете выбрать шаблон и удалить все элементы, чтобы начать с нуля, выбирайте «Сообщение» — в нём меньше всего блоков.

Редактирование шаблона 

Все блоки в конструкторе поделены на четыре типа. 

• Письмо — здесь собраны основные составляющие тела письма, такие как заголовок, текстовые блоки, изображения, линии и отступы.
• Шапка — разные варианты хедеров для писем, от лаконичного с одним только логотипом до подзаголовков и описаний. Каждое описание можно сделать кликабельным, сформировав таким образом меню в шапке.
• Карточки могут использоваться как для создания карточек товаров, так и отдельных элементов письма-дайджеста. Некоторые поддерживают фоны, позволяя таким образом создать баннер. Есть также варианты со списками и иконками.
• Подвал тоже можно выбрать из нескольких варинатов, определив содержание и расположение логотипа.

По библиотеке блоков есть удобный поиск, который пригодится, если вы точно знаете, какой блок ищете:

Чтобы поменять текст шаблона или изображение, кликните на них и добавьте собственный контент. Также можно использовать меню «Контент» слева от выбранного блока.

Изображение можно перетащить из папки на компьютере, вставить ссылку или выбрать по кнопке «Загрузить файл». Картинки удобнее менять через меню кнопки «Контент», так как если на картинке стоит ссылка, то вам сначала будет открываться она, и только после — окно для загрузки.

Для редактирования кнопки в письме выберите раздел «Контент» и измените текст и ссылку.

В редакторе Tilda можно редактировать контент внутри блока. Для этого выберите пункт «Настройки».

Там можно поменять:

• выравнивание;
• типографику (размер шрифта, межстрочное расстояние, цвет текста);
• стиль кнопок;
• цвет фона блока;
• отступы и цвет для контейнера.

Все изменения можно сохранить в собственной библиотеке блоков — удобно, если вы планируете регулярно создавать письма из блоков.

Наша статья поможет разобраться, как создать красивый макет письма.

Фон можно менять у всего письма: использовать галерею цветов или загрузить фоновое изображение. Для этого перейдите в раздел «Настройки» в левой верхней части экрана редактора.

Блоки письма в Tilda можно перемещать, копировать, удалять, скрывать. Для этого в правой части блока есть меню.

Чтобы добавить новый блок, откройте библиотеку блоков (плюсик между блоками или кнопка «Все блоки» внизу страницы) и выберите подходящий. Там же внизу представлены наиболее часто используемые блоки — их можно добавить прямо из этой строки.

Кроме того, любой блок можно заменить на один из базовых. Для этого нужно выбрать его название в меню блока слева. Появятся варианты для замены.

Использование различных блоков и оформления email позволит сделать собственный уникальный шаблон рассылки.

Тестирование письма

После того, как письмо создано, можно протестировать его: понять, как оно будет выглядеть. В Tilda есть два варианта тестирования. Письмо можно отправить на свой почтовый ящик — тот, на котором зарегистрирован ваш аккаунт. Либо опубликовать письмо в сети — его веб-версия будет доступна по ссылке. 

На почтовый ящик письмо уходит мгновенно, однако часто попадает в папку «Спам». Перед заголовком письма большими буквами указывается [TEST].

Как отправить письмо, созданное в Tilda

Итак, письмо создано и протестировано. Как отправить email из Tilda по базе адресатов?

Отправка из Tilda

Отправить письмо по базе клиентов без подключения почтового сервиса нельзя. Но если есть задача отправить красивое письмо одному адресату, Тильда может помочь. 

Например, HR-специалисту необходимо сделать красивое email-приглашение на собеседование новому специалисту. Для этого создаём письмо в редакторе и отправляем тестовое письмо на свой email.

После этого нажимаем «Переслать письмо» и удаляем все следы пересылки. Нужно не только стереть часть содержимого с первоначальными данными, но также нажать на стрелку возле поля «Кому» и выбрать «Изменить тему» — только после этого можно будет избавиться от приписки [TEST].

Это тестовое письмо можно пересылать несколько раз, заменяя часть контента. Например, если HR-специалистам нужен универсальный шаблон welcome-письма новым кандидатам, они могут изменять данные в каждом новом письме.

Минусы способа:

• письмо получится отправить только одному адресату или группе коллег;
• изображения нельзя менять в почтовой программе;
• если вы ранее не взаимодействовали с получателем, письмо может попасть в спам;
• при пересылке письма теряется его адаптивность: в мобильном телефоне email будет выглядеть практически нечитабельным.

Выгрузка HTML-кода 

Чтобы получить дизайн письма для загрузки в ваш почтовый сервис, зайдите в раздел «Опубликовать» и перейдите во вкладку «HTML-код письма».

Скопируйте сгенерированный код и перейдите в сервис рассылки. Функция импорта HTML-кода есть во всех сервисах для отправки писем. Например, в Unisender нажмите на кнопку «Создать рассылку». Сервис предложит загрузить собственный HTML-код:

После вставки кода письмо появится в HTML-редакторе. Там же его можно отредактровать. 

Там же можно перейти от режима кода в блочный редактор и добавить в письмо недостающие блоки, убрать лишнее или что-то ещё изменить, используя конструктор Unisender. И уже после этого перейти к отправке.

Как интегрировать Tilda с Unisender

1. Получить ID списка и API-ключ Unisender

Сначала нужно зарегистрироваться в сервисе, если ещё не. Потом выбрать «Контакты → Списки → Создать список». В правом столбце будет ID — он нужен для настройки интеграции в Tilda.

Ещё нужно открыть настройки аккаунта, а там раздел «Интеграция и API». После этого нажмите «Показать полностью», введите пароль и скопируйте ключ.

2. Подключить Unisender к Tilda

Нужно авторизоваться в Tilda, перейти к нужному проекту, выбрать «Настройки сайта → Формы». Потом проскроллить до блока «Сервисы рассылок» и выбрать «Unisender».

Дальше нужно просто вставить API-ключ и ID списка, которые получили на предыдущем шаге. И выбрать два других параметра: подтверждение email и режим перезаписывания полей и меток (например, добавлять только новые данные, чтобы не дублировать контакты). И нажать «Добавить».

3. Настроить передачу контактов из формы Tilda в Unisender

Теперь нужно открыть редактор сайта, перейти к форме, которая должна передавать контакты в сервис рассылок, и нажать «Контент». В разделе «Приём данных из формы» ставим галочку рядом с подключенным списком Unisender.

Далее жмём «Сохранить и закрыть» и «Опубликовать».

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

4. Настроить подписку и отписку в Unisender

Чтобы контакты передавались, необходимо вернуться в Unisender и снова открыть «Контакты → Списки». Потом кликнуть на нужный вариант, нажать на три вертикальные точки и вызвать меню, а там уже выбрать «Перейти к настройкам».

Здесь уже указать тему письма и отправителя, а также страницу и ссылку для отписки — на тот случай, если подписчик не захочет больше получать рассылку.

5. Отправить письмо из Tilda через Unisender

Если всё настроено и работает, в Tilda можно запустить первую рассылку. Сначала нужно создать рассылку — как это сделать, мы рассказали в начале статьи. Затем:

• Создать новую кампанию или выбрать существующую.
• Составить тему письма — от этого зависит открываемость, ключевой показатель эффективности.
• Выбрать список контактов.
• Указать имя отправителя и email для ответа.
• Выбрать язык страницы отписки и дать название кампании.

Далее можно отправить тестовое письмо, запланировать отправку или запустить рассылку сразу.

Когда отправлять письма прямо из Tilda, а когда идти в Unisender

Написать и отправить разовую или регулярную рассылку (например, дайджест новостей или промо-письмо со скидкой) можно прямо из Tilda. К тому же полезный «вечнозелёный» контент — инструкцию, чек-лист или авторскую колонку — можно сразу опубликовать на сайте, это очень удобно.

А чтобы отправлять автоматические письма или цепочки писем (например, приветственные для новых подписчиков или реактивационные — для тех, кто давно не читал рассылку), нужно уже идти в Unisender. В сервисе тоже есть конструктор писем с шаблонами, а также все возможности для автоматизации.

Отобрали для вас несколько статей из блога, которые помогут лучше разобраться в теме рассылок:

• Где взять базу подписчиков для рассылки
• Статистика рассылок: базовый уровень
• Как персонализировать рассылки, чтобы продавать больше

Чек-лист хорошей рассылки: что проверить перед отправкой первого письма

Не важно, создаёте вы письмо в Tilda или напрямую в сервисе рассылок — эти советы вам точно пригодятся.