Просмотр и редактирование дизайна в письмах и на посадочных страницах

0

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

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

Обратите внимание:

  • Хотя на посадочные страницы не распространяются те же ограничения по дизайну, как на письма, вы можете встретить дополнительные элементы и в шаблонах посадочных страниц. Это могут быть параметры прозрачности фона и специальный элемент, называемый внутренним стилем. Он позволяет накладывать два фона друг на друга, чтобы выделить содержимое в разделе.

Как получить доступ к вкладке «Стиль» (Style)

Чтобы перейти на вкладку «Стиль» в конструкторе кампаний, выполните следующие действия:

  1. В разделе “Содержимое” (Content) конструктора нажмите “Изменить дизайн” (Edit Design).
  2. На этапе проектирования нажмите на вкладку “Стиль” в окне редактора.
  3. Нажмите на раздел, который хотите отредактировать.
  4. Задайте настройки для раздела и нажмите “Сохранить” (Save).

Варианты оформления разделов

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

Ниже мы рассмотрим наиболее распространенные элементы, доступные в каждом типе раздела.

Страница (Page)

Область за содержимым письма или посадочной страницы.

  • Стиль фона. Выберите фоновое изображение или цвет, затем установите его границу и отступ. Если вы выберете изображение, вы также можете изменить его размер, положение, шаблон повторения и резервный цвет.
  • Граница письма. Добавьте рамку вокруг центрального содержимого.
  • Заголовок 1–4. Установите стиль шрифта для заголовков. Заголовки можно применить к тексту в блоках контента, выделив текст и выбрав стиль заголовка в выпадающем меню “Стили” на панели инструментов редактирования контент-блока.

 

Предзаголовок (Preheader)

Область в самом верху письма, которая обычно включает аннотацию о содержании и ссылку на страницу кампании. Многие почтовые клиенты, такие как Gmail и Yahoo, показывают текст предзаголовка после текста предварительного просмотра кампании и строки темы в своем почтовом ящике.

 

  • Стиль предзаголовка. Выберите фоновое изображение или цвет, затем установите его границу и отступ. Если вы выберете изображение, вы также можете изменить его размер, положение, шаблон повторения и резервный цвет.
  • Текст предзаголовка. Установите цвет текста, шрифт, размер шрифта, высоту строки и выравнивание.
  • Ссылки. Измените цвет и стиль ссылки.

Заголовок (Header)

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

  • Стиль заголовка. Выберите фоновое изображение или цвет, затем установите его границу и отступ. Если вы выберете изображение, вы также можете изменить его размер, положение, шаблон повторения и резервный цвет.
  • Текст заголовка. Установите цвет текста, шрифт, размер шрифта, высоту строки и выравнивание.
  • Ссылки в заголовке. Измените цвет и стиль ссылки.

Тело (Body)

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

  • Стиль. Выберите фоновое изображение или цвет, затем установите его границу и отступ. Если вы выберете изображение, вы также можете изменить его размер, положение, шаблон повторения и резервный цвет.
  • Основной текст. Установите цвет текста, шрифт, размер шрифта, высоту строки и выравнивание.
  • Ссылки. Измените цвет и стиль ссылки.

Столбцы (Columns)

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

  • Стиль столбца. Выберите фоновое изображение или цвет, затем установите его границу и отступ. Если вы выберете изображение, вы также можете изменить его размер, положение, шаблон повторения и резервный цвет.
  • Текст столбца. Измените цвет текста, шрифт, размер шрифта, высоту строки и выравнивание столбца или столбцов.
  • Ссылки в столбцах. Измените цвет и стиль ссылки в одном или нескольких столбцах.

Футер (Footer)

Контент внизу письма или посадочной страницы. Этот раздел часто используется для размещения товарных знаков и другой информации мелким шрифтом.

  • Стиль футера. Выберите фоновое изображение или цвет, затем установите его границу и отступ. Если вы выберете изображение, вы также можете изменить его размер, положение, шаблон повторения и резервный цвет.
  • Текст футера. Измените цвет текста, шрифт, размер шрифта, высоту строки и выравнивание.
  • Ссылки футера. Изменить цвет и стиль ссылки

Мобильные стили (Mobile Styles)

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

  • Заголовок 1–4. Измените установленный размер шрифта и высоту строки для заголовков на мобильном устройстве.
  • Текст в рамке. Измените размер шрифта и высоту строки для блоков контента Boxed Text и Image Card на мобильном устройстве.
  • Видимость предзаголовка. Если ваш контент включает предзаголовок, выберите “Показать” или “Скрыть” предзаголовок при просмотре на мобильных устройствах. На мобильных устройствах предварительный заголовок складывается таким образом, что текст слева от него появляется над текстом справа.

Реферальная программа (Referral program)

Пользователи платных и бесплатных аккаунтов могут включить реферальный значок Mailchimp в свой электронный маркетинг. Вы можете выбрать цвет и стиль логотипа. Платные пользователи могут выбрать, включить или выключить значок в выпадающем меню “Значок вознаграждения” (Rewards Badge).

Панель уведомлений (Notification Bar)

Если эта функция активирована, панель уведомлений появляется, когда кто-то впервые посещает вашу посадочную страницу. Если вы используете какие-либо инструменты отслеживания, такие как Track With Mailchimp, Facebook Pixel или Google Analytics, то это хорошее место, чтобы показать важную информацию посетителям.

  • Включить переключатель уведомлений. Включите панель уведомлений, которая появляется в верхней части посадочной страницы.

Значок Mailchimp (Mailchimp Badge)

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

  • Включить переключатель значков Mailchimp. Отключите значок, который появляется внизу посадочной страницы.
  • Стиль. Измените вид значка конфиденциальности.

Подробно обо всех функциях, возможностях и особенностях Mailchimp вы узнаете в видео-тренинге “Большой курс по Mailchimp“. После прохождения тренинга выдается сертификат.