Налаштування шаблонів email-розсилок Бітрікс24
Email-маркетинг у Бітрікс24 живе в модулі «Маркетинг» (він же sender). Шаблон листа тут — це не просто HTML: це зв'язка блочного редактора, змінних із CRM і правил персоналізації. Якщо шаблон зроблений недбало, листи відображаються по-різному у Gmail, Outlook і Apple Mail — і це проблема саме верстки, а не сервісу розсилки.
Архітектура шаблонів у модулі sender
Бітрікс24 зберігає шаблони листів у таблиці b_sender_letter. Кожен шаблон складається з:
-
HTML-коду листа — зберігається в полі
BODY_TEMPLATE_HTML -
Текстової версії —
BODY_TEMPLATE_TEXT(критична для корпоративних поштових серверів із вимкненим HTML) -
Блоків — структура блочного редактора у форматі JSON
BODY_DESIGNER
Вбудований редактор генерує table-based HTML — так, у 2020-х досі таблиці, бо Outlook до версії 2019 не розуміє flexbox і grid. Це не баг Бітрікс24, це реальність email-клієнтів.
Для завантаження власного HTML-шаблону використовуємо вкладку «Код» в редакторі листа. Важливий момент: Бітрікс24 обгортає ваш HTML у власну обгортку з DOCTYPE і <head>. Якщо вставляти повний HTML-документ, виникає подвійне вкладення — лист ламається. Правильний підхід — вставляти лише вміст <body>.
Персоналізація через змінні
Змінні в шаблонах Бітрікс24 використовують синтаксис #{VARIABLE_NAME}. Стандартний набір для CRM-розсилок:
-
#{NAME}— ім'я контакту з CRM -
#{COMPANY}— назва компанії -
#{ASSIGNED_BY_NAME}— відповідальний менеджер -
#{UNSUBSCRIBE_LINK}— посилання для відписки (обов'язкове за законом)
Розширені змінні з даними угод і лідів підключаються через сегменти та тригерні ланцюжки. Якщо змінна не заповнена в CRM — у листі залишиться порожній рядок. Для підстановки значення за замовчуванням використовуємо синтаксис #{NAME|"Шановний клієнте"} — це працює починаючи з певних версій модуля sender; у старих версіях запасний варіант потрібно реалізовувати в коді шаблону через умовний блок.
Сумісність з email-клієнтами
Найпоширеніша проблема — лист виглядає коректно у Gmail, але розпадається в Outlook. Причини:
Outlook використовує Word як рушій рендерингу — він не розуміє max-width, ігнорує padding на деяких елементах та обрізає фонові зображення в CSS. Для Outlook потрібні спеціальні умовні коментарі: <!--[if mso]>...<![endif]-->.
Шрифти. Google Fonts через @import працюють у Gmail, але не в Outlook. Прописуйте веб-безпечні запасні варіанти: font-family: 'Roboto', Arial, sans-serif.
Retina-зображення. Для HiDPI-екранів зображення повинно бути вдвічі більше відображуваного розміру з явно заданими атрибутами width і height у тегу <img>. Без цього картинки на iPhone виглядатимуть розмито.
Для тестування сумісності перед запуском розсилки використовуємо Litmus або Email on Acid — вони показують рендер у 70+ клієнтах без реального відправлення.
Процес роботи над шаблоном
- Аудит наявних шаблонів і виявлення проблем сумісності
- Проєктування структури: блоки, брендинг, адаптивність
- Верстка table-based HTML з урахуванням особливостей Outlook
- Налаштування змінних персоналізації та перевірка підстановки
- Тестування в email-клієнтах через Litmus/Litmus Preview
- Завантаження до Бітрікс24, налаштування текстової версії
- Тестова розсилка на контрольні адреси всіх цільових клієнтів
| Масштаб задачі | Строк |
|---|---|
| Доопрацювання наявного шаблону | 4–8 годин |
| Новий шаблон із нуля (1 макет) | 1–3 дні |
| Система шаблонів (5+ листів у ланцюжку) | 1–2 тижні |
Вартість розраховується індивідуально після аналізу брендбуку, наявних шаблонів і вимог до персоналізації.