Главное Авторские колонки Вакансии Образование
😼
Выбор
редакции
1 207 0 В избр. Сохранено
Авторизуйтесь
Вход с паролем

Как бесплатно создавать красивые шаблоны для email-рассылок без знания HTML

Ваши письма для email-кампаний должны быть красивыми и функциональными. Еще они должны отличаться от конкурентов, быть оригинальными, но при этом понятными, цепляющими, передавать ваши ценности, быть лицом вашей компании и т.д.
Мнение автора может не совпадать с мнением редакции

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

Используя Stripo вы сможете регулярно обновлять дизайн ваших ваших емейл-рассылок. Хороший повод изменить дизайн писем — смена сезона, поступление нового товара, любой праздник и просто когда хочется чего-то нового.

Основное преимущество Stripo — вы легко создадите письмо, не владея навыками программирования, не зная принципов верстки и HTML. При этом письмо будет адаптировано под любое устройство. И легко импортируется в ваш сервис рассылок.

Библиотека Stripo содержит более 300 шаблонов, которые можно взять за основу. Каждый из этих шаблонов можно изменять под ваш вкус и требования — добавлять новые блоки, удалять существующие. Заменять одни элементы на другие — картинки на текст или кнопки и наоборот.

Если не можете найти готовый шаблон, который устраивает вас на 100%, возьмите тот который примерно напоминает желаемый дизайн и сотворите свой идеальный макет письма.

Как бесплатно создать макет письма в Stripo

После завершения процесса регистрации вы попадаете в свой личный кабинет, где сможете создавать письма. Во вкладке «Шаблоны», «Подготовленные шаблоны» представлено большое количество вариантов, которые подобрал для вас сервис, руководствуясь вашими ответами при регистрации.

Но, обратите внимание, здесь очень много шаблонов, которые обозначены специальным значком. Их можно использовать только на платных тарифах. А мы хотим это сделать бесплатно.

Бесплатный тариф предоставляет возможность создать в месяц 2 макета письма и скачать их 4 раза. Т.е., каждый шаблон можно скачать по 2 раза. Это удобно, если с первого раза вы что-то забыли, ошиблись. У вас есть шанс внести исправления и скачать шаблон еще раз.

Или вам надо 2 похожих макета под различные кампании. Подготовили первый макет и скачали. Затем внесли изменения для второго макета, добавили кнопок, таймер, баннер в тот же шаблон, и опять скачали.

Бесплатным тарифом можно пользоваться неограниченное количество времени. Но если вы за месяц проводите несколько различных емейл-кампаний, проще перейти на платный тариф.

На платном тарифе намного интереснее шаблоны и больше возможностей. Минимальная стоимость — 10,42$ в месяц, если внести оплату сразу за год 125$. В этом тарифе можно создать в месяц 15 шаблонов и экспортировать их 300 раз.

Как отредактировать письмо.

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

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

Включите «Подчеркивание ссылок» и «Адаптивность письма». Можете задать «Картинку в фоне» и сделать ее повторяющейся или просто установить цвет фона письма. Также в этом разделе можно установить общие шрифты, интервалы, отступы и прочее. Это будет применимо к новым блокам, которые вы будете добавлять в письмо.

Дальше редактируйте каждый элемент письма. Для этого нажмите на необходимый блок — картинку, текст, кнопку. Слева откроется меню с настройками.

Для блока с текстом настройте отступы, выравнивание, интервал между строками, наименование, размер и цвет шрифтов.

Если вам нужно добавить ссылки к определенным словам в тексте — выделите нужное слово или словосочетание; в верхней части панели настроек кликните значок «Ссылка»; в открывшемся окошке вставьте вашу ссылку.

1. Добавить ссылку2. Предварительный просмотр покажет как ваше письмо отображается на компьютере и в телефоне.3. Можно добавить эмодзи при необходимости

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

Отредактируйте ссылки на изображениях. По умолчанию все ссылки ведут на сайт Stripo. Вставьте свою ссылку или удалите ее, если она вам не нужна. И введите атрибут alt.

Можно создать эффект ролловер. Т.е. при наведении курсора картинка изменится. Это удобно для рассылок интернет-магазинов.

Редактирование кнопок. Вставьте ссылку и напишите текст кнопки. Установите шрифты, цвет кнопки и текста. Отрегулируйте закругление.

Сделайте настройки для просмотра на смартфоне. На панели настроек перейдите во вкладку «Оформление». Затем кликните вкладку «Адаптивность» и задайте параметры для размера заголовков, текста кнопок и контента в разных блоках.

Как добавить необходимые элементы в письмо.

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

Например, вам понравился макет, но на нем нет кнопок. Выберите вкладку «Контент» и «Блоки». Кликните по элементу «Кнопка» и перетащите ее в необходимое место на макете.

Как добавить таймер обратного отсчета

В начале выберите структуру с 1 колонкой и перетащите ее в шаблон на то место, где необходимо разместить таймер. Зайдите в Блоки и перенесите курсором в эту колонку Таймер. Появится окно, где можно выбрать дату и точное время до которого ведется отсчет.

Выберите цвет цифр и фона таймера. Убедитесь, что включена возможность «Отображать дни». Будет дополнительно показано количество оставшихся дней, а не только часов и минут. Согласитесь, «2 дня 5 часов» будет восприниматься лучше, чем «53 часа». Затем включите «Подписи цифр таймера» для отображения названий каждого элемента таймера.

Желательно включить кнопку «Картинка по окончанию таймера». Это поможет понять, что срок действия акции истек. Для этого загрузите изображение, которое будет показано клиентам после завершения обратного отсчета. Укажите Alt-текст.

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

Как создать хедер или футер с помощью Stripo.

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

Хедер обычно состоит из логотипа и меню. Добавьте необходимую структуру в письмо. Например вставьте вначале структуру с 1 колонкой для логотипа, затем с 2 или 3 колонками, в зависимости от количества блоков в вашем меню.

Вставьте свой логотип. Он вставляется как обычное изображение. Установите ссылку, которая приведет на ваш сайт. И добавьте Alt-текст.

Футер — составной элемент. Чтобы построить его, вам нужно: перетащить структуру с нужным количеством колонок; ввести текст в эти колонки; отредактировать текст; вставить соответствующую ссылку в опцию отписки; добавить иконки соцсетей.

Также футер можно добавить после переноса шаблона в сервис рассылок Estismail.

Как перенести письмо в сервис рассылок.

Когда письмо готово, необходимо его экспортировать, чтобы потом загрузить в сервис рассылок.

Для этого сверху посредине нажмите зеленую кнопку «Экспорт» и выберете HTML. В открывшемся окне опять нажмите кнопку «Экспорт».

Чтобы загрузить скачанный макет в Estismail, откройте его с помощью блокнота (правая кнопка — открыть с помощью — блокнот) и скопируйте содержимое.

В личном кабинете Estismail нажмите на кнопку «Создать новый макет», затем:

1. Поставьте галочку напротив «Использовать простой текстовый редактор», 2. Нажмите «Источник», 3. Вставьте скопированный код.

В Estismail можно убрать некоторые блоки. Также можно будет внести изменения. Например, поменять текст, цвет, размер текста, ссылки, заменить картинки, текст кнопок. Каждый раз вы можете отправлять абсолютно новое письмо. Но стиль и структура письма останутся неизменными.

Ваши письма всегда будут красивыми и узнаваемыми!

0
В избр. Сохранено
Авторизуйтесь
Вход с паролем