Cтворення оформлення для листа

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

Загальні стилі

Панель Загальні стилі об’єднує всі параметри оформлення листа. Налаштування згруповані за вкладками:

• Глобальні стилі та налаштування
• Стилі смуг
• Стилі заголовків
• Стилі кнопок

🚧

Важливо

Під час створення повідомлення можна редагувати будь-який елемент окремо — смугу, структуру, контейнер або блок. Якщо для елемента задані власні налаштування, вони мають пріоритет над загальними, і саме вони відображатимуться у листі.

Глобальні стилі та налаштування

У цій вкладці задаються базові параметри, що стосуються всього листа:

• Колір фону — виберіть суцільний фон для всього листа. Можна обрати колір з палітри або вказати код вручну. За замовчуванням фон прозорий

• Фонове зображення – активуйте перемикач та встановіть зображення. Можна завантажити власну картинку, вибрати з галереї або вставити посилання на зовнішній ресурс.

Параметри фонового зображення:

• Повторення — визначає, чи буде зображення дублюватися по всій площині фону.
• Горизонтальне та вертикальне розташування — задає позицію зображення відносно контейнера (наприклад, по центру, зліва, справа, зверху чи знизу).
• Ширина та висота фону — дозволяють змінювати розмір зображення, щоб воно краще підходило під лист.

Підтримувані формати: PNG, JPG, GIF, розмір до 3 МБ, ширина до 4000 пікселів.

📘

Примітка

Деякі поштові клієнти не відображають фонові зображення (наприклад, Windows 10 Mail, старі Android Mail, мобільний Gmail тощо). Рекомендуємо в такому разі задати схожий колір фону як резервний варіант. Це забезпечить читабельність, якщо картинка не завантажиться.

• Ширина вмісту — оптимальна ширина листа для коректного відображення на різних пристроях, за замовчуванням 600 px.

• Вирівнювання — положення листа на екрані одержувача. Можна вирівняти контент листа по лівому краю, по центру або по правому краю.

• Підкреслення посилань: відповідає за стилі гіперпосилань у повідомленні. За замовчуванням всі посилання підкреслені. Якщо підкреслення не потрібне — вимкніть перемикач.

• Адаптивний дизайн. Автоматично підлаштовує структуру листа під екрани мобільних пристроїв. За потреби можна додатково налаштувати відображення окремих елементів для мобільної версії. Докладніше у статті Налаштування адаптивності.
• Напрямок тексту справа наліво — режим відображення тексту для мов із письмом справа наліво. Якщо ви створюєте лист арабською, фарсі (перською), івритом чи іншою RTL-мовою, активуйте цю функцію – тоді текст і компонування листа будуть вирівняні за правим краєм і відображатимуться коректно.
• Користувальницькі стилі списків — дозволяє змінити вигляд маркованих і нумерованих списків у листі. Ви можете обрати колір маркерів/номерів у списку, а також задати відступи перед списком (щоб контролювати відстань між попереднім текстом і списком). Це корисно, якщо стандартний вигляд списків не вписується в дизайн вашого листа.

• Відступи: ви можете задати відстань між вмістом листа і його межами, а також внутрішні відступи для структур.

Відступи структури за замовчуванням для десктопу;

📘

Примітка

Індивідуальні відступи, встановлені вами в конкретній структурі або збережені у модулях, не змінюються.

Відступи навколо повідомлення для десктопу.

Стилі смуг

Задайте оформлення для всіх частин листа: хедера, контенту, футера та інфообласті.

Загальні параметри (для всіх частин):

• Шрифт
• Інтервал для десктопу
• Міжлітерна відстань

Індивідуальні параметри (налаштовуються окремо для кожної частини):

• Колір фону смуги (хедер, футер)
• Колір фону контенту (хедер, контент, Футер)
• Фонове зображення (хедер, футер)
• Розмір шрифта для десктопу
• Колір тексту
• Колір посилання
• Колір посилань при наведенні
• Відбивка абзацу

📘

Примітка

Якщо увімкнена опція Відбивка абзацу, система автоматично визначає оптимальний відступ між абзацами для зручного читання, незалежно від розміру шрифту чи налаштувань інтервалу між рядками.

Стилі заголовків

Налаштуйте зовнішній вигляд всіх заголовків у листі (H1–H6) — шрифт, міжлітерну відстань, відбивку абзацу, розмір шрифту та інтервал для десктопу, стиль та колір тексту.

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

Стилі кнопок

Задайте однаковий вигляд для всіх кнопок у листі незалежно від їхнього розташування.

Налаштування кнопок:

• Підтримка Outlook — спеціальна опція для поштових клієнтів Microsoft Outlook.
  • при активації додається VML-код для кнопок, що гарантує правильне відображення.
  • розмір листа збільшується приблизно на 1 КБ за кожну кнопку.

• Шрифт
• Розмір шрифту для десктопу
• Стиль та колір тексту
• Міжлітерна відстань

• Колір кнопки
• Межа (колір та стиль)
• Заокруглення

• Стилі кнопки при наведенні: дозволяють задати інший фон, колір тексту або рамки, які з’являються при наведенні курсора. Це робить кнопки інтерактивними та підкреслює їхню клікабельність.

• Розтягнення за шириною для десктопу
• Відступи для десктопу

🚧

Увага

Текст і посилання кожної кнопки змінюються лише у вкладці Налаштування при редагуванні блоку Кнопка. На панелі Загальні стилі можна задати тільки зовнішній вигляд кнопок, але не їхній зміст і не адресу переходу.

Докладніше про створення кнопки СТA >

Збереження змін

Коли всі зміни внесені, натисніть Зберегти.

Щоб зберегти лист як шаблон, оберіть у меню Зберегти → Зберегти як шаблон.

Усі шаблони доступні в розділі Повідомлення → Повідомлення → Збережені.