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

AMP-версия письма

Технология AMP позволяет добавлять JavaScript-компоненты в email-письма и делать их интерактивными. В AMP-письме пользователь может пройти опрос, купить товар или подтвердить регистрацию, не переходя на сайт.

Почтовые клиенты требуют специальной регистрации от отправителей AMP-писем. Руководство по добавлению вашего адреса отправителя в разрешённый список вы найдёте в официальной документации AMP.

подсказка

Тем, кто только начинает осваивать amp-технологию, будет полезен этот гайд.

Добавление AMP-версии​

Стандартный email-шаблон включает HTML и текстовую версии письма. Для отправки AMP-писем необходимо в редакторе шаблона установить флажок в поле "Добавить AMP⚡HTML версию письма". Ниже появится дополнительная вкладка "AMP⚡HTML", где вы сможете использовать AMP-компоненты.



подсказка

На данный момент AMP-письма поддерживают следующие почтовые клиенты:

  • Gmail;
  • Yahoo;
  • Mail.ru.

Если письмо придёт на почтовый клиент, который не поддерживает технологию AMP, получатель увидит HTML-версию.

Ссылки в AMP-версии​

В amp-версии письма для наименования ссылок поддерживается только атрибут data-name. При сохранении шаблона платформа автоматически подставит атрибут во все ссылки.

<a href="https://example.com" title="Текст ссылки" data-name="link1">Текст ссылки</a>

Также обратите внимание, если вы добавляете amp-параметр в ссылку, не надо оборачивать ссылку трекингом, иначе она не будет работать. Чтобы отключить трекинг, добавьте атрибут no-track. Клики по такой ссылке отслеживаться не будут.

<a href="${{exampleUrl}}" title="Текст ссылки" data-name="link1" no-track>Текст ссылки</a>

Экранирование шаблонных выражений​

Синтаксис шаблонизации AMP совпадает с синтаксисом шаблонизации Altcraft. Чтобы избежать некорретной обработки кода, необходимо экранировать шаблонные выражения AMP с помощью символа $.

Например, если вы используете компонент <amp-list>, то замените переменную для подстановки элемента списка {{title}} на ${{title}}:

<amp-list id="myList" src="https://foo.com/list.json">
  <template type="amp-mustache">
    <div>${{title}}</div>
  </template>
</amp-list>
Последнее обновление