Огляд адаптивного email-редактора

Робота в адаптивному редакторі eSputnik звільняє від рутини та заощаджує час для сегментації, аналітики та персоналізації листів. Адже для створення email у нашій системі не потрібні знання HTML-коду — верстка здійснюється простим перетягуванням блоків.

Створення повідомлення

1. Перейдіть до розділу Повідомлення → Повідомлення → Email та натисніть кнопку Новий Email.

2. Відкрийте вкладку Тематичні та на лівій панелі виберіть із категорій шаблонів той, що найкраще відповідає вашій кампанії. Шаблони системних листів — скажімо, підтвердження підписки — лежать у групі Trigger-based, у категорії Lifecycle emails.

Вибраний шаблон відкриється в редакторі та буде готовий до редагування.

Інтерфейс редактора

Редактор містить панелі:

1. Керування листом — виконання основних дій з листом: збереження, скасування змін, перегляд перед відправленням, тестування тощо.
2. Структура і модулі — побудова листа за допомогою готових структур і модулів.
3. Блоки контенту — наповнення повідомлення такими елементами як текст, зображення, кнопки, відео тощо.
4. Налаштування листа — задання основних параметрів листа: теми, прихованого прехедера, імені відправника тощо.
5. Загальні стилі — налаштування стилів смуг, заголовків, кнопок та інших елементів оформлення.
6. Коментарі — організація командної роботи над шаблоном.

Панелі в редакторі можна вільно перетягувати, змінюючи їх розташування. Це дозволяє налаштувати інтерфейс під ваш стиль роботи та зробити його максимально зручним.

Панель блоків контенту також можна розширити: потягніть її правий край. У широкій панелі поруч з іконками з'являються назви блоків.

Панель керування листом

На панелі розташовані наступні кнопки:

1. Повернення до списку повідомлень.
2. Скасувати/повторити дію – повернення до попереднього стану або відновлення нещодавно скасованої дії.
3. Історія змін. Показує список усіх дій, виконаних з листом.
4. Ідентифікатор користувача. Показує, хто зараз редагує цей лист або має до нього доступ у реальному часі. Одночасно над листом можуть працювати кілька користувачів — у такому разі відображаються всі їхні ідентифікатори.

Докладніше про спільне створення листів, одночасне редагування та коментарі >

5. Редагування мобільної / десктопної версії. Перемикайтеся між двома режимами, щоб переконатися, що дизайн і верстка виглядають коректно на обох типах пристроїв, і при потребі одразу внесіть зміни.

Докладніше про налаштування адаптивності >

Поруч із кнопками редагування версії відображається поточний розмір HTML-листа (KB).

Рекомендується підтримувати розмір листа в межах 80–100 KB, оскільки поштові клієнти (зокрема Gmail) можуть обрізати контент, якщо HTML перевищує допустимий ліміт. Докладніше >

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

7. Мультимовність (опційно). Створіть мовну версію будь-якого повідомлення. Натисніть кнопку Глобус, вкажіть мову за замовчуванням і додайте мовні версії.

Докладніше про створення мультимовних повідомлень >

8. Додаткові параметри. Через меню з трьома крапками доступні такі параметри:

• Налаштування посилань — увімкнення відстеження кліків, налаштування UTM-міток.
• Вибір препроцесора — механізму для побудови динамічного контенту в листах на основі заздалегідь підготовлених даних. Докладніше про препроцесор >
• Текстова версія листа — використовується, якщо поштовий клієнт не може відобразити HTML. За замовчуванням її створює система, але можна згенерувати текст на основі HTML і відредагувати його вручну — правки зберігаються разом із листом. Email-повідомлення містить текстову та HTML-версії, а також може містити AMP-версію. Текстова версія генерується автоматично з HTML-версії, і поштові провайдери вимагають її наявності, тому її поява в коді надісланого листа — стандартна поведінка, а не сторонній код.
• Власні шрифти — дозволяє додати або підключити кастомні шрифти.
• Налаштування динамічного контенту — дозволяє показувати персоналізований вміст різним отримувачам залежно від сегментації або їх поведінки.
• Копіювання AMP HTML до буфера обміну — швидке отримання AMP-коду листа для тестування, налагодження чи повторного використання.

9. Редактор коду. Режим ручного редагування HTML для зміни коду напряму.

10. Попередній перегляд листа. Лист без елементів редактора, відображений так, як його бачитиме одержувач, без фактичного надсилання.

11. Протестувати. Надішліть лист на свою або іншу email-адресу, щоб перевірити, як він виглядатиме у реальній поштовій скриньці.

Можна ввести декілька адрес електронної пошти розділених комами. Щоб редагувати пошту — натисніть на неї, після чого з'явиться кнопка Редагувати.

Натиснувши стрілку поруч із кнопкою Протестувати, ви також можете запустити Перевірку доступності — інструмент, який сканує лист і знаходить елементи, складні для сприйняття людьми з порушеннями зору чи когнітивними особливостями, а також підказує, як їх виправити.

Докладніше про перевірку доступності листа >

12. Зберегти і вийти — зберігає поточні зміни в листі та повертає до списку листів.

Спадне меню містить такі опції:

• Зберегти — зберігає поточні зміни в листі без виходу з редактора.
• Зберегти як шаблон — зберігає лист як шаблон.

13. Створити розсилку — перехід до налаштування й запуску кампанії.

Чат підтримки

В email-редактор вбудовано чат Intercom. Якщо під час роботи над листом виникнуть запитання, ви можете звернутися до служби підтримки, не виходячи з редактора та не втрачаючи контекст роботи.