使用 Shopify 設定 UET 標籤

如果您的網站是建在 Shopify 上,請閱讀本文來了解如何在上面設定 UET 標籤。
注意
  • 本文說明如何使用 Shopify 進行基本的 UET 標籤設定。如需詳細資訊,請參閱 Shopify 說明中心
  • 對於 Microsoft Advertising 的程序或文件,或是 Shopify 的程序或文件所發生的變更,Shopify 概不負責。
  • 下載 Shopify 專用的 Microsoft Advertising 應用程式,能讓系統自動建立 UET 標籤,然後將該標籤加到您網站的每一個頁面中。請移至安裝應用程式頁面,然後照著提示來安裝 Shopify 專用的 Microsoft Advertising 應用程式。

如果您是在 Shopify 上建立及管理網站,可以在該處新增及管理您的 UET 標籤。

使用 Shopify 實作 UET

  1. 在 Microsoft Advertising 中,選取 [工具] > [UET 標籤],然後複製您的 JavaScript UET 標籤追蹤程式碼。
  2. 登入您的 Shopify 帳戶。
    1. 選取 [Online Store] (線上商店) > [Themes] (佈景主題)。
    2. 在 [Current theme] (目前佈景主題) 下,選取 [Actions] (動作) > [Edit code] (編輯程式碼)。在 Shopify 的 [Themes] (佈景主題) 區段編輯程式碼
  3. 安裝 UET 標籤。
    1. [Layout] (版面配置) 下,選取 [theme.liquid]
      選取 [theme.liquid]
    2. 向下捲動頁面,直到看到 <head> 為止。捲動到 head 標籤
    3. 將 UET 標籤貼到就在 {{ content_for_header }} 之上的位置。
    4. 選取 [Save] (儲存)。將 UET 標籤貼在標頭內容的上方
  4. 自訂您的線上結帳程序。
    1. 在左側功能表的底部,選取 [Settings] (設定)。
    2. 選取 [Checkout] (結帳)。選取 [Settings] (設定) > [Checkout] (結帳)
    3. 向下捲動到 [Additional scripts] (額外指令碼) 欄位。將 UET 標籤貼到 [Additional scripts] (額外指令碼) 中。將 UET 標籤貼到 [Additional scripts] (額外指令碼) 中
    4. 選取 [Save] (儲存)。
  5. 若要回報變動收入,請在上一個步驟貼上的 UET 追蹤程式碼下,新增下列其中一個程式碼片段:
    1. 若要排除稅金和運費,請使用以下程式碼:
      <script> window.uetq = window.uetq || []; window.uetq.push('event', '', { 'revenue_value': {{ subtotal_price | money_without_currency }}, 'currency': '{{ shop.currency }}' }); </script>
    2. 若要納入稅金和運費,請使用以下程式碼:
      <script> window.uetq = window.uetq || []; window.uetq.push('event', '', { 'revenue_value': {{ total_price | money_without_currency }}, 'currency': '{{ shop.currency }}' }); </script>
注意

若要驗證您的 Shopify UET 標籤已在正常運作,請下載並安裝 UET 標籤協助程式。移至您的 Shopify 網站,然後確認您因此收到了 UET 事件,而且 [Tag ID] (標籤 ID) 與您在步驟 1 中選取的標籤相符。

如何在 Shopify 針對動態再行銷修改我的 UET 標籤?

  1. 在 Shopify 中,移至 [Online Store] (線上商店) > [Customize] (自訂)。
  2. 選取 [Theme actions ellipsis] (佈景主題動作省略符號),然後選取 [Edit code] (編輯程式碼)。
  3. [Templates] (範本) 下,找到 [index.liquid]
  4. 使用 [一般訪客] 適用的以下程式碼:
    <script> var productList = []; {% for product in collections.frontpage.products %} productList.push({{ product.id }}); {% endfor %} window.uetq = window.uetq || []; window.uetq.push('event', '', {'ecomm_prodid': productList, 'ecomm_pagetype': 'home'}); </script>
  5. 選取 [Save] (儲存)。
  6. [Templates] (範本) 下,找到 [search.liquid]
  7. 使用 [產品搜尋者] 適用的以下程式碼:
    <script> var productList = []; {% for item in search.results %} {% if item.object_type == 'product' %} productList.push({{ item.id }}); {% endif %} {% endfor %} window.uetq = window.uetq || []; window.uetq.push('event', '', {'ecomm_prodid': productList, 'ecomm_pagetype': 'searchresults'}); </script>
  8. 選取 [Save] (儲存)。
  9. [Templates] (範本) 下,找到 [product.liquid]
  10. 使用 [產品檢視者] 適用的以下程式碼:
    <script> window.uetq = window.uetq || []; window.uetq.push('event', '', {'ecomm_prodid': '{{product.id}}', 'ecomm_pagetype': 'product'}); </script>
  11. 選取 [Save] (儲存)。
  12. [Templates] (範本) 下,找到 [cart.liquid]
  13. 使用 [購物車放棄者] 適用的以下程式碼:
    <script> var productList = []; {% for line in cart.items %} productList.push({{ line.product_id}}); {% endfor %} window.uetq = window.uetq || []; window.uetq.push('event', '', {'ecomm_prodid': productList, 'ecomm_pagetype': 'cart'}); </script>
  14. 選取 [Save] (儲存)。
  15. 移至 Settings (設定),然後選取 [Checkout] (結帳)。
  16. [Order Processing] (訂單處理) 下,找到 Additional scripts (其他指令碼) 文字方塊。
  17. 使用 [過去的買家] 適用的以下程式碼:
    <script> var productList = []; {% for line in checkout.line_items %} productList.push({{ line.product_id }}); {% endfor %} window.uetq = window.uetq || []; window.uetq.push('event', '', {'ecomm_prodid': productList, 'ecomm_pagetype': 'purchase'}); </script>
  18. 選取 [儲存]
重要
  • Shopify 中的產品 ID 必須與您 產品摘要中的 ID 相符。
  • Shopify 會自動為您的產品建立產品 ID。您可以設定 Shopify 以 Shopify 產品 ID 更新您的摘要管理解決方案,然後再匯入 Microsoft Merchant Center 中。

See more videos...