Chú thích email trong tab Quảng cáo

Chú thích email giúp email trong thẻ Quảng cáo trở nên sinh động hơn nhờ các tính năng như hình ảnh, ưu đãi và ngày hết hạn.

Khi bạn chú thích email, người dùng Gmail sẽ xem và tương tác với chương trình khuyến mãi của bạn ngay trong hộp thư đến. Trên thẻ Quảng cáo, người dùng có thể nhấp vào văn bản hoặc hình ảnh được chú thích để tìm hiểu thêm về chương trình khuyến mãi mà không cần mở email.

Trang này giải thích cách chú thích email bằng JSON-LD và Vi dữ liệu. Để tìm hiểu thêm về mã đánh dấu email, hãy xem hướng dẫn Bắt đầu sử dụng. Để xem danh sách các trường mã đánh dấu mà bạn có thể sử dụng trong chú thích email, hãy truy cập vào tài liệu tham khảo.

Tạo chú thích email

Bạn có thể chú thích email để hiển thị các tính năng sau trong thẻ Quảng cáo:

Tạo băng chuyền sản phẩm
Tạo bản xem trước dạng một hình ảnh
Tạo chú thích ưu đãi
Tạo thẻ ưu đãi

Các phần sau đây giải thích cách tạo từng loại chú thích email.

Tạo băng chuyền sản phẩm

Băng chuyền sản phẩm hiển thị nhiều bản xem trước hình ảnh cho một chương trình khuyến mãi, chẳng hạn như sau:

Email quảng cáo hiển thị một băng chuyền gồm 3 bản xem trước hình ảnh về các ưu đãi dành cho tất.

Bạn có thể đưa tối đa 10 bản xem trước hình ảnh vào một băng chuyền và mỗi hình ảnh phải là duy nhất.

Cách tạo băng chuyền sản phẩm:

Trong nền tảng email tiếp thị, hãy tạo một email rồi mở trình chỉnh sửa HTML của email đó.

Trong phần head, hãy thêm thẻ script. Đối với mỗi hình ảnh trong băng chuyền sản phẩm, hãy thêm đối tượng 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>

Vi dữ liệu

<!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>

Đối với mỗi đối tượng PromotionCard, hãy thay thế các giá trị sau. Đối với các thuộc tính không bắt buộc, bạn có thể đưa vào một giá trị hoặc bỏ qua thuộc tính đó trong mã.

IMAGE_URL: URL của hình ảnh ở định dạng PNG hoặc JPEG, chẳng hạn như https://www.example.com/image.png. Các tỷ lệ khung hình được hỗ trợ là 4:5, 1:1, 1,91:1. Đối với băng chuyền sản phẩm, mỗi hình ảnh phải có một URL riêng biệt và sử dụng cùng một tỷ lệ khung hình.
PROMO_URL: URL của chương trình khuyến mãi. Khi người dùng nhấp vào hình ảnh trên thẻ Quảng cáo, họ sẽ truy cập vào URL này.
HEADLINE (Không bắt buộc): Nội dung mô tả chương trình khuyến mãi từ 1 đến 2 dòng xuất hiện bên dưới hình ảnh xem trước.
PRICE (Không bắt buộc): Giá của chương trình khuyến mãi.
PRICE_CURRENCY (Không bắt buộc): Đơn vị tiền tệ của giá ở định dạng 3 chữ cái ISO 4217, chẳng hạn như USD. Xác định ký hiệu tiền tệ hiển thị cùng với price.
DISCOUNT_VALUE (Không bắt buộc): Số tiền được trừ khỏi price để hiển thị giá đã điều chỉnh. Giá đã điều chỉnh sẽ xuất hiện bên cạnh giá gốc.

Ví dụ: nếu discountValue là 25, price là 100, và priceCurrency là USD, thì giá đã điều chỉnh sẽ hiển thị là $75.
POSITION (Không bắt buộc): Vị trí của thẻ trong băng chuyền.

Trong thẻ body, hãy viết thông báo cho email của bạn.

Tạo bản xem trước dạng một hình ảnh

Chú thích bản xem trước dạng một hình ảnh hiển thị một hình ảnh để giới thiệu một sản phẩm quan trọng trong Tab Quảng cáo của Gmail, chẳng hạn như sau:

Một email khuyến mãi hiển thị hình ảnh đôi giày, huy hiệu ưu đãi 20% và mã khuyến mãi 20TODAY

Bạn có thể sử dụng tính năng này cho một hình ảnh. Tất cả người nhận phải nhận được cùng một hình ảnh và URL hình ảnh. Hãy xem tài liệu về các câu hỏi thường gặp để biết thêm thông tin.

Cách tạo bản xem trước dạng một hình ảnh:

Trong nền tảng email tiếp thị, hãy tạo một email rồi mở trình chỉnh sửa HTML của email đó.
Trong phần head, hãy thêm thẻ script có chứa kiểu dữ liệu 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>
```
Vi dữ liệu
```
<!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>
```
Thay thế các giá trị sau. Đối với các thuộc tính không bắt buộc, bạn có thể đưa vào một giá trị hoặc bỏ qua thuộc tính đó trong mã.
- IMAGE_URL: URL của hình ảnh xem trước ở định dạng PNG hoặc JPEG, chẳng hạn như https://www.example.com/image.png. Tỷ lệ khung hình được hỗ trợ là 1,91:1.
- PROMO_URL: Khi người dùng nhấp vào image, URL sẽ chuyển hướng đến chương trình khuyến mãi.
- HEADLINE (Không bắt buộc): Nội dung mô tả chương trình khuyến mãi từ 1 đến 2 dòng xuất hiện bên dưới hình ảnh xem trước.
- PRICE (Không bắt buộc): Giá của chương trình khuyến mãi.
- PRICE_CURRENCY (Không bắt buộc): Đơn vị tiền tệ của giá ở định dạng 3 chữ cái ISO 4217, chẳng hạn như USD. Xác định ký hiệu tiền tệ hiển thị cùng với price.
- DISCOUNT_VALUE (Không bắt buộc): Số tiền được trừ khỏi price để hiển thị giá đã điều chỉnh. Giá đã điều chỉnh sẽ xuất hiện bên cạnh giá gốc.
  
  Ví dụ: nếu discountValue là 25, price là 100, và priceCurrency là USD, thì giá đã điều chỉnh sẽ hiển thị là $75.
Trong thẻ body, hãy viết thông báo cho email của bạn.

Tạo chú thích ưu đãi

Giúp email của bạn nổi bật bằng Chú thích ưu đãi. Tính năng này sẽ thêm một huy hiệu khuyến mãi trực tiếp vào email của bạn trong hộp thư đến, nêu bật thông tin chính (như mã giảm giá hoặc thông tin chi tiết về ưu đãi) ngay bên cạnh dòng tiêu đề.

Một email khuyến mãi xem trước huy hiệu ưu đãi giảm 20% và mã khuyến mãi 20TODAY.

Để bật Chú thích ưu đãi, hãy làm theo các bước sau:

Thêm lược đồ vào HTML của email: Trong nền tảng email tiếp thị, hãy mở trình chỉnh sửa HTML cho chiến dịch của bạn. Trong phần head, hãy thêm thẻ script có chứa kiểu dữ liệu DiscountOffer với cấu trúc sau:

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>

Vi dữ liệu

<!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>

Tuỳ chỉnh các thuộc tính của Chú thích ưu đãi: cập nhật các giá trị trong tập lệnh để phù hợp với chương trình khuyến mãi cụ thể của bạn.

Giá trị bắt buộc: Trong mã mẫu, hãy thay thế ít nhất một trong các biến sau để tạo Chú thích ưu đãi.
- DESCRIPTION: Nội dung tóm tắt ngắn gọn và hấp dẫn về ưu đãi của bạn.
  - Ví dụ: "Giảm 20% cho toàn bộ trang web" hoặc "Mua 1 tặng 1".
- DISCOUNT_CODE: Mã khuyến mãi mà người dùng cần áp dụng khi thanh toán.
  - Ví dụ: 20TODAY.
- END_DATE_TIME: Ngày và giờ kết thúc chương trình khuyến mãi ở định dạng ISO 8601.
  - Ví dụ: 2025-09-23T18:44:37-07:00.
Thuộc tính nên có:
- START_DATE_TIME: Ngày và giờ bắt đầu chương trình khuyến mãi ở định dạng ISO 8601.
  - Ví dụ: 2025-08-24T18:44:37-07:00.
Viết nội dung email: trong thẻ <body>, hãy viết nội dung và thiết kế bố cục cho email như bình thường.
Xác thực và xem trước thẻ: trước khi gửi chiến dịch, hãy xác thực mã và xem bản xem trước về cách Chú thích ưu đãi sẽ xuất hiện.

Tạo thẻ ưu đãi

Thẻ ưu đãi là nội dung tóm tắt trực quan về các chương trình khuyến mãi do Gmail tạo. Thẻ này có thể xuất hiện trong thẻ Quảng cáo và trong chính email, giúp ưu đãi của bạn có khả năng hiển thị tối đa.

Một email khuyến mãi xem trước một chiếc xe ưu đãi giảm giá 25% và mã khuyến mãi THÁNG52024.

Để bật Thẻ ưu đãi, hãy làm theo các bước sau:

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>

Vi dữ liệu

<!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>

Tuỳ chỉnh các thuộc tính của Thẻ ưu đãi: Cập nhật các giá trị trong tập lệnh để phù hợp với chương trình khuyến mãi cụ thể của bạn.

Giá trị bắt buộc:
- DESCRIPTION: Nội dung tóm tắt ngắn gọn và hấp dẫn về ưu đãi của bạn.
  - Ví dụ: "Giảm 20% cho toàn bộ trang web" hoặc "Mua 1 tặng 1".
- Ít nhất một trong các URL sau: Bạn nên cung cấp URL trang ưu đãi.
  - OFFER_PAGE_URL: URL của trang đích cho ưu đãi cụ thể này. Thao tác này sẽ tạo nút "Mua sắm ngay" (hoặc tương tự) trên Thẻ ưu đãi. Nếu bạn cung cấp URL này, chúng tôi sẽ ưu tiên URL trang ưu đãi.
  - MERCHANT_HOMEPAGE_URL: Chỉ sử dụng URL này nếu không có trang ưu đãi cụ thể. URL này sẽ liên kết đến trang chủ chính của bạn.
Giá trị nên có:
- DISCOUNT_CODE: Mã khuyến mãi mà người dùng cần áp dụng khi thanh toán.
  - Ví dụ: 20TODAY.
- START_DATE_TIME: Ngày và giờ bắt đầu chương trình khuyến mãi ở định dạng ISO 8601.
  - Ví dụ: 2025-08-24T18:44:37-07:00.
- END_DATE_TIME: Ngày và giờ kết thúc chương trình khuyến mãi ở định dạng ISO 8601.
  - Ví dụ: 2025-09-23T18:44:37-07:00.
Viết nội dung email: trong thẻ <body>, hãy viết nội dung và thiết kế bố cục cho email như bình thường.
Xác thực và xem trước thẻ: trước khi gửi chiến dịch, hãy xác thực mã và xem bản xem trước về cách Chú thích ưu đãi sẽ xuất hiện.

Các bước tiếp theo

Xem tài liệu tham khảo để tìm hiểu về các trường mã đánh dấu email hiện có.
Tìm hiểu về các phương pháp hay nhất cho email chú thích.

Chú thích email trong tab Quảng cáo Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.

Tạo chú thích email

Tạo băng chuyền sản phẩm

JSON-LD

Vi dữ liệu

Tạo bản xem trước dạng một hình ảnh

JSON-LD

Vi dữ liệu

Tạo chú thích ưu đãi

JSON-LD

Vi dữ liệu

Tạo thẻ ưu đãi

JSON-LD

Vi dữ liệu

Các bước tiếp theo

Chú thích email trong tab Quảng cáo