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


В карусель можно включить до 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, например:


Эту функцию можно использовать для одного изображения. Все получатели должны получить одно и то же изображение и его 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напишите текст вашего письма.
Создать аннотацию к сделке
Сделайте свое письмо заметным с помощью аннотации к сделке. Эта функция добавляет рекламный значок прямо в ваше письмо во входящих, указывая ключевую информацию, например, код скидки или подробности предложения, прямо рядом с темой письма.


Чтобы включить аннотацию сделок, выполните следующие действия:
Добавьте схему в HTML-код вашего письма : в вашей маркетинговой платформе email-маркетинга откройте 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% на весь товар» или «Купите один товар, получите второй бесплатно».
DISCOUNT_CODE: промокод, который пользователь должен применить при оформлении заказа.- Пример: 20TODAY.
END_DATE_TIME: Дата и время окончания акции в формате ISO 8601 .- Пример: 2025-09-23T18:44:37-07:00.
Настоятельно рекомендуемые объекты:
START_DATE_TIME: Дата и время начала акции в формате ISO 8601 .- Пример: 2025-08-24T18:44:37-07:00.
Напишите сообщение электронной почты : в теге
<body>напишите сообщение и спроектируйте макет вашего электронного письма, как вы это обычно делаете.Проверьте и просмотрите свою карту : перед отправкой кампании проверьте свой код и просмотрите предварительный просмотр того, как будет выглядеть ваша аннотация к сделке.
Создать карточку сделки
Карточки предложений — это визуальные обзоры ваших акций, создаваемые Gmail. Они могут отображаться на вкладке «Акции» и в самом письме, обеспечивая максимальную заметность ваших предложений.


Чтобы включить карты сделок, выполните следующие действия:
Добавьте схему в HTML-код вашего письма : в вашей маркетинговой платформе email-маркетинга откройте 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" "offerPageUrl": "OFFER_PAGE_URL" "merchantHomepageUrl": "MERCHANT_HOMEPAGE_URL" }] </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"/> <meta itemprop="offerpageurl" content="OFFER_PAGE_URL"/> <meta itemprop="merchantHomepageUrl" content="MERCHANT_HOMEPAGE_URL"/> </div> </head> <body> // The message of your email. </body> </html>Настройте свойства карточки предложения : обновите значения в скрипте в соответствии с вашей конкретной акцией.
Требуемые свойства:
DESCRIPTION: Краткое, убедительное изложение вашего предложения.- Пример: «Скидка 20% на весь товар» или «Купите один товар, получите второй бесплатно».
По крайней мере один из следующих URL-адресов: Мы рекомендуем указать URL-адрес страницы предложения.
OFFER_PAGE_URL: URL целевой страницы данного предложения. Это создаст кнопку «Купить сейчас» (или аналогичную) на карточке предложения. Если эта кнопка указана, мы будем использовать URL страницы предложения.MERCHANT_HOMEPAGE_URL: Используйте этот параметр только если страница с конкретным предложением недоступна. Ссылка будет вести на вашу главную страницу.
Настоятельно рекомендуемые объекты:
DISCOUNT_CODE: промокод, который пользователь должен применить при оформлении заказа.- Пример: 20TODAY.
START_DATE_TIME: Дата и время начала акции в формате ISO 8601 .- Пример: 2025-08-24T18:44:37-07:00.
END_DATE_TIME: Дата и время окончания акции в формате ISO 8601 .- Пример: 2025-09-23T18:44:37-07:00.
Напишите сообщение электронной почты : в теге
<body>напишите сообщение и спроектируйте макет вашего электронного письма, как вы это обычно делаете.Проверьте и просмотрите свою карту : перед отправкой кампании проверьте свой код и просмотрите предварительный просмотр того, как будет выглядеть ваша аннотация к сделке.
Следующие шаги
- Ознакомьтесь со справочной документацией , чтобы узнать о доступных полях разметки электронной почты.
- Узнайте о передовых методах создания аннотаций к электронным письмам.