Справочник по блокам контента в email-редакторе

Справочник по каждому блоку, который можно добавить на холст Drag & drop редактора, и по типам ссылок, доступным для кнопок и текста. Чтобы контролировать, какие получатели увидят блок, установите условие отображения.

Добавление блоков контента

Откройте вкладку Блоки и перетащите блок на холст или нажмите на блок, чтобы добавить его в конец email-сообщения. Доступные блоки:

• Заголовок: названия и короткие заголовки в email-сообщении
• Текст: основной текст и длинные описания
• Кнопка: кликабельный призыв к действию
• Изображение: картинки из Медиахранилища, загруженные файлы или URL-адреса
• Видео: кликабельный постер, который ведет на видео на YouTube или Vimeo
• Карточка: изображение в сочетании с заголовком, текстом и кнопкой в одном макете
• Разделитель: линия, которая визуально разделяет секции
• 2 колонки: две равные колонки рядом
• 3 колонки: три равные колонки рядом
• 4 колонки: четыре равные колонки рядом
• 33 / 67: две колонки, где левая занимает около 33% ширины, а правая — около 67%
• 67 / 33: две колонки, где левая занимает около 67% ширины, а правая — около 33%
• Таймер: обратный отсчет для предложений и сроков
• Меню: ряд или столбец ссылок, например, для навигации или контактов
• Социальные сети: иконки, которые ведут на ваши профили в социальных сетях
• HTML: пользовательский HTML, например, форма, опрос или встроенное видео
• Продукты: повторяющаяся сетка карточек товаров. Вводите товары вручную или загружайте их из вашего каталога товаров, из брошенной корзины получателя или с помощью встроенной стратегии рекомендаций, такой как бестселлеры или снова в наличии.
• Новости: повторяющаяся сетка карточек статей. Выбирайте их вручную из RSS или Atom-ленты или загружайте в реальном времени из ленты, зарегистрированной для вашего приложения.

Заголовок и текст

Блоки Заголовок и Текст содержат текст, который получатели читают в email-сообщении. Используйте Заголовок для названий и коротких строк, Текст — для основного текста и длинных описаний.

Нажмите на блок на холсте, чтобы начать редактирование. Выделите текст, чтобы появилась панель инструментов форматирования.

Опции панели инструментов

• Стиль текста: установите стиль абзаца (Заголовок 1, Заголовок 2, Обычный и т. д.) для всего блока
• Размер шрифта: измените размер выделенного текста или примените размер ко всему абзацу
• Жирный / Курсив / Подчеркнутый / Зачеркнутый: стандартное форматирование символов
• Выравнивание: по левому краю, по центру или по правому краю
• Ссылка: оберните выделенный текст в гиперссылку
• Маркированный список / Нумерованный список: превратите выделенные строки в список. Любые маркеры или номера, с которых уже начинаются строки, удаляются, чтобы не было дублирования с маркером списка.

Выделите блок (а не фрагмент текста), чтобы открыть его настройки на правой панели, затем включите Межбуквенный интервал, чтобы увеличить или уменьшить расстояние между символами для всего блока. Принимает дробные и отрицательные значения. Чтобы применить межбуквенный интервал ко всем текстовым блокам сразу, установите его как стандартное значение для всего email-сообщения в разделе Типографика. См. Настройка стилей для всего email-сообщения.

Вставка из других документов

При вставке текста из Google Docs, Word или веб-страницы сохраняются жирный шрифт, курсив, подчеркивание, зачеркивание и ссылки. Цвет, размер и семейство шрифта из источника не переносятся — всегда преобладает типографика самого блока. Чтобы полностью игнорировать форматирование источника и применить стиль блока, используйте Ctrl+Shift+V (Cmd+Shift+V на Mac).

Вставленный маркированный или нумерованный список сохраняет свой маркер или номер как обычный текст в начале каждой строки в том же блоке. Выделите эти строки и нажмите Маркированный список / Нумерованный список, чтобы превратить их в настоящий список — кнопка удалит оставшийся маркер за вас.

В однострочных полях, таких как надпись на Кнопке, вставленные разрывы строк сворачиваются в один пробел.

Персонализация с помощью Merge Tags

Merge Tags — это плейсхолдеры, которые вставляют значение тега из профиля получателя, чтобы каждый подписчик видел персонализированный текст. Чтобы добавить его, выделите текст, нажмите Merge Tags на панели инструментов и выберите тег из вашего аккаунта. Нажмите на вставленный Merge Tag, чтобы открыть панель с полями По умолчанию (значение, которое отображается, когда тег пуст) и Формат (капитализация, форматирование числа или даты, применяемое к значению).

Изображение

Блок Изображение отображает картинку в email-сообщении. Выделите его на холсте, чтобы открыть настройки Изображения на правой панели.

Добавление изображения

Нажмите Добавить изображение, когда блок пуст, или Заменить изображение, когда картинка уже установлена. Откроется Медиагалерея с тремя вкладками:

• Библиотека: ваши загруженные файлы с возможностью поиска по имени.
• Стоковые фото: поиск бесплатных фотографий на Pexels, не выходя из редактора. Нажмите на одну, чтобы скопировать ее в вашу библиотеку и вставить.
• Сгенерировать с помощью ИИ: опишите желаемое изображение и выберите соотношение сторон. Сгенерированное изображение сохраняется в вашей библиотеке.

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

Удаление изображений из Библиотеки

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

Осторожно

Удаление файла полностью удаляет его из Медиахранилища, вместе со всеми созданными из него вариантами, и это действие нельзя отменить. Любой контент, ссылающийся на удаленное изображение, перестанет его загружать.

Альтернативный текст

Опишите изображение в поле Альтернативный текст для доступности или нажмите Сгенерировать альт. текст с помощью ИИ, чтобы ИИ написал его на основе изображения на вашем текущем языке редактирования. Изображения, добавленные из стоковых фото или сгенерированные с помощью ИИ, получают альтернативный текст автоматически.

Размер и расположение

• Ширина: установите ширину изображения в пикселях или в процентах от доступного пространства, чтобы оно оставалось гибким. Оставьте значение по умолчанию, чтобы использовать естественную ширину изображения.
• Высота (px): установите фиксированную высоту рендеринга. Оставьте поле пустым для автоматического масштабирования — по соотношению сторон кадрирования, если оно установлено, в противном случае по естественным пропорциям изображения.
• Кадрирование: выберите Оригинал, чтобы сохранить естественные пропорции изображения, или соотношение сторон (Квадрат (1:1), 4:3, 3:2, 16:9), чтобы обрезать изображение до этого размера.
• Расположение: выберите Заполнение, чтобы заполнить рамку и обрезать по ней. Установите точку кадрирования с помощью Фокусная точка. Или выберите Вместить, чтобы масштабировать все изображение внутри рамки без обрезки. Позиционируйте его с помощью Установить позицию.
• Радиус скругления углов (px): скруглите углы изображения. Включите Дополнительные опции, чтобы установить каждый угол отдельно, или оставьте выключенным, чтобы применить одинаковый радиус ко всем четырем.

Примечание

Gmail и Apple Mail отображают скругленные углы в отправленном email-сообщении, включая значения для каждого угла. Outlook Desktop игнорирует радиус скругления углов на изображениях, так же как и везде в email-сообщении, поэтому изображения там остаются с прямыми углами.

Переключите холст на Мобильный (см. Редактирование мобильного вида), чтобы установить любой из этих параметров отдельно для экранов телефонов. Отметьте Ширина (мобильный), Высота (мобильный), Кадрирование (мобильный) или Расположение (мобильный), чтобы переопределить этот один параметр, начиная с его значения для десктопа; оставьте флажок снятым, чтобы продолжать наследовать настройку для десктопа. Кадрирование (мобильный) появляется только тогда, когда для Кадрирования на десктопе установлено соотношение сторон, и изменение Кадрирования обратно на Оригинал на десктопе отменяет любое переопределение Кадрирования (мобильный).

Ссылки и отступы

Чтобы при нажатии на изображение открывалась ссылка, введите ее в поле URL ссылки и установите Цель ссылки для открытия в той же или новой вкладке. См. Добавление ссылок для доступных типов ссылок.

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

Видео

Блок Видео добавляет видео с YouTube или Vimeo в email-сообщение в виде кликабельной миниатюры. Почтовые клиенты не могут воспроизводить видео внутри сообщения, поэтому блок показывает статичное изображение с наложением значка ▶. Когда получатель нажимает на него, видео открывается на YouTube или Vimeo. Это работает во всех основных клиентах, включая Outlook.

Выделите блок «Видео» на холсте, чтобы открыть его настройки на правой панели.

• URL видео: вставьте ссылку на YouTube или Vimeo. Редактор автоматически загрузит миниатюру.
• Альтернативный текст: опишите видео для доступности.
• URL миниатюры: сохраните автоматически загруженную миниатюру, или нажмите Добавить миниатюру / Заменить миниатюру, чтобы выбрать ее из Медиагалереи, или вставьте ссылку на размещенное изображение напрямую.
• Наложение кнопки воспроизведения: включено по умолчанию. Выключите, чтобы показать обычную миниатюру без наложения ▶. Наложение недоступно для миниатюр на некоторых внешних хостах. Редактор предупредит вас, когда это применимо, и в email-сообщении будет показана обычная миниатюра.
• Ширина (px), Радиус скругления углов (px) и Выравнивание: контролируют внешний вид миниатюры и ее расположение в макете. Вы можете установить выравнивание отдельно для мобильных устройств.

Карточка

Блок Карточка объединяет изображение с заголовком, текстом и кнопкой в единый готовый макет. Выделите его на холсте, чтобы открыть его настройки на правой панели.

• Макет: выберите, с какой стороны от контента будет находиться изображение.
• Изображение: замените изображение, установите альтернативный текст или отредактируйте подсказку для изображения, созданного с помощью Сгенерировать с помощью ИИ.
• Размер и расположение: поля размера зависят от Макета. Кадрирование доступно для всех макетов. Расположение применяется ко всем макетам:
  • Сверху: Высота устанавливает высоту изображения в пикселях или в процентах от ширины карточки. Ширина (px) сужает изображение до фиксированной ширины в пикселях и центрирует его.
  • Фон: Высота устанавливает высоту карточки в пикселях или в процентах от ее ширины. Поля Ширина (px) нет. Изображение является фоном карточки. Расположение также работает здесь: Заполнение обрезает изображение по размеру карточки — установите точку кадрирования с помощью Фокусная точка — а Вместить масштабирует все изображение внутри нее, размещая его с помощью Установить позицию. Outlook Desktop приблизительно воспроизводит Вместить и игнорирует оба варианта.
  • Слева или Справа: Ширина устанавливает ширину колонки с изображением в пикселях или в процентах от карточки. Высота (px) фиксирует высоту изображения в пикселях. Установка высоты в пикселях сбрасывает соотношение сторон кадрирования ниже. Выбор соотношения сторон кадрирования сбрасывает высоту в пикселях. Вы не можете использовать оба варианта одновременно.
  • Для всех макетов:
    • Кадрирование: выберите Оригинал, чтобы сохранить естественные пропорции изображения, или соотношение сторон (Квадрат (1:1), 4:3, 3:2, 16:9), чтобы обрезать изображение до этого размера.
    • Расположение: выберите Заполнение, чтобы заполнить рамку и обрезать по ней. Установите точку кадрирования с помощью Фокусная точка. Или выберите Вместить, чтобы масштабировать все изображение внутри рамки без обрезки. Позиционируйте его с помощью Установить позицию.
    • Радиус скругления углов (px): скруглите углы изображения. Включите Дополнительные опции, чтобы установить каждый угол отдельно, или оставьте выключенным, чтобы применить одинаковый радиус ко всем четырем. Та же поддержка почтовыми клиентами, что и у любого другого изображения.
• Отступы: установите внутренний отступ вокруг контента карточки.

Кнопка

Кнопка — это кликабельный призыв к действию в email-сообщении.

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

Чтобы установить, что произойдет, когда получатель нажмет на кнопку:

• Нажмите на иконку ссылки на панели инструментов, чтобы открыть Вставить/изменить ссылку.
• Или используйте Тип действия и URL в разделе Ссылка на правой панели.

См. Добавление ссылок для доступных типов действий.

На правой панели, в разделе Стили:

• Выравнивание: по левому краю, по центру или по правому краю.
• Фон: включите, чтобы переопределить стандартный вид, затем выберите Сплошной для сплошного цвета или Градиент для двухточечного линейного градиента (начальный цвет, конечный цвет и угол в градусах, по умолчанию 90°). При выборе градиента кнопка все равно будет отображаться со сплошной заливкой в почтовых клиентах, которые не поддерживают градиентные фоны, например, в Outlook на Windows. Кнопки, у которых уже был сплошной фон, сохраняют его, и открываются с выбранным вариантом Сплошной.
• Цвет текста, Размер шрифта и Семейство шрифтов: включите каждую опцию, чтобы переопределить стандартный вид.
• Радиус скругления углов, Цвет рамки и Ширина рамки: форма и контур кнопки. Gmail и Apple Mail отображают радиус скругления углов кнопки; Outlook Desktop игнорирует его и показывает квадратные углы, так же как и для изображений.
• Ширина: установите фиксированную ширину кнопки или оставьте ее автоматической.
• Внутренний отступ: добавьте пространство внутри кнопки. Используйте Все стороны для равномерного отступа или включите Дополнительные опции, чтобы установить каждую сторону отдельно.

Разделитель

Разделитель — это горизонтальная линия между блоками контента. Используйте его для визуального разделения секций в email-сообщении.

Настройте стиль линии (Сплошная, Пунктирная, Точечная), цвет, толщину и ширину на панели настроек.

HTML

Блок HTML позволяет вставить пользовательский HTML в ваше email-сообщение. Используйте его для пользовательской формы, опроса или встроенного видео.

Над полем для кода нажмите Merge tag, чтобы найти теги вашего аккаунта и вставить Merge Tag в позицию курсора — та же функция персонализации, что описана выше, — или нажмите на иконку эмодзи, чтобы вставить эмодзи таким же образом. Нажмите на вставленный Merge Tag, чтобы открыть ту же панель По умолчанию / Формат, что и в блоках «Заголовок» или «Текст».

Примеры

Форма для лидов

Эта форма для лидов собирает email-адреса для отправки промокода на новогоднюю распродажу.

HTML-код

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body { margin: 0; padding: 20px; font-family: Arial, sans-serif; }
  h2 { font-size: 18px; margin-bottom: 8px; color: #222; }
  p { font-size: 14px; color: #666; margin-bottom: 20px; }
  input {
    width: 100%;
    padding: 12px;
    margin-bottom: 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 15px;
    box-sizing: border-box;
  }
  button {
    width: 100%;
    padding: 14px;
    background: #CC0000;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
  }
</style>
</head>
<body>

<h2>Get your New Year Sale code</h2>
<p>Enter your email and we'll send you an exclusive promo code for up to 50% off.</p>

<div id="form">
  <input type="email" placeholder="Your email address" />
  <button type="button">Get my code</button>
</div>

</body>
</html>

Опрос

Этот опрос спрашивает, какую категорию товаров ищет получатель, и каждая опция ведет на соответствующую страницу распродажи.

HTML-код

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body { margin: 0; padding: 20px; font-family: Arial, sans-serif; text-align: center; }
  h2 { font-size: 18px; margin-bottom: 6px; color: #222; }
  p { font-size: 13px; color: #888; margin-bottom: 20px; }
  .option {
    display: block;
    width: 100%;
    padding: 14px;
    margin-bottom: 10px;
    background: #f5f5f5;
    border: 2px solid transparent;
    border-radius: 10px;
    font-size: 15px;
    cursor: pointer;
    box-sizing: border-box;
    text-decoration: none;
    color: #222;
  }
  .option:hover { border-color: #CC0000; background: #fff5f5; }
</style>
</head>
<body>

<h2>What are you shopping for?</h2>
<p>Pick a category and go straight to your deals</p>

<a class="option" href="https://example.com/sale/clothing">👗 Clothing</a>
<a class="option" href="https://example.com/sale/electronics">📱 Electronics</a>
<a class="option" href="https://example.com/sale/beauty">💄 Beauty</a>
<a class="option" href="https://example.com/sale/home">🏠 Home & Living</a>

</body>
</html>

Видео

Этот пример встраивает промо-видео новогодней распродажи в email-сообщение.

HTML-код

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 20px;
    text-align: center;
  }
  .video-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
  }
  .video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
</style>
</head>
<body>

<h1>New Year Sale — Up to 50% Off</h1>

<div class="video-container">
  <iframe src="https://www.youtube.com/embed/YOUR_VIDEO_ID"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
    allowfullscreen></iframe>
</div>

</body>
</html>

Примечание

Вы также можете добавить ссылку для отписки прямо в HTML-блок:

<a href=%%PW_EMAIL_UNSUBSCRIBE%%>Отписаться</a>

Плейсхолдер %%PW_EMAIL_UNSUBSCRIBE%% заменяется на URL для отписки Pushwoosh при отправке email-сообщения.

Меню

Блок Меню размещает несколько кликабельных элементов в ряд или столбец. Используйте его для навигационной панели или списка контактов компании.

Для каждого элемента меню установите:

• Надпись: текст, который видят получатели
• URL: куда ведет элемент
• Цель: та же вкладка или новая вкладка

В настройках блока вы также можете установить:

• Направление: Горизонтальное или Вертикальное
• Выравнивание: По левому краю, По центру или По правому краю
• Разделитель: необязательный разделитель между элементами
• Шрифт, размер, начертание, межбуквенный интервал и цвета ссылок/текста

Социальные сети

Блок Социальные сети отображает ряд иконок социальных сетей, которые ведут на ваши профили. Используйте его, чтобы направлять получателей на Facebook, Instagram, X и другие платформы из email-сообщения.

Добавьте записи для платформ, затем установите выравнивание, размер иконок и расстояние между ними.

Таймер обратного отсчета

Блок Таймер — это обратный отсчет в email-сообщении. Используйте его для предложений с ограниченным сроком действия, флеш-распродаж и напоминаний о событиях.

Чтобы его настроить:

1. В разделе Обратный отсчет установите Дату окончания и Время окончания, затем выберите Часовой пояс и Язык для надписей таймера.
2. Включите Надписи, чтобы показывать подписи «дни / часы / минуты / секунды» под цифрами, или выключите для отображения только чисел.
3. В разделе Внешний вид установите Фон, Цвет цифр, Цвет надписей и размер шрифта для цифр (по умолчанию 40px) и надписей (по умолчанию 16px).
4. При необходимости настройте Отступы (внутренние отступы).

Таймер отображается как четкое изображение на любом языке и в любом размере, с фоном, который растягивается на всю ширину строки email-сообщения, и версией, отрисованной специально для мобильной ширины, а не уменьшенным изображением для десктопа.

Колонки

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

Перетащите один из этих блоков на холст:

• 2 колонки: две равные колонки
• 3 колонки: три равные колонки
• 4 колонки: четыре равные колонки
• 33 / 67: левая колонка шириной около 33%, правая — около 67%
• 67 / 33: левая колонка шириной около 67%, правая — около 33%

Затем добавьте контент в каждую колонку. Чтобы изменить отступы для всех колонок в email-сообщении, откройте Настройки → Стандартные настройки колонок и настройте внешние отступы, внутренние отступы колонок и расстояние между ними.

Для собственного изображения колонки (которое вы добавляете с помощью Добавить изображение в настройках колонки) в настройках отображается раздел Размер и расположение. Это тот же элемент управления, что и в макете Слева / Справа блока «Карточка». Блок Изображение, перетащенный в колонку, является отдельным элементом контента и сохраняет свои собственные простые поля для настройки размера — см. Изображение.

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

• Ширина: установите ширину изображения в пикселях или в процентах от ширины колонки. Оставьте поле пустым, чтобы заполнить колонку.
• Высота (px): зафиксируйте высоту изображения в пикселях. Установка высоты в пикселях сбрасывает соотношение сторон кадрирования ниже. Выбор соотношения сторон кадрирования сбрасывает высоту в пикселях. Вы не можете использовать оба варианта одновременно.
• Кадрирование: выберите Оригинал, чтобы сохранить естественные пропорции изображения, или соотношение сторон (Квадрат (1:1), 4:3, 3:2, 16:9), чтобы обрезать изображение до этого размера.
• Расположение: выберите Заполнение, чтобы заполнить рамку и обрезать по ней. Установите точку кадрирования с помощью Фокусная точка. Или выберите Вместить, чтобы масштабировать все изображение внутри рамки без обрезки. Позиционируйте его с помощью Установить позицию.
• Радиус скругления углов (px): скруглите углы изображения. Включите Дополнительные опции, чтобы установить каждый угол отдельно, или оставьте выключенным, чтобы применить одинаковый радиус ко всем четырем. Та же поддержка почтовыми клиентами, что и у любого другого изображения.

Примечание

Изображение в колонке, для которого установлена только Высота (px), растягивается до ширины колонки и обрезается до этой высоты.

Продукты

Блок Продукты показывает сетку карточек товаров из одного общего шаблона. Каждая карточка может включать изображение, название, описание, цену и кнопку покупки. Шаблон повторяется для каждого товара.

Нажмите на карточку на холсте, чтобы сделать ее активной и отредактировать:

• Измените название, описание, цену, изображение или ссылку для конкретного товара, чтобы обновить только эту карточку.
• Измените макет шаблона, цвета, отступы или элементы, которые он содержит, чтобы обновить все карточки.

На панели настроек, в разделе Источник, выберите, откуда берутся товары:

• Вручную: введите товары вручную, выберите их из вашего каталога товаров по ID или смешайте оба способа.
• Правило каталога: автоматически загружайте товары по категории и порядку сортировки, обновляя их из каталога в момент отправки.
• Корзина: покажите товары из текущей брошенной корзины каждого получателя.
• Рекомендации: загружайте товары, ранжированные по встроенной стратегии — бестселлеры, новинки, снова в наличии или снижение цены — обновляя их из вашего каталога в момент отправки.

Примечание

Для этих источников требуется наличие Шаблонов контента в вашем тарифном плане. Если переключатель Источник не переключается на Правило каталога, Корзина или Рекомендации, обратитесь в службу поддержки или к вашему менеджеру по работе с клиентами.

Вам также понадобится токен доступа к API (Настройки → Доступ к API), чтобы сохранить email-сообщение. Предпросмотр, запуск Умной проверки и все остальное в редакторе работают без него. Только Сохранение не сработает, и появится уведомление о том, что у блока нет токена доступа к API.

Добавление товаров вручную

Заполните сетку самостоятельно, либо вводя товары вручную, либо выбирая конкретные товары из вашего каталога товаров по ID. Вы можете смешивать оба способа в одном блоке.

• Количество товаров: установите, сколько карточек показывать (1–24).
• Добавить товар: добавьте карточку и самостоятельно заполните ее название, описание, цену, изображение и ссылку.
• Выбрать из каталога…: выберите конкретные товары из вашего каталога товаров вместо того, чтобы вводить их вручную.
• Обновить из каталога: загрузите последние название, описание, цену и изображение для товаров, которые вы выбрали из каталога, на случай, если они изменились с момента их добавления. Не влияет на товары, введенные вручную.
• Изображения товаров: нажмите на миниатюру, чтобы заменить изображение этого товара.
• Ссылки на товары: введите или отредактируйте URL для каждого товара.

Загрузка товаров по правилу каталога

Автоматически загружайте товары по категории и порядку сортировки без ручного выбора.

• Категория: ограничьте выбор конкретной категорией каталога или выберите Все категории.
• Сортировка: выберите порядок, в котором загружаются товары: Сначала новые, Цена: от низкой к высокой, Цена: от высокой к низкой или Название А-Я.
• Количество товаров: установите лимит на количество показываемых карточек (1–12).
• Обновить предпросмотр: пересчитайте предпросмотр на холсте на основе текущего состояния каталога.

Предпросмотр и время отправки

Предпросмотр на холсте показывает товары, которые соответствуют правилу в данный момент. Если каталог изменится до отправки email-сообщения, например, товар закончится на складе или будет добавлен новый, получатели увидят обновленное соответствие в момент отправки, а не в предпросмотре.

Отображение товаров из корзины

Отобразите текущие товары из брошенной корзины получателя.

• Макс. количество товаров: установите лимит на количество показываемых карточек (1–12).
• Предпросмотр корзины пользователя: введите ID пользователя или email и нажмите Предпросмотр корзины, чтобы увидеть, как блок отображается для этого конкретного получателя.

Примечание

Каждый получатель получает свою текущую брошенную корзину в момент отправки. Получатели без нее просто пропускают блок, поэтому нацеливайте свою аудиторию с помощью тега PW_AbandonedCartID. Сам холст показывает примеры карточек, а не реальные данные корзины. См. Как настроить кампанию по брошенным корзинам для полной настройки.

Получение рекомендованных товаров

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

• Стратегия: выберите, как ранжируются товары — Bestsellers (7 days), Bestsellers (30 days), New arrivals, Back in stock, Price drop, Bought together или Based on what they viewed. Выбор Рекомендаций заменяет элемент управления Сортировка из Правила каталога на этот селектор Стратегия.

• Категория: ограничьте выбор конкретной категорией каталога или выберите Все категории.
• Количество товаров: установите лимит на количество показываемых карточек (1–12).
• Обновить предпросмотр: пересчитайте предпросмотр на холсте на основе текущего состояния каталога.

Для «Bought together» нужен тег продукта

Выбор Bought together добавляет поле Тег продукта — введите имя тега устройства, который содержит якорный продукт, и блок покажет товары, часто покупаемые вместе с ним. Если тег не установлен, блок возвращается к обычному каталогу.

Имя тега принимает только буквы, цифры, подчеркивания и пробелы — все остальное отклоняется с встроенной ошибкой, так как тег должен быть адресуемым в Liquid.

Примечание

Bestsellers ранжирует товары исключительно по истории заказов. Bought together строится на основе того же широкого потока взаимодействий, что и Based on what they viewed — просмотры, корзины и покупки, а не только покупки. Новые аккаунты или аккаунты, которые еще не накопили достаточно истории для определенной стратегии, вместо этого получают обычный каталог, пока не накопится достаточно данных.

Настройки блока «Продукты» еще не переведены

Настройки блока «Продукты», включая название источника Recommendations и его стратегии, отображаются на английском языке независимо от языка вашего аккаунта.

Стилизация сетки

После выбора источника эти настройки контролируют внешний вид сетки и ее карточек. Они остаются одинаковыми независимо от используемого источника:

• Колонки: выберите 1, 2 или 3 карточки в ряду. На мобильных устройствах карточки всегда располагаются в одну колонку.
• Промежуток: включите, чтобы установить расстояние между карточками. Выключенное состояние использует значение по умолчанию (16px).
• Лимит описания: лимит символов, до которого обрезается текст описания, чтобы карточки оставались одинакового размера.
• Шаблон карточки: выберите макет, затем установите Фон карточки, Радиус скругления углов карточки и Внутренний отступ контента для каждой карточки.
• Размер и расположение: отображается для каждого макета с изображением. Те же элементы управления Ширина, Высота, Кадрирование и Расположение, что и для размера изображения в блоке Карточка для каждого макета, но размер задается относительно ширины карточки, а не всего email-сообщения.

Настройки Стиль блока ниже стилизуют блок в целом, отдельно от карточек внутри него:

• Фон и Фоновое изображение: установите цвет фона или фоновое изображение для всей сетки. Если установлено изображение, Расположение выбирает, как оно будет размещено в блоке — Заполнение обрезает его по размеру блока, Вместить помещает все изображение внутрь — а Фокусная точка / Установить позицию размещает его. Outlook Desktop показывает только цвет фона и игнорирует изображение, поэтому используйте читаемый цвет фона.
• Цвет рамки, Ширина рамки и Радиус скругления углов: добавьте контур и скругленные углы вокруг всей сетки. Включите Дополнительные опции в радиусе скругления углов, чтобы установить каждый угол отдельно, или оставьте выключенным, чтобы применить одинаковый радиус ко всем четырем. Gmail и Apple Mail отображают его; Outlook Desktop игнорирует его и показывает квадратные углы, так же как и для изображений.
• Скрыть на мобильных и Скрыть на десктопе: скройте весь блок на одном устройстве. См. Показ или скрытие контента в зависимости от устройства.

Как отображается цена со скидкой

Если у товара в вашем каталоге есть цена со скидкой, карточка показывает сниженную цену, а первоначальная цена зачеркнута. Это применяется к Правилу каталога, Корзине и товарам из каталога в режиме Вручную. У товаров, введенных вручную, нет цены со скидкой.

Новости

Блок Новости показывает сетку карточек статей. Каждая карточка может включать изображение, дату, заголовок, краткое содержание и ссылку «Читать далее». Шаблон повторяется для каждой статьи, так же как и для блока Продукты. Новый блок «Новости» начинается с 2 примеров карточек.

На панели настроек, в разделе Источник, выберите, откуда берутся статьи:

• Выбранные: загрузите статьи из RSS или Atom-ленты один раз или выберите конкретные статьи вручную. Они копируются в email-сообщение и больше не изменяются.
• Лента в реальном времени: загружайте статьи из ленты, зарегистрированной для вашего приложения, обновляя их в момент отправки, чтобы каждый получатель получал самые свежие.

Примечание

Для Ленты в реальном времени требуется наличие Шаблонов контента в вашем тарифном плане. Если Источник не переключается на Ленту в реальном времени, Pushwoosh показывает подсказку о том, что динамический контент не включен для аккаунта. Обратитесь в службу поддержки или к вашему менеджеру по работе с клиентами.

Выбор статей из ленты

Нажмите на карточку на холсте, чтобы сделать ее активной и отредактировать:

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

Статьи копируются в контент email-сообщения после их загрузки; в момент отправки ничего больше не загружается. Изображения статей копируются в ваше Медиахранилище и при необходимости конвертируются из WebP в JPEG, так как Outlook не может отображать WebP.

Вставьте URL ленты RSS 2.0 или Atom, затем либо:

• Загрузить последние статьи: замените текущие карточки самыми свежими статьями из ленты, в том же количестве, что у вас уже есть (по умолчанию 2).
• Выбрать статьи…: откройте панель со списком до 12 последних статей ленты, с миниатюрой, заголовком, датой, категорией и автором, и выберите, какие из них добавить. Выбранные статьи добавляются к существующим карточкам, всего до 12; статьи, уже находящиеся на холсте, нельзя выбрать дважды.

Примечание

Если URL ленты пуст, недействителен или в ленте нет статей, Pushwoosh показывает ошибку и оставляет текущие карточки без изменений.

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

• Изображения статей: нажмите на миниатюру, чтобы заменить изображение этой статьи.
• Ссылки на статьи: отображается, когда шаблон карточки имеет ссылку, привязанную к статье (кнопка «Читать далее» по умолчанию). Перечисляет каждую статью по заголовку, чтобы вы могли отредактировать или переопределить ее URL-адрес назначения, изначально взятый из ленты.

Загрузка статей из ленты в реальном времени

Статьи загружаются при отправке email-сообщения, поэтому каждый получатель получает самые свежие. Вместо того, чтобы выбирать статьи самостоятельно, выберите ленту и лимит:

• Зарегистрированная лента: выберите ленту, уже зарегистрированную для вашего приложения, или Все ленты приложения, чтобы загружать из всех. Эта панель только выбирает ленту, она не регистрирует ее; если лент еще нет, обратитесь в службу поддержки или к вашей команде по работе с клиентами, чтобы добавить одну для вашего приложения.
• Фильтр по категориям: необязательный текстовый фильтр, который сопоставляется с категорией статьи из ленты (по умолчанию: любая категория).
• Статьи: сколько карточек показывать (1–12, по умолчанию 3).
• Обновить предпросмотр: пересчитайте предпросмотр на холсте на основе текущего состояния ленты. Если лента не возвращает статей, Pushwoosh оставляет текущие карточки без изменений; если лента недоступна, Pushwoosh показывает ошибку.

Предпросмотр и время отправки

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

Примечание

Отсутствующая, пустая или недоступная лента, включая зарегистрированную ленту, которая была удалена, не приводит к сбою отправки: Pushwoosh скрывает сетку карточек для этого получателя, в то время как фон и рамка блока все равно отображаются. Только неправильно настроенная ссылка на ленту, например, поврежденное приложение или источник ленты, вместо этого возвращается к карточкам, уже находящимся на холсте.

Стилизация сетки

После выбора источника эти настройки контролируют внешний вид сетки и ее карточек. Они остаются одинаковыми независимо от используемого источника:

• Колонки: выберите 1, 2 или 3 карточки в ряду. На мобильных устройствах карточки всегда располагаются в одну колонку.
• Промежуток: включите, чтобы установить расстояние между карточками. Выключенное состояние использует значение по умолчанию (16px).
• Лимит краткого содержания: лимит символов, до которого обрезается краткое содержание статьи, чтобы карточки оставались одинакового размера.
• Шаблон карточки: выберите макет, затем установите Фон карточки, Радиус скругления углов карточки и Внутренний отступ контента для каждой карточки. Для макета Слева или Справа включите Обтекание текста вокруг изображения, чтобы заголовок и краткое содержание обтекали изображение, а не оставались в фиксированной колонке. Размер и расположение (Ширина, Высота, Кадрирование, Расположение) работает так же, как и размер изображения в блоке Карточка для каждого макета, но размер задается относительно ширины карточки.

Настройки Стиль блока ниже стилизуют блок в целом, отдельно от карточек внутри него:

• Фон и Фоновое изображение: установите цвет фона или фоновое изображение для всей сетки. Если установлено изображение, Расположение выбирает, как оно будет размещено в блоке — Заполнение обрезает его по размеру блока, Вместить помещает все изображение внутрь — а Фокусная точка / Установить позицию размещает его. Outlook Desktop показывает только цвет фона и игнорирует изображение, поэтому используйте читаемый цвет фона.
• Цвет рамки, Ширина рамки и Радиус скругления углов: добавьте контур и скругленные углы вокруг всей сетки. Включите Дополнительные опции в радиусе скругления углов, чтобы установить каждый угол отдельно, или оставьте выключенным, чтобы применить одинаковый радиус ко всем четырем. Gmail и Apple Mail отображают его; Outlook Desktop игнорирует его и показывает квадратные углы, так же как и для изображений.
• Скрыть на мобильных и Скрыть на десктопе: скройте весь блок на одном устройстве. См. Показ или скрытие контента в зависимости от устройства.

Примечание

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

Сохранение и повторное использование блоков

Сохраните блок, чтобы повторно использовать его в этом или других email-сообщениях, вместо того чтобы каждый раз создавать его заново.

1. Нажмите на блок (на его рамку или фон, а не на текст или кнопку внутри), чтобы выделить его. Карточка, Колонки и Социальные сети — примеры блоков, которые работают таким образом. Чтобы сохранить несколько блоков вместе, Shift-кликните по другим соседним блокам на холсте или в панели слоев, чтобы расширить выделение до непрерывного диапазона. Сохранение не предлагается для диапазона, который включает уже синхронизированный блок или пустой плейсхолдер ИИ.
2. Нажмите на иконку закладки на панели инструментов блока и дайте ему имя.

Сохраненные блоки появляются в разделе Сохраненные блоки внизу вкладки Блоки.

• Перетащите сохраненный блок на холст или нажмите на него, чтобы добавить в конец email-сообщения.
• Нажмите на × на плитке сохраненного блока, чтобы удалить его.

Синхронизация копий

При сохранении блока включите Синхронизировать копии, чтобы связать каждую вставленную копию с одним и тем же источником. Отредактируйте источник один раз, и изменение применится везде, где используется этот блок, включая уже запланированные к отправке email-сообщения.

Сохранение диапазона блоков работает так же. Pushwoosh оборачивает выделенные блоки в Группу, контейнерный блок, который отображается как отдельная строка в панели слоев, чтобы у синхронизации был единый корень, а затем связывает каждую вставленную копию с этой группой. Отредактируйте любой блок внутри нее и примените изменение, чтобы обновить всю группу везде, где она используется.

Синхронизированная копия заблокирована на холсте. Вы не можете редактировать ее напрямую. Выделите копию, чтобы открыть ее настройки:

• Редактировать синхронизированный блок: разблокируйте эту копию, чтобы вы могли ее изменить. Вверху появится баннер. Нажмите Применить ко всем, чтобы сохранить изменения в источнике и во всех других копиях, или Отменить, чтобы отменить их. Вы можете разблокировать только один синхронизированный блок за раз.
• Обновить из источника: замените эту копию последней версией из источника.
• Отсоединить от источника: отсоедините эту копию от источника, чтобы вы могли редактировать ее самостоятельно.

Пока синхронизированный блок разблокирован для редактирования, остальная часть email-сообщения заблокирована для предотвращения случайных правок:

• На холсте и в панели слоев все, что находится за пределами блока, затемнено и не имеет маркера перетаскивания или меню — нажатие, перетаскивание, дублирование или удаление этих строк не имеет эффекта.
• При выборе чего-либо за пределами блока на панели настроек отображается Завершите редактирование синхронизированного блока, чтобы редактировать остальную часть email-сообщения вместо полей этого элемента.
• В панели слоев редактируемый блок помечен как Синхронизированный блок (редактирование) с иконкой редактирования.
• Кнопка Сохранить отключена, с подсказкой, объясняющей, что сохранение сейчас сохранит email-сообщение со старым содержимым блока.

Примените или отмените изменения, чтобы снова разблокировать остальную часть email-сообщения.

Примечание

Каждый раз, когда вы открываете email-сообщение, Pushwoosh проверяет его синхронизированные копии и обновляет все, что устарело. Уведомление показывает, сколько копий было обновлено. Если в источнике есть более новый контент, в настройках копии отображается предупреждение, пока вы не откроете email-сообщение заново или не нажмете Обновить из источника. Если источник был удален, копия сохраняет свое последнее содержимое, и вы можете только Отсоединить от источника.

Добавление ссылок

Используйте диалоговое окно Вставить/изменить ссылку, чтобы установить, что произойдет, когда получатель нажмет на кнопку или выделенный текст. Выберите Тип действия, затем заполните поля для этого действия.

Открыть сайт

Открывает ссылку, когда получатель нажимает. Введите адрес в поле URL.

Ссылка на управление предпочтениями

Добавляет ссылку на центр управления предпочтениями подписки, где получатели могут выбрать, какие категории email-сообщений они хотят получать. Ссылка вставляется автоматически.

Ссылка для отписки

Позволяет получателям отказаться от подписки в соответствии с правилами и их предпочтениями.

Совет

Вы также можете добавить ссылку для отписки в блоке HTML:

<a href=%%PW_EMAIL_UNSUBSCRIBE%%>Отписаться</a>

Плейсхолдер %%PW_EMAIL_UNSUBSCRIBE%% заменяется на URL для отписки Pushwoosh при отправке email-сообщения.

Что происходит, когда получатель нажимает на ссылку для отписки

Если центр управления предпочтениями подписки включен

Получатель отписывается только от категории, назначенной этому email-сообщению (например, Новостная рассылка). Название категории удаляется из его тега Subscribed Email Categories.

Появляется экран подтверждения с опциями Подписаться снова и Управлять предпочтениями. Узнать больше.

Если центр управления предпочтениями подписки не включен

Получатель отказывается от всех маркетинговых email-сообщений, и для тега Unsubscribed Emails устанавливается значение true. Транзакционные email-сообщения не затрагиваются и будут продолжать доставляться. Узнать больше о типах сообщений.

Важно

Чтобы вы могли доставлять важные email-сообщения вашим клиентам, мы не удаляем отписавшихся пользователей из вашей базы.

Чтобы продолжать отправлять сообщения вовлеченным получателям, создайте сегмент, отфильтрованный по Unsubscribed Emails = false. Чтобы избежать жалоб, не отправляйте email-сообщения получателям, которые отписались.

Клики учитываются в показателе отписок в Истории сообщений.

Ссылка на веб-версию

Предоставляет получателям доступ к веб-версии email-сообщения, что полезно, если у них возникают проблемы с его просмотром в почтовом ящике.

Не отслеживать статистику

Открывает ссылку, когда получатель нажимает, без учета клика в статистике кликов вашего email-сообщения. Введите адрес в поле URL.

Ссылка для подтверждения подписки

Вставляет ссылку для подтверждения отправки формы подписки (например, для подтверждения двойного согласия). Узнать больше о двойном согласии.