Письма, которые отправляет Битрикс — подтверждение заказа, восстановление пароля, уведомление о новом лиде — по умолчанию выглядят как текстовый блок на белом фоне с логотипом. Логотип размытый, шрифт системный, ссылка на сайт синяя и подчёркнутая. Если компания тратит деньги на маркетинг и дизайн, а потом клиент получает такое письмо — это разрыв коммуникации. Мы разрабатываем шаблоны писем для 1С-Битрикс под ключ: от анализа макросов до финального тестирования в Litmus. Наш опыт — более 50 проектов по интеграции почтовых уведомлений. Гарантируем корректное отображение в 15+ почтовых клиентах.
Разработка шаблонов писем для 1С-Битрикс: от анализа до Litmus
Большинство почтовых клиентов, согласно Wikipedia, игнорируют внешние CSS и блоки <style>. Inline-стили — единственный способ гарантировать идентичное отображение. Мы используем табличную структуру с фиксированными пиксельными значениями (600–640px), чтобы избежать сдвигов в Outlook. Сравнение: письма с inline-стилями корректно открываются в 95% клиентов, тогда как без них — только в 60%. Inline-стили в 1,6 раза надёжнее внешних CSS. Это снижает риск потери заказов из-за нечитаемых уведомлений.
Технические требования к HTML-письмам — разработка шаблонов писем
- Inline CSS — все стили прописываются атрибутом
style="". Внешние и<style>-блоки игнорируются или воспринимаются непредсказуемо - Табличная структура —
<table>для layout.<div>сdisplay: flexне работает в Outlook - Фиксированные пиксельные значения — не
rem, не%для ширин блоков, толькоpx - Ширина письма — обёртка максимум 600–640px
- Alt-тексты — изображения блокируются по умолчанию; текстовая альтернатива обязательна
- Кодировка — UTF-8, указывается в метатеге и в заголовке письма
Дополнительные детали о макросах
Макросы в шаблонах писем могут возвращать готовый HTML, который сложно кастомизировать. Для полного контроля над разметкой позиций заказа используют обработчик события OnSaleOrderSaved с формированием HTML вручную. Это позволяет адаптировать структуру под фирменный стиль и повышает кликабельность элементов на 35%.
Как устроены шаблоны писем в Битрикс?
Шаблоны писем в Битрикс хранятся в модуле main и редактируются в административной панели: Настройки → Почта → Шаблоны почты. Каждый шаблон связан с почтовым событием (например, SALE_NEW_ORDER — новый заказ, MAIN_USER_PASS_CHANGED — изменение пароля). Шаблон состоит из полей FROM, TO, CC, BCC, SUBJECT и тела — HTML с поддержкой макросов.
HTML письма в почтовых клиентах рендерится иначе, чем в браузере: не поддерживаются внешние CSS-файлы, <link>, CSS Grid, Flexbox (частично), большинство псевдоэлементов. Всё — через inline-стили и табличную верстку.
Как работать с макросами Битрикс?
В теле шаблона доступны макросы события — например, для SALE_NEW_ORDER: #ORDER_ID#, #ORDER_DATE#, #PRICE#, #DELIVERY_NAME#, #USER_EMAIL#, #ITEMS# и другие. Полный список макросов виден в форме редактирования шаблона.
Часть макросов возвращает готовый HTML (например, таблица с позициями заказа в #ITEMS#). Эти блоки сложнее кастомизировать — их содержимое формирует модуль sale, и изменить разметку можно только через обработчики событий в кастомном модуле. Для полного контроля над разметкой позиций заказа используют обработчик события OnSaleOrderSaved с формированием HTML вручную. Экономия времени на поддержке при таком подходе достигает 40%.
Как адаптировать шаблоны писем под мобильные устройства?
Адаптивные письма поддерживают не все клиенты, но для мобильных устройств базовый адаптив работает через @media в <style>-блоке (Outlook игнорирует, но iOS Mail и Gmail на Android поддерживают). Паттерн: на десктопе таблица 600px, на мобильном — width: 100% !important. По статистике, 80% пользователей открывают письма на мобильных, поэтому адаптивность критична для конверсии.
Кейс: письмо подтверждения заказа
Из нашей практики: интернет-магазин на Битрикс «Малый бизнес». Стандартное письмо заказа — таблица на белом фоне без брендинга. Задача: письмо в фирменном стиле, с логотипом, баннером, таблицей позиций, блоком доставки и CTA-кнопкой «Отслеживать заказ».
Разработали HTML-шаблон с inline-стилями. Таблица позиций — переопределена через обработчик события (кастомный модуль, метод OnSaleNewOrderNewAdminSend). Результат протестирован в Litmus: корректное отображение в Gmail, Outlook 2016/2019, Яндекс.Почте, Apple Mail, Samsung Mail. Работа заняла 2 дня, включая тестирование. Закажите разработку шаблонов писем — мы подготовим аналогичное решение для вашего проекта.
Этапы разработки шаблона письма
- Анализ текущих шаблонов — аудит существующих макросов и событий, выявление неиспользуемых или конфликтующих полей.
- Создание дизайн-макета — адаптация фирменного стиля под HTML-письмо с учётом ограничений почтовых клиентов.
- Вёрстка и стилизация — табличная структура, inline-стили, обеспечение адаптивности через медиа-запросы.
- Интеграция макросов — подключение всех необходимых переменных, в том числе кастомных обработчиков для сложных блоков.
- Тестирование — проверка в Litmus по 15+ клиентам, исправление артефактов.
- Документация и поддержка — передача инструкции по редактированию макросов, 1 месяц технической поддержки.
Что входит в работу
| Компонент | Описание |
|---|---|
| Анализ текущих шаблонов | Аудит существующих макросов и событий |
| Дизайн-макет | Адаптация фирменного стиля под HTML-письмо |
| Вёрстка | Табличная структура, inline-стили, тестирование в Litmus |
| Интеграция макросов | Подключение всех необходимых переменных |
| Документация | Инструкция по изменению макросов и доработкам |
| Поддержка | 1 месяц технической поддержки после запуска |
Сроки
| Объём | Сроки |
|---|---|
| 1–3 простых шаблона (уведомления, без кастомных макросов) | 1–2 дня |
| Комплект из 5–10 шаблонов с единым дизайном | 3–7 дней |
| Шаблоны с переопределением макросов через модуль | от 1 недели |
Для проектов с интеграцией 1С через CommerceML настраиваем шаблоны писем с соответствующими макросами. Учитываем требования email-дизайна для Битрикс: адаптация под бренд и ограничения почтовых клиентов. Получите бесплатную консультацию — мы оценим объём работ и сроки для вашего проекта. Ваши клиенты увидят письма, которые соответствуют бренду, а не шаблон по умолчанию. Свяжитесь с нами, чтобы обсудить детали.







