Сервис Mailigen прошел проверку в Роскомнадзоре и полностью соответствует требованиям 152-ФЗ «О персональных данных»

9 советов для работы с редактором писем в Mailigen

Обязательный этап при создании письма — дизайн. Если у вас в штате есть дизайнер и верстальщик, то дело упрощается многократно, но если это только первая рассылка и всё приходится делать самому, то появляется вопрос:

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

Когда идёт уже вторая, третья, десятая рассылка и общее понимание работы конструктора писем сложилось, появляются другие вопросы:

Как оптимизировать работу над созданием письма? Наши советы помогут ускорить работу над шаблоном письма и узнать интересные возможности конструктора.

1. Выравнивание содержимого блока по горизонтали

Всегда хочется, чтобы макет письма выглядел аккуратным, но частая проблема — всё “плывёт” и не становится на свои места.

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

В Drag'n'Drop выравнивание выполняется при нажатии на редактирование блока (шестеренка), далее выбираем из выпадающего списка Вертикальное выравнивание.

2. Отступы

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

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

В рассылке магазина Hoff используются и внутренние и внешние отступы. Фон блока задан как светло-бежевый и благодаря внешнему отступу каждая товарная подборка смотрится как отдельная белая карточка, а внутренний фон использован, чтобы отделить фотографию от границы блока. По итогу: информация упорядочена и быстро считывается.

3. Разделитель

Видели в письмах когда-нибудь тонкую горизонтальную серую линию между блоками? Это разделитель. Он может быть как в виде тонкой серой линии, так и в виде полосы, размер которой можно менять просто потянув за ползунок. Используйте его для разделения блоков по смыслу.

Как дизайнерское решение — можно использовать связку Кнопка+Разделитель. Это экономит место и разделяет информационные блоки (Пример: рассылка компании Техпорт).

Или разделять разные виды товарных подборок, как это делают создатели рассылки Ralf Ringer.

В редакторе Mailigen, чтобы создать конструкцию “Разделитель+Кнопка”, надо сначала вставить в шаблон рамку из трех колонок, потом вставить элементы Кнопка и Разделитель, убрать внутренние отступы, по желанию — изменить цвет и в конце — выровнять содержимое рамки посередине.

4. Использование конструкции “Вставка блока в блок”

Нужно вставить оригинальные иконки? Целых 8 штук и все разные? Думаете, что уже пора искать верстальщика? Но эту проблему можно решить средствами редактора писем Mailigen.

Благодаря тому, что в каждый блок можно вставить ещё один блок, вполне реально создать письмо, состоящее из 16(!) колонок. Важное условие — необходимо, чтобы первый добавленный блок шел в качестве самостоятельного элемента, а не в составе другого блока (черная линия при вставке блока в письма показывает, что он будет самостоятельным элементом, а синяя — что в составе другого блока).

5. Выравнивание основы письма

Если нужно создать обычное текстовое письмо (plain text) или просто выровнять основу письма по левому или правому краю, то можно воспользоваться функцией Шаблон — Основа — Выровнять — По левому краю (середине или правому краю).

6. Использование стилей

Если письмо состоит более чем из одного текстового блока, то имеет смысл изначально задать стиль тексту в письме и не терять драгоценное время на форматирование текста в каждом новом блоке. Во вкладке текст можно найти определение стилей для Параграфа, Заголовков 1 и 2 уровней  , а также для вашего стиля. Как использовать? Задаете стиль, а потом перетаскиваете измененный блок в шаблон.

7. Использование хедера и футера

Хочется внести немного разнообразия в простыню из текста? Попробуйте выделить цветом хедер (шапку письма) или футер (подвал письма).

Сделать это можно, если зайти в “Шаблон — Хедер — Внешний фон” и можно выбирайте необходимый цвет хедера. Просто цвета недостаточно? Добавляйте паттерн или фотографию.

Например, в рассылках “Проект1917” выделен яркий хедер на всю ширину письма для привлечения внимания.

8. Специальные символы

Нужно использовать символы, которых нет на клавиатуре: стрелки, денежные знаки, дроби и т.д.? Воспользуйтесь специальными символами, нажав в текстовом блоке “Редактирование текста” и потом во вкладке “Текст” выбрав кнопку “Специальные символы”.

9. Работа с кнопкой (вставка ссылки, выравнивание)

Кнопка призыва к действию является одной из важных составляющих письма. Вставить правильную ссылку на нее можно с помощью Блоки — Кнопка — Редактировать блок (значок карандаша, появляющийся при наведении на блок).

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

Возможности редактора писем Mailigen достаточно широки для создания визуально интересных писем без применения HTML верстки и наличия специальных знаний. Воплощайте в жизнь свои идеи! И пользуйтесь Mailigen.

9 советов для работы с редактором писем в Mailigen