Docs RU

Как использовать блок с кнопкой

2025-07-30 08:34 Редактор

Что такое кнопка и зачем она нужна?

Кнопка — важнейший элемент письма. Она направляет пользователя на нужную страницу и выполняет роль призыва к действию (CTA), указывая, что именно нужно сделать. Это один из ключевых факторов повышения конверсии email-рассылки.
Использовать кнопку просто: добавьте её в нужные места письма. Например:
  • перейти к товару, о котором идёт речь;
  • пройти опрос;
  • завершить оформление заказа и т.д.
❗️Не стоит добавлять слишком много кнопок с разными целями — это может запутать получателя. Но допустимо дублировать одну и ту же кнопку в начале и в конце письма для повышения кликабельности.

Как добавить кнопку в письмо?

  1. Перейдите в раздел «Инструменты и модули» (иконка в правой панели).
  2. Откройте вкладку «Блоки».
  3. Перетащите блок «Кнопка» в нужное место письма.

Какие типы ссылок можно добавить в кнопку и как это сделать?

  1. Кликните по блоку с кнопкой.
  2. В правой панели в разделе «Контент» укажите ссылку.
Поддерживаются следующие типы ссылок:
  • Сайт в формате https:// (откроется в новой вкладке).
  • Email — откроется почтовый клиент с адресом.
  • Телефон в формате tel:+74951234567.
  • Skype — откроется приложение Skype с вызовом пользователя.

Как изменить текст на кнопке?

Перейдите в настройки блока справа и в разделе «Контент» измените текст кнопки.

Как добавить иконку к кнопке?

  1. Включите переключатель «Кнопка с иконкой».
  2. Загрузите изображение с компьютера, по ссылке или из библиотеки.
  3. Выберите положение иконки: слева или справа от текста.

Как изменить размер кнопки?

Размер задаётся внутренними отступами (расстояние от текста до краёв кнопки).
Изменить их можно в разделе «Размер кнопки» на правой панели.
Также можно включить переключатель «Растянуть по ширине», чтобы кнопка занимала всю ширину секции.

Как настроить цвет и границу кнопки?

  1. Перейдите в раздел «Стиль кнопки» на правой панели.
  2. Задайте цвет кнопки в hex-формате.
  3. Включите настройки границы, чтобы задать её цвет, толщину, стиль и скругление углов.

Как настроить цвет при наведении (hover)?

В разделе «Стиль кнопки» укажите цвет для состояния при наведении курсора. Без заполнения этого параметра цвет при наведении не изменится.

Как изменить стиль и цвет текста кнопки?

В разделе «Стиль текста» вы можете настроить:
  • шрифт,
  • жирность,
  • курсив,
  • размер,
  • цвет,
  • регистр (всё прописными или строчными).

Как изменить фон под кнопкой и границу блока?

  • Перейдите в раздел «Фон» на правой панели.
  • Укажите цвет фона блока с кнопкой.
  • Включите настройки границы, чтобы задать стиль, цвет, толщину и скругление границы вокруг блока.

Как изменить выравнивание и внешние отступы кнопки?

В разделе «Позиция» можно:
  • выбрать выравнивание кнопки (слева, по центру, справа),
  • задать внешние отступы (расстояние от кнопки до границ секции).

Как скрыть кнопку на мобильных или десктопных устройствах?

Вы можете скрыть отображение кнопки для определённых устройств. Подробнее об этом читайте в этой статье.

Мобильные настройки кнопки

В мобильной версии редактора вы можете изменить:
  • размер текста кнопки,
  • размер кнопки,
  • выравнивание кнопки.
Подробнее о настройках кнопки для мобильных — в этой статье.

Настройки кнопки для тёмной темы

Для корректного отображения кнопки в тёмной теме перейдите в редактор тёмной версии письма. Там вы можете изменить:
  • цвет кнопки,
  • цвет при наведении,
  • цвет границы,
  • цвет текста,
  • цвет фона под кнопкой.
Подробнее — в этой статье.