Trang này được dịch bởi Cloud Translation API.

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 sống động cùng 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 các chương trình khuyến mãi của bạn ngay trong hộp thư đến của họ. Trên thẻ Khuyến mãi, 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 phải mở email.

Trang này giải thích cách chú thích email bằng JSON-LD và Microdata. Để tìm hiểu thêm về mã đánh dấu email, hãy xem hướng dẫn Bắt đầu. Để biết danh sách các trường đánh dấu mà bạn có thể sử dụng trong chú thích email, hãy truy cập 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 đây trong thẻ Quảng cáo:

Chú thích giao dịch
Băng chuyền sản phẩm

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

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

Chú thích ưu đãi hiển thị thông tin chi tiết dưới dạng văn bản về một chương trình khuyến mãi, chẳng hạn như mã khuyến mãi hoặc ngày hết hạn.

Để tạo chú thích ưu đãi:

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

Trong phần head, hãy thêm một thẻ script có chứa loại dữ liệu 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>

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>

Thay thế các giá trị sau. Tất cả các thuộc tính này là không bắt buộc. Đối với mỗi thuộc tính, bạn có thể đưa vào một giá trị hoặc bỏ thuộc tính đó khỏi mã của mình.

DESCRIPTION (Không bắt buộc): Văn bản hiển thị cùng huy hiệu giao dịch, chẳng hạn như 20% off hoặc Free shipping.
DISCOUNT_CODE (Không bắt buộc): Mã giảm giá hoặc mã khuyến mãi cho ưu đãi, chẳng hạn như 20TODAY.
START_DATE_TIME (Không bắt buộc): Ngày và giờ bắt đầu ưu đãi ở định dạng ISO 8601, chẳng hạn như 2023-09-25T18:44:37-07:00.
END_DATE_TIME (Không bắt buộc): Ngày và giờ kết thúc của chương trình khuyến mãi ở định dạng ISO 8601, chẳng hạn như 2023-10-25T18:44:37-07:00.

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

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

Băng chuyền sản phẩm cho thấy 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 cho thấy một băng chuyền gồm 3 hình ảnh xem trước của ưu đãi tất.

Bạn có thể đưa tối đa 10 hình ảnh xem trước vào 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ị của bạn, hãy tạo một email và mở trình chỉnh sửa HTML của email.

Trong phần head, hãy thêm một 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ể thêm giá trị hoặc bỏ thuộc tính đó khỏi mã của mình.

IMAGE_URL: URL dẫn đến hình ảnh của bạn ở đị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 trong thẻ Quảng cáo, họ sẽ truy cập URL này.
HEADLINE (Không bắt buộc): Nội dung mô tả gồm 1 đến 2 dòng về chương trình khuyến mãi hiển thị 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 ISO 4217 gồm 3 chữ cái, chẳng hạn như USD. Xác định ký hiệu tiền tệ hiển thị bằng price.
DISCOUNT_VALUE (Không bắt buộc): Số tiền bị 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.

Các bước tiếp theo

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