使用全域網站代碼

為確保 Campaign Manager 能夠有效評估轉換,建議您為 Floodlight 活動代碼採用全域網站代碼 (gtag.js) 這種格式。

關於全域網站代碼

全域網站代碼是一種適用於整個網站的網路代碼庫,讓您在 Google 的網站和轉換評估產品中都能輕鬆完成導入作業,並收事半功倍之效。

  • 輕鬆快速地與其他 Google 產品整合:全域網站代碼不僅適用於 Google Marketing Platform 廣告產品 (Display & Video 360、Search Ads 360 和 Campaign Manager),還可供其他 Google 產品使用,例如 Google Ads 和 Google Analytics (分析)。使用這些產品時,由於全域網站代碼的標記方式並無不同,因此進行導入也就更簡單。
  • 轉換追蹤更準確:使用全域網站代碼時,系統會在您的網域上設定新的 Cookie,藉此確保 Google Marketing Platform 可以更準確地評估轉換。如果您目前使用 iframe 或圖片代碼,而不是全域網站代碼,Google Marketing Platform 就無法監控所有轉換。

不支援的環境

  • 全域網站代碼並非針對行動應用程式內的運作所設計。進一步瞭解搭配應用程式使用 Floodlight 的選項。
  • 全域網站代碼不支援 Accelerated Mobile Pages (AMP)。您應繼續按照現有程序搭配 AMP 使用 Floodlight
  • 在不支援 JavaScript 的瀏覽器中,全域網站代碼不會啟動。如果瀏覽器不支援 JavaScript,則會載入代碼所提供的 <noscript> 區段。詳情請參閱下文

全域網站代碼所設定的 Cookie

使用 Floodlight 活動的全域網站代碼時,代碼會在您的網域設定新的 Cookie,網域就會儲存使用者的專屬 ID 或將其導向您網站的廣告點擊。Cookie 會從 Google Marketing Platform 廣告產品將使用者重新導向至網站前加入到達網頁網址的 GCLID (「Google 點擊 ID」) 參數接收廣告點擊資訊。

如果您不希望全域網站代碼在網站網域上設定第一方 Cookie,請將下方標明的部分加到全域程式碼片段 config 指令中:

gtag('config', 'DC-1234567', {'conversion_linker': false});

我們不建議您停用,原因是這會導致轉換評估準確度降低。

由於全域網站代碼可使用從您網域上所設定的新 Cookie 收集到的資訊,因此請務必提供清楚詳盡的資訊,讓使用者瞭解相關資料收集活動,並因應適用法律要求徵得使用者同意

導入全域網站代碼

全域網站代碼是由兩個 JavaScript 程式碼片段所組成,分別是:全域程式碼片段和事件程式碼片段。請將全域網站代碼插入網站所有網頁的 <head></head> 代碼之間。您必須將全域程式碼片段放置於所有網頁,並將事件程式碼片段另外放置於包含您所追蹤事件的網頁。網站管理員必須將值傳送到全域網站代碼的特定欄位。

步驟 1:將全域程式碼片段加到網站的所有網頁

您必須將全域程式碼片段加到網站的所有網頁中,放置在 <head></head> 代碼之間。在網站的所有網頁上安裝全域程式碼片段之後,就不必再次新增全域程式碼片段。如果您已經安裝其他 Google 產品或 Floodlight 設定的全域程式碼片段,請按照下列指示修改多項產品的全域程式碼片段。

以下提供全域程式碼片段的範例:

<!-- 
Start of global snippet: Please do not remove
Place this snippet between the <head> and </head> tags on every page of your site.
-->
<!-- Global site tag (gtag.js) - DoubleClick -->
<script async src="https://www.googletagmanager.com/gtag/js?id=DC-[floodlightConfigID]"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'DC-[floodlightConfigID]');
</script>
<!-- End of global snippet: Please do not remove -->

步驟 2:將事件程式碼片段加到內含您所追蹤事件的網頁

您必須將事件程式碼片段加到內含您所追蹤事件的網頁中。這樣可以追蹤轉換事件,或是將使用者加到目標對象名單中。事件程式碼片段可以放在網頁中全域程式碼片段之後的任何位置,但我們建議您也把它放在 <head> 區段內,以提升追蹤的準確率。

視代碼類型、計數方式以及您傳送到代碼的其他資料而定,事件程式碼片段提供的欄位會有所差異。如要進一步瞭解事件程式碼片段中的欄位,請參閱以下章節。

以下是事件程式碼片段的範例:

<!-- 
Event snippet for Activity Name on http://foo.com: Please do not remove.
Place this snippet on pages with events you’re tracking.
Creation date: 10/30/2017
-->
<script>
  gtag('event', 'conversion', {
    'allow_custom_scripts': true,
    'u1': '[variable]',
    'send_to': 'DC-[floodlightConfigID]/[activityGroupTagString]/[activityTagString]+[countingMethod]'
  });
</script>
<noscript>
<img src="https://ad.doubleclick.net/ddm/activity/src=[floodlightConfigID];type=[activityGroupTagString];cat=[activityTagString];dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=1?" width="1" height="1" alt=""/>
</noscript>
<!-- End of event snippet: Please do not remove -->

將資料傳送到全域網站代碼中的欄位

如果您要從 iFrame 或圖片代碼轉換成全域網站代碼,請參閱代碼重新導入指南,進一步瞭解這些代碼中的參數與全域網站代碼中的欄位之間的對應關係。

全域程式碼片段中的欄位

全域程式碼片段會載入全域網站代碼的追蹤程式庫,並設定代碼傳送資料的來源帳戶。

讓我們進一步瞭解全域程式碼片段中的部分主要欄位:

  • src="https://www.googletagmanager.com/gtag/js?id=DC-[floodlightConfigID]"
    這個區段顯示產生代碼的原始帳戶識別碼。當您透過 Campaign Manager 產生代碼時,這就是 Floodlight 設定 ID。

  • gtag('config', 'DC-[floodlightConfigID]')
    config 指令顯示與該全域網站代碼相關聯的特定帳戶。當您透過 Campaign Manager 產生代碼時,這就是 Floodlight 設定 ID。

如果您要在多項 Floodlight 設定或 Google 產品中使用全域網站代碼,就會看到多個 config 指令,以及 src= 字串中的多個不同 ID。詳情請參閱下文說明

您不得以動態方式傳送資料到全域程式碼片段中的欄位。一旦安裝到您的網站,且內含正確的帳戶識別碼,即算是完整的全域程式碼片段。

事件程式碼片段中的欄位:總覽

事件程式碼片段是專為每個 Floodlight 活動及該活動所追蹤的對應事件而設。部分欄位是由所有事件程式碼片段共用,但其他欄位則視與代碼相關聯的 Floodlight 活動設定而定。

您必須以動態方式傳送資料到事件程式碼片段中的欄位。以下簡要說明事件程式碼片段中的主要欄位,以及這些欄位適用的代碼類型。如要進一步瞭解每個欄位,請參閱以下章節。

欄位名稱 值的格式 代碼類型與計數方式 總覽
allow_custom_scripts 布林值 全部 啟用動態代碼
u1u2 字串 全部 表示自訂 Floodlight 變數
send_to 字串 全部 對應 Floodlight 設定、活動群組、活動代碼和計數方法的路由識別碼。
session_id 字串 計數器:單次工作階段 設定各工作階段的專屬識別碼。
value 數字 所有銷售 傳送交易產生的收益。
transaction_id 數字 所有銷售 設定交易的專屬識別碼。
quantity 數字 銷售:已售商品 列出交易期間售出的商品數量。

所有事件程式碼片段中的欄位

下列欄位會顯示在 Campaign Manager 產生的所有事件程式碼片段中:

  • 'allow_custom_scripts': true
    這個欄位會啟用 Floodlight 動態代碼,讓您可整合第三方工具與代碼。此欄位必須設為「true」,動態代碼才能順利運作。我們建議您在初次建立 Floodlight 活動時,利用活動的設定來啟用動態代碼。不過,這個欄位的值會覆寫 Campaign Manager 中相關 Floodlight 活動的動態代碼設定。如果您不想讓事件程式碼片段支援動態代碼,請將此欄位設為「false」,或者將它從事件程式碼片段中整個移除。

  • 'send_to': 'DC-[floodlightConfigID]/[activityGroupTagString]/[activityTagString]+[countingMethod]'
    send_to 欄位會列出 Floodlight 設定、活動群組、活動代碼和計數方法的路由識別碼。

    • DC-[floodlightConfigID]
      這個欄位會指出與代碼相關聯的 Floodlight 設定,並對應到 iframe 和圖片代碼中的 src= 參數。

    • [activityGroupTagString]
      這個欄位會指出與代碼相關聯的 Floodlight 活動群組。您可以自行設定此欄位的值,也可以使用預設值。預設值包含活動群組名稱的前 5 個字母,以及 3 個隨選英數字元、底線和連字號所構成的字串 (如果活動名稱的長度不到 5 個字元,英數字元前會加上其他字母,補足 8 個字元)。這個值會區分大小寫,並對應到 iframe 和圖片代碼中的 type= 參數。

    • [activityTagString]
      這個欄位會指出與代碼相關聯的 Floodlight 活動。您可以自行設定此欄位的值,也可以使用預設值。預設值包含活動名稱的前 5 個字母,以及 3 個隨選英數字元、底線和連字號所構成的字串 (如果活動名稱的長度不到 5 個字元,英數字元前會加上其他字母,補足 8 個字元)。這個值會區分大小寫,並對應到 iframe 和圖片代碼中的 cat= 參數。

  • 'u1': '[variable]'
    Floodlight 自訂變數可接受任何您選擇傳送的值。您可以利用這些值來建立目標對象名單。您不得向 Google Marketing Platform 傳送任何 Google Marketing Platform 可用作或視為個人識別資訊的資料。瞭解詳情

事件程式碼片段中適用於計數器代碼的欄位

計數器代碼的用途是計算與事件相關的轉換次數。計數器代碼會按照您的活動設定方式來計算所有轉換事件,或針對計數方式設限,讓系統在每日或每個使用者工作階段中,只為每位使用者計入一次轉換。以下是計數器代碼專用的欄位:

  • 'session_id': '[SessionID]'
    如果您搭配單次工作階段計數方法使用計數器代碼,可利用這個欄位插入不重複工作階段 ID。工作階段 ID 會指示 Campaign Manager 將您網站上的每個工作階段只計為一個事件。至於工作階段的定義,則完全由您決定。舉例來說,您可以將使用者登入您的網站時視為工作階段開始,然後將工作階段逾時視為工作階段結束。此欄位會對應到 iframe 和圖片代碼中的 ord= 參數。

計數器:標準活動的事件程式碼片段範例

<!-- 
Event snippet for Activity Name on http://foo.com: Please do not remove.
Place this snippet on pages with events you’re tracking.
Creation date: 10/30/2017
-->
<script>
  gtag('event', 'conversion', {
    'allow_custom_scripts': true,
    'send_to': 'DC-[floodlightConfigID]/[activityGroupTagString]/[activityTagString]+standard'
  });
</script>
<noscript>
<img src="https://ad.doubleclick.net/ddm/activity/src=[floodlightConfigID];type=[activityGroupTagString];cat=[activityTagString];ord=1?" width="1" height="1" alt=""/>
</noscript>
<!-- End of event snippet: Please do not remove -->

計數器:不重複活動的事件程式碼片段範例

<!-- 
Event snippet for Activity Name on http://foo.com: Please do not remove.
Place this snippet on pages with events you’re tracking.
Creation date: 10/30/2017
-->
<script>
  gtag('event', 'conversion', {
    'allow_custom_scripts': true,
    'send_to': 'DC-[floodlightConfigID]/[activityGroupTagString]/[activityTagString]+unique'
  });
</script>
<noscript>
<img src="https://ad.doubleclick.net/ddm/activity/src=[floodlightConfigID];type=[activityGroupTagString];cat=[activityTagString];ord=1;num=1?" width="1" height="1" alt=""/>
</noscript>
<!-- End of event snippet: Please do not remove -->

計數器:單次工作階段活動的事件程式碼片段範例

<!-- 
Event snippet for Activity Name on http://foo.com: Please do not remove.
Place this snippet on pages with events you’re tracking.
Creation date: 10/30/2017
-->
<script>
  gtag('event', 'conversion', {
    'allow_custom_scripts': true,
    'session_id': '[SessionID]',
    'send_to': 'DC-[floodlightConfigID]/[activityGroupTagString]/[activityTagString]+per_session'
  });
</script>
<noscript>
<img src="https://ad.doubleclick.net/ddm/activity/src=[floodlightConfigID];type=[activityGroupTagString];cat=[activityTagString];ord=[SessionID]" width="1" height="1" alt=""/>
</noscript>
<!-- End of event snippet: Please do not remove -->

事件程式碼片段中適用於銷售代碼的欄位

銷售代碼通常會放在銷售活動的確認網頁中,並提供要傳送到代碼的銷售活動相關資訊。以下是數個銷售代碼專用的欄位:

  • 'value': '[Revenue]'
    您可利用這個欄位傳送交易所產生的收益 (亦即該次銷售活動中交易商品的購買金額)。最適合輸入的值通常是產生的收益而非總購物金額,因為後者可能包含銷售稅、加值稅或運費。這個欄位可接受不含逗號或貨幣符號的數值,但您可視需要使用小數點 (.)。此欄位會對應到 iframe 和圖片代碼中的 cost= 參數。

  • 'transaction_id': '[OrderID]'
    您可利用這個欄位為每筆交易插入一個專屬數字識別碼。訂單 ID 會列在轉換路徑 (P2C) 報表中。此欄位會對應到 iframe 和圖片代碼中的 ord= 參數。

  • 'quantity': '[Quantity]'
    您可利用這個欄位傳送交易期間售出的商品數量:

    如果您將每筆交易計為一次轉換,這個值就是 1。

    如果您將單筆交易的每個售出商品都計為一次轉換,請插入每筆交易期間所售商品的數量當做此欄位的值。

    這個值必須為大於零的整數。Campaign Manager 會將這個值乘以轉換事件數,得出銷售代碼的轉換次數。如果其值為 0,或者此欄位包含非數字的值,代表系統將不會計算任何轉換。

銷售:交易活動的事件程式碼片段範例

<!-- 
Event snippet for Activity Name on http://foo.com: Please do not remove.
Place this snippet on pages with events you’re tracking.
Creation date: 10/30/2017
-->
<script>
  gtag('event', 'purchase', {
    'allow_custom_scripts': true,
    'value': '[Revenue]',
    'transaction_id': '[OrderID]',
    'send_to': 'DC-[floodlightConfigID]/[activityGroupTagString]/[activityTagString]+transactions'
  });
</script>
<noscript>
<img src="https://ad.doubleclick.net/ddm/activity/src=[floodlightConfigID];type=[activityGroupTagString];cat=[activityTagString];qty=1;cost=[Revenue];dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=[OrderID]" width="1" height="1" alt=""/>
</noscript>
<!-- End of event snippet: Please do not remove -->

銷售:已售商品活動的事件程式碼片段範例

<!-- 
Event snippet for Activity Name on http://foo.com: Please do not remove.
Place this snippet on pages with events you’re tracking.
Creation date: 10/30/2017
-->
<script>
  gtag('event', 'purchase', {
    'allow_custom_scripts': true,
    'value': '[Revenue]',
    'transaction_id': '[OrderID]',
    'quantity': '[Quantity]',
    'send_to': 'DC-[floodlightConfigID]/[activityGroupTagString]/[activityTagString]+items_sold'
  });
</script>
<noscript>
<img src="https://ad.doubleclick.net/ddm/activity/src=[floodlightConfigID];type=[activityGroupTagString];cat=[activityTagString];qty=[Quantity];cost=[Revenue];dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=[OrderID]?" width="1" height="1" alt=""/>
</noscript>
<!-- End of event snippet: Please do not remove -->

 

自訂欄位

您可使用 dc_custom_params 欄位,在事件程式碼片段中插入自訂資料。

這個欄位可接受任何您想傳送到 Google Marketing Platform 的值。您不得向 Google Marketing Platform 傳遞任何 Google Marketing Platform 可用作或視為個人識別資訊的資料。以下列出您可搭配 dc_custom_params 欄位使用的部分常用欄位:

欄位名稱 值的格式 計數方式 說明
ord 數字 全部 全域網站代碼會自動替您處理快取清除。如果您選擇覆寫這個值並手動控制快取清除,可以使用 ord 欄位。請根據代碼類型和計數方式加上 ord 欄位的值,方法與您對 iframe 代碼的處理方式相同。
num 數字 計數器:不重複 全域網站代碼會自動替您處理快取清除。如果您選擇覆寫這個值並手動控制快取清除,可以使用 num 欄位。請加上 num 欄位的值,方法與您對 iframe 代碼的處理方式相同。
dc_lat 0 或 1 全部 這個欄位適用於行動裝置上的代碼,接受的值為 0 或 1。如果這個值為 1,表示使用者已啟用 IDFA 或 AdID 的「限制廣告追蹤」選項,藉此停用按照興趣顯示的廣告和再行銷功能;如果這個值為 0,則表示「限制廣告追蹤」處於停用狀態。如果缺少或未填入這個值,系統會按照預設在這個欄位填入 0。
tag_for_child_directed_treatment 0 或 1 全部 這個欄位適用於行動裝置上的代碼,接受的值為 0 或 1。如果這個值為 1,表示這項特定要求可能是由未滿 13 歲的使用者發出 (按照 COPPA 政策規定)。
tfua 0 或 1 全部 接受的值為 0 或 1。如果這個值為 1,表示這項特定要求可能是由未滿 16 歲的使用者發出 (具體年齡依國家/地區不同),須遵守歐盟地區的《一般資料保護規則》(GDPR) 規定。
allow_ad_personalization_signals 0 或 1 全部 接受的值為 0 或 1。如果這個值為 1,表示這項特定要求可能是由希望選擇停用再行銷的使用者發出。如果缺少或未填入這個值,系統會按照預設在這個欄位填入 0。
 

dc_custom_params 欄位的事件程式碼片段範例

<!-- 
Event snippet for Activity Name on http://foo.com: Please do not remove.
Place this snippet on pages with events you’re tracking. 
Creation date: 10/30/2017
-->
<script>
  gtag('event', 'purchase', {
    'allow_custom_scripts': true,
    'value': '[Revenue]',
    'transaction_id': '[OrderID]',
    'send_to': 'DC-[floodlightConfigID]/[activityGroupTagString]/[activityTagString]+[countingMethod]',
    'dc_custom_params': {
      'ord': '1',
      'num': '1234',
      'dc_lat': '1',
      'tag_for_child_directed_treatment': '0'
      'tfua': '1',
      'npa': '1'
    }
  });
</script>
<noscript>
<img src="https://ad.doubleclick.net/ddm/activity/src=[floodlightConfigID];type=[activityGroupTagString];cat=[activityTagString];qty=1;cost=[Revenue];dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;tfua=;npa=;ord=[OrderID]?" width="1" height="1" alt=""/>
</noscript>
<!-- End of event snippet: Please do not remove -->

事件程式碼片段的 <noscript> 區段

所有事件程式碼片段都包含 <noscript> 區段。如果因瀏覽器不支援 JavaScript 而無法使用全域網站代碼的主要區段,系統就會改用這個區段。在此情況下,系統會改用圖片代碼。

填入 <noscript> 區段中的參數資料時,做法就跟導入圖片代碼一樣。這些參數的值必須與代碼 <script> 區段中對應參數的值完全一致。

全域網站代碼範例

以下是完整的全域網站代碼範例,當中同時包含全域程式碼片段和事件程式碼片段:

全域網站代碼範例

<!-- 
Start of global snippet: Please do not remove
Place this snippet between the <head> and </head> tags on every page of your site.
-->
<!-- Global site tag (gtag.js) - DoubleClick -->
<script async src="https://www.googletagmanager.com/gtag/js?id=DC-[floodlightConfigID]"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'DC-[floodlightConfigID]');
</script>
<!-- End of global snippet: Please do not remove -->
<!--
Event snippet for Activity Name on http://www.foo.com: Please do not remove.
Place this snippet on pages with events you’re tracking.
Creation date: 10/30/2017
-->
<script>
  gtag('event', 'conversion', {
    'allow_custom_scripts': true,
    'u1': '[variable]',
    'send_to': 'DC-[floodlightConfigID]'/[activityGroupTagString]/[activityTagString]+[countingMethod]'
  });
</script>
<noscript>
<img src="https://ad.doubleclick.net/ddm/activity/src=[floodlighConfigID];type=[activityGroupTagString];cat=[activityTagString];dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=1?" width="1" height="1" alt=""/>
</noscript>
<!-- End of event snippet: Please do not remove -->

為多項 Floodlight 設定或 Google 產品調整現有全域網站代碼

如果您已取得全域網站代碼,可以利用下列方式進行設定,讓代碼傳送資料到多項 Google 產品:

  • 更新全域程式碼片段,加上每項產品專用的識別碼。
  • 針對每項產品使用不同的事件程式碼片段。

經過調整的全域網站代碼範例

以下使用的範例原本是由某個 Google Analytics (分析) 帳戶所產生的全域網站代碼,當中的全域程式碼片段如下:

<!-- Global Site Tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script>

<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments)};
  gtag('js', new Date());

  gtag('config', 'GA_TRACKING_ID');
</script>

如要新增 Floodlight 設定的支援,您不必在網站中加上第二個全域程式碼片段,只要在現有全域程式碼片段中加上下方標明的 config 指令即可:

<!-- Global Site Tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script><script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments)};
  gtag('js', new Date());

  gtag('config', 'GA_TRACKING_ID');
  gtag('config', 'DC-1234567');
</script>

針對您希望代碼支援的每項額外 Google 產品,新增一個內含正確帳戶識別碼的 config 指令。

請注意,代碼 src= 部分中的識別碼是在您初次產生全域網站代碼時所設定。這個識別碼不會決定哪些帳戶會透過代碼接收資料。在上述範例中,代碼原本是透過 Analytics (分析) 所產生,因此 src= 會包含一個 Analytics (分析) ID。系統會依據 config 指令,並搭配 send_to 欄位 (可轉送到該產品) 使用的各產品專用事件程式碼片段,決定哪些帳戶會從全域網站代碼接收資料

常見問題

使用全域網站代碼時,需要設定快取清除功能嗎?

不需要。全域網站代碼會自動替您處理快取清除。瞭解詳情

為什麼全域網站代碼要放在 <head> 區段中,但 iframe 和圖片代碼要放在網頁的 <body> 區段中?

全域網站代碼是非同步代碼的程式庫,這點與 iframe 和圖片代碼不同。這表示瀏覽器在下載代碼時不會防礙到網頁顯示內容,因此您可以將代碼放在網頁頂端的 <head> 代碼之間。

我想進一步瞭解全域網站代碼,該怎麼做?

如要進一步瞭解如何在各項 Google 產品中使用全域網站代碼,請點選相關連結:

這對您有幫助嗎?
我們應如何改進呢?