Как перенести макет письма из Figma в сервис рассылок DashaMail?

Экспорт в HTML и AMP:
Плагин позволяет экспортировать HTML и AMP-код шаблонов писем из Figma для использования в email-рассылке в сервисе DashaMail. Вы можете в пару кликов выгрузить ZIP-архив с версткой, включая все изображения, или воспользоваться готовой интеграцией.
Улучшенное отображение
Плагин Ampier учитывает особенности различных почтовых клиентов, позволяя добиться отличного отображения вашего контента. Благодаря этому, ваши письма будут корректно выглядеть как в Outlook или Yandex, так и в мобильных почтовых приложениях.
Установка плагина
1. Перейдите на страницу сообщества и нажмите “Try it out” для интеграции с DashaMail через Ampier.
2. Альтернативный способ: В любом файле Figma, выберите “Resources/Plugins” (Shift+I), в строке поиска наберите “Ampier” и установите плагин.

Инструкция по импорту шаблонов в DashaMail через Ampier
1. В файле с макетом письма выберите “Main Menu” – “Plugins” и выберите “Ampier Email Template Generator – HTML and AMP”:

Либо кликните по “Resources”, затем перейдите в “Plugins” – “Ampier Email Template Generator – HTML and AMP”:

2. После запуска плагина откроется окно импорта:

На нижней панели нажмите на значок выбора версии и выберите “ampier.ru”:

3. Нажмите “Preview”, чтобы проверить отображение шаблона письма. Если он отображается корректно и правки не требуются, нажмите “Export”:

4. В открывшемся окне вы можете задать название шаблона (1), прописать прехедер (2), добавить AMP и TJML, а также выбрать способ импорта (3):

5. Для импорта в сервис DashaMail, выберите “Export to ESP” – “Choose ESP Integration”:

6. Кликните по иконке “DashaMail” (1). Потребуется указать ключ API (2), его можно получить его в личном кабинете DashaMail в разделе “Интеграции“. Затем нажмите “Add” (3):

7. Готово! Шаблон успешно импортирован в раздел “Шаблоны” и теперь доступен для редактирования в формате HTML.

Следуя этим простым шагам, вы сможете легко и эффективно импортировать ваши макеты из Figma в DashaMail с помощью плагина Ampier, сохраняя при этом качество и точность отображения вашего контента в каждом письме.
Если у вас нет опыта в создании макетов в Figma, рекомендуем воспользоваться файлом, содержащим примеры элементов шаблона от Ampier. Для этого просто перейдите на страницу плагина в Figma и выберите “Open In” – “Playground file”.

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