Вставить и настроить блок с иконками

 

Обратите внимание, в этой статье описывается старый редактор писем.

В феврале 2024 года в Unisender появился новый редактор. Информацию о его основных функциях и преимуществах можно найти в разделе «Создание писем в новом конструкторе».

Иконки нужны, чтобы направить читателя рассылки на важные страницы сайта. Например, на страницу с отзывами или в контакты. Картинка и подпись помогают подписчику понять, куда он попадет.

Кроме того, с помощью иконок удобно оформить звонок или отправку сообщения прямо из письма.

Разберемся, как добавить и настроить иконки в конструкторе.

Добавляем блок с иконками в письмо

Чтобы добавить иконки в письмо, перетащите блок «Иконки» в нужное место рассылки. Затем в свойствах блока добавьте необходимое количество иконок, используя кнопку «Добавить новую иконку».

Перетаскиваем блок «Иконки» в письмо.

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

Добавляем ранее загруженную иконку.

Добавляем ссылку к каждой иконке

Перейдем к настройке внешней ссылки. Чтобы открыть развернутые настройки, используйте переключатель «Подробнее» (1).

Настройки блока с иконками.

В строку «Url иконки» можно вставить ссылку на иконку на внешнем хранилище, если не хотите загружать ее в Unisender(2).

Обязательно заполните альтернативный текст (3). Если в почтовом ящике получателя изображения будут отключены, альтернативный текст поможет понять, в какой раздел сайта ведёт иконка.

Чтобы подписать иконку, используйте строку «Текст иконки» (4). Лучше вводить короткие названия, например, «Отзывы» или «Позвонить».

С помощью разных типов ссылки настройте действие при клике на иконку: открыть ссылку, отправить письмо, позвонить, отправить СМС (5).

Выбираем тип ссылки.

Выбираем действие при клике на иконку

Разберем подробнее, какие действия можно выбрать в строке «Тип ссылки».

Открыть ссылку. При клике по иконке пользователь попадет на страницу сайта, которую вы укажите. Важно добавлять ссылки с протоколом http:// или https://.

Добавляем ссылку, которая откроется при клике.

Далее в выпадающем списке «Цель» выберите, как будет открываться ссылка —  в новой вкладке или в текущей.

Выбираем, как будет открываться ссылка.

Отправить письмо. Читатель сможет отправить письмо на заданный email прямо из рассылки. Укажите, на какой email будет отправлено письмо. Также можете задать тему и написать текст письма. Но эти данные отправитель сможет редактировать.

Настраиваем отправку письма по клику.

Позвонить. При клике по иконке читатель сможет позвонить вам прямо из письма, если его браузер или почтовый клиент умеют обрабатывать протокол tel.

Отправить СМС. Работает по такому же принципу, что и ссылка «Позвонить», то есть при нажатии на иконку пользователь сможет написать СМС-сообщение на заданный номер.

Настраиваем блок с иконками

Выравнивание. Опция позволяет изменить расположение иконок в блоке ближе к левому краю, посередине, по правому краю.

Настраиваем выравнивание иконок в блоке.

Шрифт, цвет и размер шрифта. Выберите шрифт подписи иконок. Лучше использовать тот же, что и в письме. Цвет текста можно выбрать как из предложенной палитры, так и вставить его в виде шестнадцатеричного кода.

Настраиваем шрифт подписей иконок.

Размер иконок. По умолчанию иконки загружаются в размере 32 px. При желании их можно уменьшить до 16 px или увеличить до 64 px и 128 px. Выберите нужный размер в выпадающем списке.

Настраиваем размер иконок.

Интервал между иконками. Позволяет отрегулировать интервал между иконками от 0 до 20 единиц.

Настраиваем интервал между иконками.

Отступы иконок. Настраиваем отступы от внутренних стенок блока: как от конкретных сторон, так и по всему периметру.

Настраиваем отступы.

Опция «Скрыть». Позволяет скрыть блок «Иконки» при просмотре:

  • на компьютере или мобильном устройстве;
  • в AMP или HTML версии письма.

Чтобы сбросить эту настройку, нажмите на крестик.

Как скрыть блок.

При таких настройках иконка не будет отображаться на мобильных устройствах и в AMP-письмах

Полезные ссылки

Основные возможности конструктора
Как настроить шрифты и цвета шаблона
Как собрать макет с помощью строк
Как отредактировать текст
Как вставить картинку
Как сделать прехедер
Как посмотреть письмо перед отправкой
Как сохранить элементы письма для следующих рассылок
Как адаптировать письмо под мобильные устройства
Что такое AMP-письма и как их использовать в рассылке

Вы нашли ответ?

2
8