Эта страница переведена с помощью Cloud Translation API.

Комментируйте электронные письма на вкладке «Акции».

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

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

На этой странице объясняется, как аннотировать электронные письма с помощью JSON-LD и микроданных . Подробнее о разметке электронных писем см. в руководстве « Начало работы ». Список полей разметки, которые можно использовать в аннотациях электронных писем, см. в справочной документации .

Создание аннотаций к электронным письмам

Вы можете аннотировать электронные письма, чтобы отображать следующие функции на вкладке «Акции»:

Аннотации к сделкам
Карусели продуктов
Предварительный просмотр одного изображения

В следующих разделах объясняется, как создать каждый тип аннотации электронной почты.

Создать аннотацию к сделке

Аннотации к предложениям содержат текстовую информацию об акции, например промокод или срок действия.

Чтобы создать аннотацию к сделке:

На вашей платформе для маркетинговой электронной почты создайте электронное письмо и откройте HTML-редактор письма.

В разделе head добавьте тег script , включающий тип данных DiscountOffer :

JSON-LD

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    <script type="application/ld+json">
      [{
        "@context": "http://schema.org/",
        "@type": "DiscountOffer",
        "description": "DESCRIPTION",
        "discountCode": "DISCOUNT_CODE",
        "availabilityStarts": "START_DATE_TIME",
        "availabilityEnds": "END_DATE_TIME"
      }]
    </script>
  </head>

  <body>
    // The message of your email
  </body>
</html>

Микроданные

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    <div itemscope itemtype="http://schema.org/DiscountOffer">
      <meta itemprop="description" content="DESCRIPTION"/>
      <meta itemprop="discountCode" content="DISCOUNT_CODE"/>
      <meta itemprop="availabilityStarts" content="START_DATE_TIME"/>
      <meta itemprop="availabilityEnds" content="END_DATE_TIME"/>
    </div>
  </head>

  <body>
    // The message of your email.
  </body>
</html>

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

DESCRIPTION (Необязательно): Текст, который отображается со значком предложения, например, 20% off или Free shipping .
DISCOUNT_CODE (Необязательно): код скидки или промокод для предложения, например, 20TODAY .
START_DATE_TIME (Необязательно): дата и время начала действия предложения в формате ISO 8601 , например, 2023-09-25T18:44:37-07:00 .
END_DATE_TIME (Необязательно): Дата и время окончания акции в формате ISO 8601 , например, 2023-10-25T18:44:37-07:00 .

В теге body напишите текст вашего письма.

Создать карусель продуктов

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

Рекламное письмо, в котором отображается карусель из трех изображений-превью с предложениями по продаже носков.

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

Чтобы создать карусель товаров:

На вашей платформе для маркетинговой электронной почты создайте электронное письмо и откройте HTML-редактор письма.

В разделе head добавьте тег script . Для каждого изображения в карусели товаров добавьте объект PromotionCard :

JSON-LD

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    <script type="application/ld+json">
      [
        // Build the first image preview in your product carousel:
        {
          "@context": "http://schema.org/",
          "@type": "PromotionCard",
          "image": "IMAGE_URL1",
          "url": "PROMO_URL1",

          // Optionally, include the following PromotionCard properties:
          "headline": "HEADLINE1",
          "price": PRICE1,
          "priceCurrency": "PRICE_CURRENCY1",
          "discountValue": DISCOUNT_VALUE1,
          "position": POSITION
        },

        // Build the second image preview in your product carousel:
        {
          "@context": "http://schema.org/",
          "@type": "PromotionCard",
          "image": "IMAGE_URL2",
          "url": "PROMO_URL2",

          // Optionally, include the following PromotionCard properties:
          "headline": "HEADLINE2",
          "price": PRICE2,
          "priceCurrency": "PRICE_CURRENCY2",
          "discountValue": DISCOUNT_VALUE2,
          "position": POSITION
        }

        // To include more image previews, add additional PromotionCard objects.
        // You can include up to 10 image previews in a product carousel.

      ]
    </script>
  </head>

  <body>
    // The message of your email
  </body>
</html>

Микроданные

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    // Build the first image preview in your product carousel:
    <div itemscope itemtype="http://schema.org/PromotionCard">
      <meta itemprop="image" content="IMAGE_URL1"/>
      <meta itemprop="url" content="PROMO_URL1"/>

      // Optionally, include the following PromotionCard properties:
      <meta itemprop="headline" content="HEADLINE1"/>
      <meta itemprop="price" content="PRICE1"/>
      <meta itemprop="priceCurrency" content="PRICE_CURRENCY1"/>
      <meta itemprop="discountValue" content="DISCOUNT_VALUE1"/>
      <meta itemprop="position" content="POSITION"/>
    </div>

    // Build the second image preview in your product carousel:
    <div itemscope itemtype="http://schema.org/PromotionCard">
      <meta itemprop="image" content="IMAGE_URL2"/>
      <meta itemprop="url" content="PROMO_URL2"/>

      // Optionally, include the following PromotionCard properties:
      <meta itemprop="headline" content="HEADLINE2"/>
      <meta itemprop="price" content="PRICE2"/>
      <meta itemprop="priceCurrency" content="PRICE_CURRENCY2"/>
      <meta itemprop="discountValue" content="DISCOUNT_VALUE2"/>
      <meta itemprop="position" content="POSITION"/>
    </div>

    // To include more image previews, add additional PromotionCard objects.
    // You can include up to 10 image previews in a product carousel.
  </head>

  <body>
    // The message of your email
  </body>
</html>

Для каждого объекта PromotionCard замените следующие значения. Для необязательных свойств вы можете либо включить значение, либо исключить свойство из кода.

IMAGE_URL : URL-адрес изображения в формате PNG или JPEG, например, https://www.example.com/image.png . Поддерживаемые соотношения сторон: 4:5, 1:1, 1,91:1. Для каруселей товаров каждое изображение должно иметь уникальный URL-адрес и использовать одинаковое соотношение сторон.
PROMO_URL : URL-адрес рекламной акции. Когда пользователи нажимают на изображение на вкладке «Акции», они переходят по этому URL-адресу.
HEADLINE (Необязательно): 1-2-строчное описание акции, которое отображается под изображением предварительного просмотра.
PRICE (Необязательно): Цена акции.
PRICE_CURRENCY (Необязательно): Валюта цены в трёхбуквенном формате ISO 4217 , например, USD . Определяет символ валюты, отображаемый вместе с price .
DISCOUNT_VALUE (Необязательно): Сумма, вычитаемая из price для отображения скорректированной цены. Скорректированная цена отображается рядом с исходной ценой.
Например, если discountValue равно 25 , price — 100 , а priceCurrency — USD , скорректированная цена отображается как $75 .
POSITION (Необязательно): Положение карточки в карусели.

В теге body напишите текст вашего письма.

Создайте предварительный просмотр одного изображения

Аннотации предварительного просмотра одного изображения отображают одно изображение для демонстрации важного продукта на вкладке «Промо» Gmail, например:

Рекламное письмо с изображением обуви, значком скидки 20% и промокодом 20TODAY

Эту функцию можно использовать для одного изображения. Все получатели должны получить одно и то же изображение и его URL-адрес. Подробнее см. в разделе часто задаваемых вопросов .

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

На вашей платформе для маркетинговой электронной почты создайте электронное письмо и откройте HTML-редактор письма.
В разделе head добавьте тег script , включающий тип данных PromotionCard :
JSON-LD
```
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    <script type="application/ld+json">
      [{
        "@context": "http://schema.org/",
        "@type": "PromotionCard",
        "image": "IMAGE_URL",
        "url": "PROMO_URL",

        // Optionally, include the following PromotionCard properties:
        "headline": "HEADLINE",
        "price": PRICE,
        "priceCurrency": "PRICE_CURRENCY",
        "discountValue": DISCOUNT_VALUE
      }]
    </script>
  </head>

  <body>
    // The message of your email
  </body>
</html>
```
Микроданные
```
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    // Build the first image preview in your product carousel:
    <div itemscope itemtype="http://schema.org/PromotionCard">
      <meta itemprop="image" content="IMAGE_URL"/>
      <meta itemprop="url" content="PROMO_URL"/>

      // Optionally, include the following PromotionCard properties:
      <meta itemprop="headline" content="HEADLINE"/>
      <meta itemprop="price" content="PRICE"/>
      <meta itemprop="priceCurrency" content="PRICE_CURRENCY"/>
      <meta itemprop="discountValue" content="DISCOUNT_VALUE"/>
    </div>

  </head>

  <body>
    // The message of your email
  </body>
</html>
```
Замените следующие значения. Для необязательных свойств вы можете либо включить значение, либо исключить свойство из кода.
- IMAGE_URL : URL-адрес изображения для предварительного просмотра в формате PNG или JPEG, например, https://www.example.com/image.png . Поддерживаемое соотношение сторон — 1,91:1.
- PROMO_URL : Когда пользователь нажимает на image , URL-адрес перенаправляет на рекламную акцию.
- HEADLINE (Необязательно): 1-2-строчное описание акции, которое отображается под изображением предварительного просмотра.
- PRICE (Необязательно): Цена акции.
- PRICE_CURRENCY (Необязательно): Валюта цены в трёхбуквенном формате ISO 4217 , например, USD . Определяет символ валюты, отображаемый вместе с price .
- DISCOUNT_VALUE (Необязательно): Сумма, вычитаемая из price для отображения скорректированной цены. Скорректированная цена отображается рядом с исходной ценой.
  Например, если discountValue равно 25 , price — 100 , а priceCurrency — USD , скорректированная цена отображается как $75 .
В теге body напишите текст вашего письма.

Следующие шаги

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

Комментируйте электронные письма на вкладке «Акции». Оптимизируйте свои подборки Сохраняйте и классифицируйте контент в соответствии со своими настройками.

Создание аннотаций к электронным письмам

Создать аннотацию к сделке

JSON-LD

Микроданные

Создать карусель продуктов

JSON-LD

Микроданные

Создайте предварительный просмотр одного изображения

JSON-LD

Микроданные

Следующие шаги

Комментируйте электронные письма на вкладке «Акции».