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

Chú thích email làm cho email trong thẻ Quảng cáo trở nên sống động với 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 cho email, người dùng Gmail sẽ xem và tương tác với quảng cáo của bạn ngay trong hộp thư đến của họ. Trong 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 hãy mở email đó.

Trang này giải thích cách chú thích cho email bằng JSON-LDVi dữ liệu. Người nhận hãy tìm hiểu thêm về đánh dấu email, xem lại Hướng dẫn Bắt đầu sử dụng. Để xem danh sách 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 cho email

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

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 về giao dịch

Chú thích giao dịch hiển thị thông tin chi tiết dựa trên văn bản về 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.

Cách tạo chú thích về giao dịch:

  1. Trong nền tảng email tiếp thị của bạn, hãy tạo một email và mở HTML của email đó trình chỉnh sửa.
  2. Trong phần head, hãy thêm một thẻ script 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ả thuộc tính là không bắt buộc. Đối với mỗi thuộc tính, bạn có thể bao gồm một giá trị hoặc bỏ thuộc tính đó khỏi .

    • DESCRIPTION (Không bắt buộc): Văn bản hiển thị cùng với huy hiệu ưu đãi, 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ờ khi ưu đãi bắt đầu sau 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 quảng cáo ở ISO 8601 chẳng hạn như 2023-10-25T18:44:37-07:00.
  3. Trong thẻ body, hãy viết nội dung thông báo cho email của bạn.

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

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

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

  1. Trong nền tảng email tiếp thị của bạn, hãy tạo một email và mở HTML của email đó trình chỉnh sửa.
  2. Trong phần head, hãy thêm một thẻ script. Đối với mỗi hình ảnh trong sản phẩm băng chuyền, hãy thêm một PromotionCard đối tượng:

    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 thuộc tính không bắt buộc, bạn có thể cung cấp giá trị hoặc bỏ qua thuộc tính bằng mã của bạn.

    • IMAGE_URL: URL đến hình ảnh của bạn trong Định dạng PNG hoặc JPEG, chẳng hạn như https://www.example.com/image.png. Chiến lược phát hành đĩa đơn tỷ lệ khung hình được hỗ trợ là 4:5, 1:1, 1.91:1. Cho băng chuyền sản phẩm, mỗi hình ảnh phải có một URL duy nhất và sử dụng giống nhau tỷ lệ khung hình.
    • PROMO_URL: URL của chương trình khuyến mãi. Thời gian người dùng nhấp vào hình ảnh từ 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ả gồm 1 đến 2 dòng của 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á viết bằng 3 chữ cái ISO 4217 chẳng hạn như USD. Xác định ký hiệu tiền tệ được hiển thị cùng với price.
    • DISCOUNT_VALUE (Không bắt buộc): Số tiền trừ vào price để hiện giá đã điều chỉnh. Số liệu điều chỉnh giá sẽ xuất hiện bên cạnh giá gốc.

      Ví dụ: nếu discountValue25 thì price100priceCurrencyUSD, giá đã điều chỉnh sẽ là $75.

    • POSITION (Không bắt buộc): Vị trí của thẻ trong băng chuyền.

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

Các bước tiếp theo