Перейти к основному содержимому

Блочный редактор для email-шаблона

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

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

Как начать работать в визуальном редакторе?

В главном меню откройте раздел Шаблоны и создайте новый шаблон сообщения. Выберите Редактор → Email.

Перед вами появится окно настройки email-шаблона, в нём выберите "Блочный редактор".

Интерфейс и основные функции редактора

Интерфейс блочного редактора email-шаблонов разделён на несколько ключевых областей:

Центральная рабочая область

Здесь отображается текущий шаблон письма, состоящий из блоков.

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

Кроме того, вам доступны дополнительные действия с блоками вашего шаблона:

  • Редактировать код — предоставляет доступ к HTML-коду выбранного блока для его ручной модификации. Кроме того, вы можете добавлять переменные в редакторе кода.

  • Дублировать — создаёт копию выбранного блока, сохраняя его содержимое, стиль и настройки.
  • Удалить — удаляет весь выбранный блок вместе с его содержимым.

Левая панель

Содержит готовые блоки, разбитые на категории:

  • Блоки — облегчают работу с шаблоном, поскольку представляют собой некие заготовки для пользователя платформы, которые тот, с большой долей вероятности, использует практически в каждом своем Email сообщении.
  • Шапки — блоки для добавления верхней части письма, часто используемые для логотипа или слогана.
  • Изображения — элементы для добавления картинок или баннеров.
  • Тексты — текстовые блоки с настраиваемым размером, цветом и стилем шрифта.
  • Кнопки — блоки с кнопками для призывов к действию (например, "Купить", "Узнать больше").
  • Подвалы — элементы для добавления нижней части письма с контактной информацией, ссылками на политику конфиденциальности и отписку.
  • AMP — блоки с поддержкой AMP-технологий для интерактивных писем.

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

Правая панель

Дизайн — настройка внешнего вида блока, включая: отступы и поля, выравнивание, цвета (фон, кнопки и блоки), настройки изображения.

Структура — позволяет редактировать структуру некоторых блоков, которые состоят из нескольких элементов. Например, вы можете убрать подзаголовок или текст в блоке.

Верхняя панель управления

  1. Кнопка "Предпросмотр" — показывает, как будет выглядеть шаблон письма на экране получателя, с учетом всех добавленных элементов;

  2. Кнопка "Применить" — сохраняет изменения, сделанные в шаблоне;

  3. Крестик (Закрыть) — закрывает редактор;

  4. Кнопки "Отменить действие" и "Вернуть действие";

  5. История — кнопка для просмотра изменений, сделанных ранее;

  6. Карта ссылок — помогает быстро находить, редактировать или проверять ссылки, не просматривая весь шаблон вручную;

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

Работа с шаблоном после создания

После создания шаблона и применения изменений, вам будет доступно несколько действий:

  1. Кнопка "Редактировать" — позволяет вернуться в редактор и внести изменения в шаблон;

  2. Кнопка "Показать код шаблона" — демонстрирует HTML-код созданного шаблона:

предупреждение

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

  1. Кнопка "Редактировать текстовую версию письма" — демонстрирует текстовую версию вашего шаблона, а также позволяет её редактировать.