Как добавить HTML-блок в письмо в конструкторе Mindbox

Как работать с конструктором Mindbox

HTML-блок позволяет вставить в письмо готовую верстку: продуктовые карточки, кастомные кнопки и другие элементы. Используйте его, когда у вас уже есть сверстанный HTML-код и нужно быстро встроить его рядом с блоками из конструктора — без загрузки кастомных блоков.

editor-html-example
Пример письма с HTML-блоком: слева — товарные карточки на HTML, справа — таймер и текст из конструктора

Перед отправкой обязательно проверьте, что код корректно отображается в письме — см. раздел Как проверить результат.

Когда использовать HTML-блок

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

Как добавить HTML-блок

  1. Добавьте в письмо новый пустой блок:

    editor-html-add-block.png

  2. Перетащите элемент «HTML» из панели элементов слева в блок:

    editor-html-drag-element.png

    HTML-элемент можно размещать рядом с другими элементами (текст, изображение, кнопка) в одной строке блока.

  3. Кликните на добавленный элемент и вставьте код во вкладке «Дизайн»:

    editor-html-add-code.png

  4. На вкладке «Отображение» выберите, на каких устройствах показывать блок:

    • на всех устройствах,
    • только в версии для десктопа,
    • только в мобильной версии.

  5. Сохраните письмо.

Как проверить результат

Перед массовой отправкой убедитесь, что HTML-блок отображается корректно:

  1. Откройте Предпросмотр и проверьте верстку в десктопной и мобильной версии.
  2. Отправьте себе тестовое письмо и откройте его в нескольких почтовых клиентах (Gmail, Yandex, Mail.ru, Outlook) — отображение HTML может различаться.
Предыдущая
Блок с иконками соцсетей
Следующая
Как настроить брендированную страницу отписки