谷歌SEO教程

WOW Synergy 主题 - Google 跟踪设置完全指南

引言

欢迎使用 WOW Synergy 主题！为了帮助您准确地衡量店铺表现和广告效果，本主题内置了三种不同的 Google 跟踪模式。正确配置跟踪代码是优化广告投放、理解用户行为和提升销售额的关键。

重要提示： 为了避免数据重复计算和代码冲突，您必须在主题设置中选择一种且仅一种跟踪模式。

快速选择指南

如果您是新手，只想快速让网站被Google Analytics收录：
- 推荐模式： 模式一：直接注入
- 优点： 设置最简单，只需填写ID。
- 缺点： 功能非常基础，仅跟踪页面浏览。
如果您需要跟踪核心电商事件（如加购、购买），并希望大部分设置是自动的：
- 推荐模式： 模式二：主题集成 (推荐)
- 优点： 自动化大部分事件，平衡了易用性和功能性。
- 缺点： “购买”事件需要一次性手动设置。
如果您是专业用户，需要最完整、最精确的数据，并希望与Shopify最新标准保持一致：
- 推荐模式： 模式三：Custom Pixel
- 优点： 功能最强大，自动跟踪所有电商事件，数据最准确。
- 缺点： 设置最复杂，需要少量代码编辑。

模式一：直接注入 (基础模式)

是什么？

此模式是三种模式中最基础的一种。它只负责将 Google 的全局站点标签 (gtag.js) 加载到您的网站上。

跟踪事件：仅 page_view (页面浏览)。
不跟踪：加入购物车、购买等任何电子商务事件。

适用场景

刚开始使用 Google Analytics，只想快速实现基础的网站访问量统计。
暂时不关心详细的电子商务转化数据。

如何设置

在 Shopify 后台，进入 在线商店 > 模板 > 自定义。
在左侧菜单中，点击 主题设置。
展开 二、Google 跟踪设置 (总控)。
在“选择 Google 跟踪模式”下拉菜单中，选择 模式一：直接注入。
在下方的“模式一”区域，填写您的 GA4 ID (G-XXXXXXXXXX) 和 Google Ads ID (AW-XXXXXXXXXX)。
点击右上角的保存。

模式二：主题集成 (推荐模式)

是什么？

这是我们为大多数用户推荐的模式。它在易用性和强大的功能之间取得了完美的平衡，能自动跟踪大部分关键的电子商务事件。

自动跟踪事件：
- page_view (页面浏览)
- view_item (查看商品详情页)
- add_to_cart (加入购物车)，包括向 Google Ads 发送“加购”转化。
需要手动设置的事件：
- purchase (购买)，这是最重要的转化事件。

适用场景

希望获得核心电子商务转化数据，以衡量广告效果。
愿意进行一次性的简单手动设置，以换取准确的“购买”转化跟踪。

如何设置

第一步：在主题设置中填写ID

在 主题设置 > 二、Google 跟踪设置 (总控) 中，选择 模式二：主题集成。
在下方的“模式二”区域，准确填写以下信息：
- Google Analytics Measurement ID (GA4 ID)
- Google Ads Conversion ID (Google Ads ID)
- Google Ads “加入购物车”转化标签 (如果您想跟踪此事件)
- (可选) 如果您想手动集成 Meta Pixel，请勾选并填写 Meta Pixel ID。

第二步：【关键】设置“购买”转化事件
由于 Shopify 的安全机制，主题代码无法直接访问最终的“感谢页面”。因此，我们需要使用 Shopify 最新的“客户事件”功能来手动添加“购买”转化跟踪。

进入“客户事件”：
- 在 Shopify 后台，进入 设置 (Settings) > 客户事件 (Customer events)。
添加自定义像素：
- 点击 添加自定义像素 (Add custom pixel)。
- 为像素命名，例如 Google Ads Purchase Tracking，然后点击 添加像素 (Add pixel)。
粘贴代码并修改：
- 在打开的代码编辑器中，删除所有默认代码。
- 将下面的代码完整地复制并粘贴进去：

analytics.subscribe("checkout_completed", (event) => {
  // =========================================================================
  // ▼▼▼ 请在这里填入您的 Google Ads ID 和“购买”转化标签 ▼▼▼
  // =========================================================================
  const googleAdsId = "AW-XXXXXXXXXX"; // <--- 在这里替换您的 Google Ads ID
  const purchaseLabel = "YYYYYYYYYYYYYYYY-YYY"; // <--- 在这里替换您的“购买”转化标签
  // =========================================================================

  const checkout = event.data.checkout;
  if (!googleAdsId.startsWith("AW-") || purchaseLabel === "YYYYYYYYYYYYYYYY-YYY") {
    return;
  }
  
  if (typeof gtag === 'function') {
    gtag('event', 'conversion', {
      'send_to': `${googleAdsId}/${purchaseLabel}`,
      'value': checkout.totalPrice.amount,
      'currency': checkout.currencyCode,
      'transaction_id': checkout.order.id,
    });
  }
});

直接在代码中，将 AW-XXXXXXXXXX 和 YYYYYYYYYYYYYYYY-YYY 替换为您自己的真实 ID 和标签。

保存并连接：
- 点击右上角的 保存 (Save)，然后点击 连接 (Connect) 以激活像素。

模式三：Custom Pixel (专家模式)

是什么？

此模式是功能最强大、最全面的解决方案，完全基于 Shopify 最新的“客户事件”技术。它能够自动跟踪几乎所有的标准电子商务事件，数据最准确，并且最符合 Shopify 的未来发展方向。

自动跟踪所有事件：page_view, view_item, view_item_list, add_to_cart, begin_checkout, purchase 等。
Google Ads 转化：purchase (购买) 和 generate_lead (潜在客户) 的 Google Ads 转化事件也会被自动发送。

适用场景

需要最完整、最精确跟踪数据的专业用户或广告投手。
不介意进行少量代码文件编辑，以换取最强大的功能。

如何设置

第一步：在主题设置中填写ID

在 主题设置 > 二、Google 跟踪设置 (总控) 中，选择 模式三：Custom Pixel。
在下方的“模式三”区域，填写您的 Custom Pixel - GA4 ID 和 Custom Pixel - Google Ads ID。

第二步：激活 Custom Pixel

进入“客户事件”：
- 回到 Shopify 后台，进入 设置 (Settings) > 客户事件 (Customer events)。
添加并配置像素：
- 点击 添加自定义像素 (Add custom pixel)，为其命名 (例如: WOW Synergy Full Tracking)。
- 在打开的代码编辑器中，删除所有默认代码。
- 粘贴以下这一代码：

/*
================================================================================
 Shopify Custom Pixel for Google Analytics 4 & Google Ads (最终完整版)
 Version: 4.3 (即用版)
 作者: AI Assistant

 目的: 完全取代 Google & YouTube 应用及主题代码，实现对所有标准电子商务事件的精确跟踪。
 特点: 
   - ID 从主题设置中动态获取，无需硬编码。
   - 只有在ID被发布后才会初始化，实现条件加载。
   - 包含所有事件的完整参数，未经省略。
   - 完美兼容 Google Ads 转化诊断工具。
   - 增加潜在客户（联系表单提交）跟踪。
================================================================================
*/

// --- 1. 初始化和ID订阅 ---
let GA_ID = 'G-xxxxxxxx';
let GADS_ID = 'AW-xxxxxxxx';
let isGtagInitialized = false;

analytics.subscribe('custom:google_ids_ready', (event) => {
  if (event.data) {
    GA_ID = event.data.ga_id;
    GADS_ID = event.data.gads_id;
  }

  if (GA_ID && !isGtagInitialized) {
    initializeGtag();
    isGtagInitialized = true;
  }
});


// --- 2. 初始化 Google 跟踪代码 (gtag.js) ---
function initializeGtag() {
  (function(w, d, s, l, i) {
    w[l] = w[l] || [];
    w[l].push({
      'gtm.start': new Date().getTime(),
      event: 'gtm.js'
    });
    var f = d.getElementsByTagName(s)[0],
      j = d.createElement(s),
      dl = l != 'dataLayer' ? '&l=' + l : '';
    j.async = true;
    j.src = 'https://www.googletagmanager.com/gtag/js?id=' + i;
    f.parentNode.insertBefore(j, f);
  })(window, document, 'script', 'dataLayer', GA_ID);

  window.dataLayer = window.dataLayer || [];
  function gtag() {
    dataLayer.push(arguments);
  }
  window.gtag = gtag;

  gtag('js', new Date());
  gtag('config', GA_ID);
  if (GADS_ID) {
    gtag('config', GADS_ID);
  }
}


// --- 3. 订阅 Shopify 客户事件 ---
function safeGtag() {
  if (typeof window.gtag === 'function') {
    window.gtag.apply(null, arguments);
  }
}

// 3.1 查看商品 (view_item)
analytics.subscribe('product_viewed', (event) => {
  const variant = event.data.variant;
  if (!variant) return;
  safeGtag('event', 'view_item', {
    currency: variant.price.currencyCode,
    value: parseFloat(variant.price.amount),
    items: [{
      item_id: variant.sku || variant.id,
      item_name: variant.product.title,
      item_variant: variant.title,
      price: parseFloat(variant.price.amount)
    }]
  });
});

// 3.2 查看商品列表 (view_item_list)
analytics.subscribe('collection_viewed', (event) => {
  const collection = event.data.collection;
  if (!collection || !collection.products) return;
  const products = collection.products.map(product => {
      const variant = product.variants[0];
      return {
          item_id: variant.sku || variant.id,
          item_name: product.title,
          price: parseFloat(variant.price.amount)
      };
  });

  safeGtag('event', 'view_item_list', {
    item_list_id: collection.id,
    item_list_name: collection.title,
    items: products.slice(0, 12)
  });
});

// 3.3 添加到购物车 (add_to_cart)
analytics.subscribe('product_added_to_cart', (event) => {
  const cartLine = event.data.cartLine;
  if (!cartLine) return;
  const variant = cartLine.merchandise;
  safeGtag('event', 'add_to_cart', {
    currency: variant.price.currencyCode,
    value: parseFloat(variant.price.amount) * cartLine.quantity,
    items: [{
      item_id: variant.sku || variant.id,
      item_name: variant.product.title,
      item_variant: variant.title,
      price: parseFloat(variant.price.amount),
      quantity: cartLine.quantity
    }]
  });
});

// 3.4 查看购物车 (view_cart)
analytics.subscribe('cart_viewed', (event) => {
  const cart = event.data.cart;
  if (!cart || !cart.lines) return;
  const items = cart.lines.map(line => {
    const variant = line.merchandise;
    return {
      item_id: variant.sku || variant.id,
      item_name: variant.product.title,
      item_variant: variant.title,
      price: parseFloat(variant.price.amount),
      quantity: line.quantity
    };
  });
  
  safeGtag('event', 'view_cart', {
      currency: cart.cost.totalAmount.currencyCode,
      value: parseFloat(cart.cost.totalAmount.amount),
      items: items
  });
});

// 3.5 开始结账 (begin_checkout)
analytics.subscribe('checkout_started', (event) => {
  const checkout = event.data.checkout;
  if (!checkout || !checkout.lineItems) return;
  const items = checkout.lineItems.map(item => {
    const variant = item.variant;
    return {
      item_id: variant.sku || variant.id,
      item_name: variant.product.title,
      item_variant: variant.title,
      price: parseFloat(variant.price.amount),
      quantity: item.quantity
    };
  });

  safeGtag('event', 'begin_checkout', {
    currency: checkout.currencyCode,
    value: parseFloat(checkout.totalPrice.amount),
    items: items
  });
});

// 3.6 购买 (purchase) - 最终、最准确的事件
analytics.subscribe('checkout_completed', (event) => {
  const checkout = event.data.checkout;
  if (!checkout || !checkout.order) return;
  const order = checkout.order;

  const items = checkout.lineItems.map(item => {
    const variant = item.variant;
    return {
      item_id: variant.sku || variant.id,
      item_name: variant.product.title,
      item_variant: variant.title,
      price: parseFloat(variant.price.amount),
      quantity: item.quantity
    };
  });

  // 第 1 步：向 GA4 发送标准的 purchase 事件
  safeGtag('event', 'purchase', {
    transaction_id: order.id,
    value: parseFloat(checkout.totalPrice.amount),
    shipping: parseFloat(checkout.shippingLine ? checkout.shippingLine.price.amount : 0),
    tax: parseFloat(checkout.totalTax ? checkout.totalTax.amount : 0),
    currency: checkout.currencyCode,
    items: items
  });
  
  // 第 2 步：向 Google Ads 发送专属的 conversion 事件
  const purchaseConversionLabel = 'NngVCL3DlOEYEMPtuMkC';

  if (GADS_ID && purchaseConversionLabel) {
    safeGtag('event', 'conversion', {
        'send_to': `${GADS_ID}/${purchaseConversionLabel}`,
        'value': parseFloat(checkout.totalPrice.amount),
        'currency': checkout.currencyCode,
        'transaction_id': order.id
    });
  }
});

// 3.7 (新增) 联系表单提交 (generate_lead)
analytics.subscribe('custom:contact_form_submitted', (event) => {
  // 第 1 步：向 GA4 发送标准的 generate_lead 事件
  safeGtag('event', 'generate_lead', {
    form_id: event.data ? event.data.form_id : '(not set)',
    lead_source: sessionStorage.getItem('lt_source') || '(not set)',
    lead_medium: sessionStorage.getItem('lt_medium') || '(not set)',
    lead_campaign: sessionStorage.getItem('lt_campaign') || '(not set)'
  });
  
  // 第 2 步：向 Google Ads 发送专属的 conversion 事件
  const leadConversionLabel = '_n5CCIjBu5EbEILikrxA';

  if (GADS_ID && leadConversionLabel) {
    safeGtag('event', 'conversion', {
        'send_to': `${GADS_ID}/${leadConversionLabel}`
    });
  }
});

粘贴以后记得搜索修改下面四个参数改为您自己的

let GA_ID = 'G-xxxxxxxx';
let GADS_ID = 'AW-xxxxxxxx';

const purchaseConversionLabel = 'NngVCL3DlOEYEMPtuMkC';

const leadConversionLabel = '_n5CCIjBu5EbEILikrxA';

附录：常见问题 (FAQ)

Q: 我可以同时使用多种模式吗？
A: 绝对不可以。同时启用多种模式会导致 gtag.js 被重复加载，所有事件都会被重复发送，从而导致您的分析数据完全失真。请务必只选择一种模式。

Q: 为什么“模式二”的购买事件需要特殊设置？
A: 这是由 Shopify 的安全策略决定的。为了保护用户隐私和支付安全，Shopify 不允许主题代码直接访问用户完成付款后的“感谢页面”。“客户事件”是 Shopify 提供的官方、安全的解决方案，用于在该页面上执行跟踪代码。

Q: 我应该使用主题的跟踪功能，还是 Shopify 官方的 "Google & YouTube" 应用？
A: 两者都是可行的选择。

官方应用：优点是设置简单，点击几下即可完成。缺点是它是一个黑盒，您无法控制其具体行为，并且可能会与主题或其他应用产生未知冲突。
主题集成功能 (模式二/三)：优点是为您提供了完全的控制权和透明度，代码经过优化，与主题完美兼容，没有额外应用带来的性能开销。缺点是需要一些手动设置。对于追求数据准确和网站性能的专业用户，我们推荐使用主题的集成功能。

Shopify 基础教程

Shopify 高级技巧

Shopify 营销与推广

Shopify 店铺运营与管理

Shopify 实战案例分析

facebook广告投放教程

谷歌广告投放教程

谷歌SEO教程

WOW Synergy 主题 - Google 跟踪设置完全指南

引言

快速选择指南

模式一：直接注入 (基础模式)

是什么？

适用场景

如何设置

模式二：主题集成 (推荐模式)

是什么？

适用场景

如何设置

模式三：Custom Pixel (专家模式)

是什么？

适用场景

如何设置

附录：常见问题 (FAQ)

在本页