如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換?

最後更新時間:2020 年 12 月 8 日

你想知道自己的 WordPress 網站的轉換率是多少,以便自己修正並精進自己的網站嗎?老闆叫你追蹤公司官網的表單提交成效,但你卻完全不知道該怎麼做嗎?

這篇文章主要是幫助完全不懂程式碼的網路行銷工作者,透過 GTM ( Google Tag Manager ) 以及 GA ( Google Analytics ) 這 2 款免費的網站分析與管理程式,並將所有來過你網站的訪客,他們所提交的表單記錄成轉換並顯示在報表之中。

接下來,我將會以 WordPress 網站中最常見的 2 種表單提交方式,Contact Form 7 以及 Elementor 表單為例子進行追蹤,讓你能夠更加清楚知道目前你網站整體的表現及成效。

1. 為什麼我們需要追蹤表單提交?

表單提交是一般衡量一個網站表現最基本的轉換指標,假設今天有 100 個人來訪了你的網站,然後其中有 2 個人透過你網站中的表單向你進行了聯繫或提問,這時候我們就可以計算出你網站目前的轉換率為 2/100 = 0.02,也就是 2% 的轉換率。

而知道了轉換率可以幹嘛呢?通常計算出轉換率都是為了要推算未來公司可能會帶來的收益,或是精進自己接下來網站成長的目標,比如說你今年網站的轉換率是 2%,那麼你就可以設定目標為明年轉換率要為 3%,並且進行努力與修正。

以我自己為例,我是一家提供 WordPress 網站架設的網頁設計公司,而如果有人想找我架網站,他們會透過我提供在網站上的聯絡表單與我進行聯繫。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 3

如果我有設定追蹤表單提交的話,我就可以得出我的轉換率可能是 1% 或是 2%,並且預期未來數月到一年中,公司可能會帶來的收益,以便控管資金以及現金流。

當然,如果你只是經營自己的個人網站或是部落格,你可以不用特別去計算或是追蹤網站的表單提交轉換率,我會去追蹤這些數據是因為我的網站就是自己的公司。

但是,如果未來你有打算開公司、並將自己的網站轉變成真正的網路事業的話,那麼進行追蹤網站上的表單提交轉換,是不可或缺的。

2. 如何追蹤表單提交?

如果你已經了解了追蹤表單提交的重要性,那麼接下來,我將會以 WordPress 網站中最常見的 2 種表單提交方式:Contact Form 7 以及 Elementor 表單為例子,並進行追蹤。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 4

最終的成果會是以上圖這樣子的形式顯示在 GA 報表之中,基本上 GA 報表就是業界大多數公司目前採用的網站分析工具,因此如果你是從事行銷相關的工作,直接截 GA 報表中的圖片去跟客戶開會或是報告老闆都絕對是沒問題的。

接下來,雖然我們會先以 Contact Form 7 為例,但如果你是 Elementor 表單的用戶,礙於整體教學的一致性與連貫性,以及有太多設定是重複的,我會需要你先照著 Contact Form 7 的教學照著做一遍,接著再接續進行 Elementor 的表單提交追蹤,謝謝。

2.1 Contact Form 7 表單追蹤

接下來的教學我們會以 Contact Form 7 這款免費、知名的 WordPress 表單管理外掛為例,透過這款外掛,它可以讓你建立起一個自己專屬的表單,並且放置在網站上讓訪客與你進行聯繫。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 5

要啟用 Contact Form 7 非常簡單,只要前往 WordPress 內建的外掛下載區,並搜尋 Contact Form 7 即可安裝。

啟用 GTM 與 GA
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 6
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 7

如果你已經啟用了 Contact Form 7,那麼接下來我們便可以開始進行表單提交的轉換追蹤。

首先,我們會先需要啟用 GTM ( Google Tag Manager ) 與 GA ( Google Analytics ) 這 2 款由 Google 提供的免費網站分析與管理程式。

而 GA 與 GTM 的相關說明,以及如何在 WordPress 中安裝 GTM 並開啟 GA 報表的方式,請參考我之前寫的這篇文章,並花個 5 ~ 10 分鐘把它們都開啟,這邊便不再贅述。

如果你之前是自己用網路上別的教學方式開啟 GTM 和 GA 報表的話,我建議你也點進上面那篇文章看一下,並照著文章教你的方法重新設定 GTM & GA。

因為接下來我們會使用到一個專門處理 WordPress 的 GTM 外掛,所以如果你原本埋放 GTM 的方式跟我不同的話,會沒有辦法進行下去。

總之,如果你不是按照我上面貼的文章埋放 GTM 代碼的話,請參考這篇文章的 GTM 追蹤方式。

開啟 GTM 外掛設定
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 8

前往 WordPress 後台,接著依序進行:

  • 設定 -> Google Tag Manager -> 整合功能 -> Contact Form 7 -> 勾選選項並儲存。

開啟這個選項是為了讓這個外掛自動幫我們推送 Contact Form 7 的數據到資料層之中,如果你不知道什麼是資料層也沒有關係,只要記得勾選就好了。

開啟 GTM debug 模式
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 9

接著,我們會需要進入到 GTM 的debug 模式之中,回到你的 GTM 首頁之後,點擊右上角的按鈕預覽

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 10

然後會跳轉到一個畫面,在這邊填入你網站的網址 ( 例如我的是 https://test.timidbear.co ),完成之後按下 start 按鈕。

確認 Contact Form 7 正確追蹤

接著會跳出 2 個畫面,分別為:

  1. GTM 的 debug 視窗
  2. 你的網站
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 11

先前往你網站的視窗,接著前往你要追蹤表單的頁面,並且發送一個測試的表單 ( 隨便寫點什麼 )。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 12

接著前往 GTM 的 debug 視窗,在左邊的側邊欄中點選 gtm4wp.contactForm7Submitted 的一個事件,接著再點選右邊畫面中的 Data Layer,你就會發現這邊記錄了你剛剛發送表單時填寫的資料。

這樣代表什麼呢?這樣代表 GTM 有成功捕捉到你傳送的 Contact Form 7 這個事件了。

建立 GTM 觸發事件
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 13

接著回去 GTM 中,先點選左邊側邊欄中的觸發事件,接著新增一個觸發事件,並依序填入:

  1. 名稱:這邊可以隨便填,例如我的是 Contact Form 7 Submitted
  2. 觸發條件類型:選擇自訂事件
  3. 事件名稱gtm4wp.contactForm7Submitted
  4. 完成之後,按下右上角的儲存。

上面這樣做的意義是,之後只要有人提交你網站上的 Contact Form 7 表單之後,GTM 就會偵測到這個事件並且被觸發。

建立 GA 事件代碼
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 14

接著點選左邊側邊欄中的代碼,然後點選右上角新增一個代碼,並依序填入:

  1. 名稱:這邊可以隨便填,例如我的是 GA - Contact Form 7 Submitted
  2. 代碼類型:選擇Google Analytics ( 分析 ):通用 Analytics ( 分析 )
  3. 追蹤類型:選擇事件
  4. 類別:填入轉換
  5. 動作:填入 表單提交
  6. 標籤:填入 Contact Form 7
  7. Google analytics ( 分析 ) 設定:選擇你之前儲存的 GA 追蹤碼變數,或是直接填入你的 GA 追蹤碼 ( ex. UA-123456789 )
  8. 觸發條件:選擇前面建立的 Contact Form 7 Submitted 事件。
  9. 完成之後,按下右上角的儲存。

而這一段這樣做的意義是,之後只要有人提交網站上的 Contact Form 7 表單之後,GTM 就會觸發這個事件,並且將資料傳達給 GA。

如此一來,我們之後才能在 GA 的報表中計算到轉換。

發布容器
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 15

最後,確認都設定好之後,點選右上角的提交按鈕進行發佈,GTM 的部分就到這邊告一個段落了,接下來我們要前往 GA。

設定 GA 目標
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 16

來到 GA 之後,請先點選左下角的齒輪 icon,並在資料檢視的欄位之中找到目標的選項。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 17

接著我們要建立一個自訂的目標轉換,因此點擊自訂

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 18

接著,填寫你的目標名稱,這邊可以隨便填寫,自己看得懂就好,並在類型的地方選擇事件

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 19

接著,依序進行:

  1. 類別:請選擇等於,並填入轉換
  2. 動作:請選擇等於,並填入表單提交
  3. 標籤:請選擇等於,並填入Contact Form 7
  4. 價值:不用填。

都填完之後,即可按下儲存。

檢查是否成功追蹤轉換
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 11

都設定好之後,最後我們必須回到你的網站之中,再次發送表單進行確認,這邊一樣隨便打點什麼就好。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 21

最後,你就可以在你的 GA 面版左邊工具列中的轉換 -> 目標 -> 總覽 中看到表單提交的轉換率了,我們成功地追蹤了訪客在你網站上提交表單的轉換了。

2.2 Elementor 表單追蹤

完成了 Contact Form 7 的表單提交追蹤,接下來我們要來進行 Elementor 頁面編輯器類型的網站提交追蹤。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 22

由於 Elementor 所使用的表單提交的方式,跟 Contact Form 7 一樣是使用一種叫做 Ajax ( Asynchronous JavaScript and XML / 非同步JavaScript 與XML ) 的技術所達成的,所以相較於一般的表單,它們都不能使用 GTM 提供的內建表單監聽器進行追蹤。

而剛剛我們能夠順利追蹤到 Contact Form 7 的表單,是因為我們啟用了特定的 WordPress GTM 外掛,有很多前置作業都被外掛解決了,所以我們才得以順利追蹤到。

但很遺憾的是,這款外掛只有提供 Contact Form 7 表單的提交事件追蹤,並沒有包含 Elementor 表單的提交事件追蹤,因此我們沒有辦法用相同的方法追蹤表單。

不過沒有關係,接下來我將會教你使用其它客製化的 Ajax 的表單監聽器,來為你的 Elementor 表單提交進行追蹤。

建立 Elementor 表單
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 23

開啟你的 Elementor 編輯器,在左側工具列中找到表單區塊,並拖曳至頁面中建立一個 Elementor 的表單。

建立 Ajax 表單監聽器
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 24

接著開啟你的 GTM,並且新增一個新的代碼,並依序進行:

  1. 名稱:這邊可以隨便取名字,如果不知道要取什麼可以跟我一樣 Ajax Form Listener
  2. 代碼類型:選擇自訂 HTML
  3. HTML:複製貼上下面所提供的 HTML 程式碼。
  4. 觸發條件:選擇 All Pages
  5. 完成之後,按下儲存
<script id="gtm-jq-ajax-listen" type="text/javascript">
  (function() {

    'use strict';
    var $;
    var n = 0;
    init();

    function init(n) {

      // Ensure jQuery is available before anything
      if (typeof jQuery !== 'undefined') {

        // Define our $ shortcut locally
        $ = jQuery;
        bindToAjax();

      // Check for up to 10 seconds
      } else if (n < 20) {

        n++;
        setTimeout(init, 500);

      }

    }

    function bindToAjax() {

      $(document).bind('ajaxComplete', function(evt, jqXhr, opts) {

        // Create a fake a element for magically simple URL parsing
        var fullUrl = document.createElement('a');
        fullUrl.href = opts.url;

        // IE9+ strips the leading slash from a.pathname because who wants to get home on time Friday anyways
        var pathname = fullUrl.pathname[0] === '/' ? fullUrl.pathname : '/' + fullUrl.pathname;
        // Manually remove the leading question mark, if there is one
        var queryString = fullUrl.search[0] === '?' ? fullUrl.search.slice(1) : fullUrl.search;
        // Turn our params and headers into objects for easier reference
        var queryParameters = objMap(queryString, '&', '=', true);
        var headers = objMap(jqXhr.getAllResponseHeaders(), '\n', ':');

        // Blindly push to the dataLayer because this fires within GTM
        dataLayer.push({
          'event': 'ajaxComplete',
          'attributes': {
            // Return empty strings to prevent accidental inheritance of old data
            'type': opts.type || '',
            'url': fullUrl.href || '',
            'queryParameters': queryParameters,
            'pathname': pathname || '',
            'hostname': fullUrl.hostname || '',
            'protocol': fullUrl.protocol || '',
            'fragment': fullUrl.hash || '',
            'statusCode': jqXhr.status || '',
            'statusText': jqXhr.statusText || '',
            'headers': headers,
            'timestamp': evt.timeStamp || '',
            'contentType': opts.contentType || '',
            // Defer to jQuery's handling of the response
            'response': (jqXhr.responseJSON || jqXhr.responseXML || jqXhr.responseText || '')
          }
        });

      });

    }

    function objMap(data, delim, spl, decode) {

      var obj = {};

      // If one of our parameters is missing, return an empty object
      if (!data || !delim || !spl) {

        return {};

      }

      var arr = data.split(delim);
      var i;

      if (arr) {

        for (i = 0; i < arr.length; i++) {

          // If the decode flag is present, URL decode the set
          var item = decode ? decodeURIComponent(arr[i]) : arr[i];
          var pair = item.split(spl);

          var key = trim_(pair[0]);
          var value = trim_(pair[1]);

          if (key && value) {

            obj[key] = value;

          }

        }

      }

      return obj;

    }

    // Basic .trim() polyfill
    function trim_(str) {

      if (str) {

        return str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');

      }

    }


  })();
  /*
   * v0.1.0
   * Created by the Google Analytics consultants at http://lunametrics15.staging.wpengine.com
   * Written by @notdanwilkerson
   * Documentation: http://lunametrics15.staging.wpengine.com/blog/2015/08/27/ajax-event-listener-google-tag-manager/
   * Licensed under the Creative Commons 4.0 Attribution Public License
   */
</script>

我知道這串程式碼看起來很恐怖,但其實你可以不用管它在做什麼,只要複製貼上即可。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 25

都完成之後,我們要前往 GTM 的 Debug 模式檢查代碼是否正確安裝,點擊 GTM 右上角的按鈕預覽

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 10

而這邊會跳出一個這樣的視窗,在這邊輸入你網站的網址。

開啟 GTM debug 模式
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 27

接著前往剛剛點選預覽時,GTM 幫你開啟的你的網站視窗,記得視窗右下角必須要有這一個 Debugger Connected 的小視窗提醒,才能追蹤到唷。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 28

如果確認有追蹤到,我們就試著填寫一個表單進行測試看看,在這邊隨便填寫些內容,並發送表單。

確認 Elementor 正確追蹤
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 29

值得注意的是,Elementor 表單預設完發送完之後,會在下方顯示一段字串「該表單已成功寄出」,這段文字相當重要,再之後我們設定 GTM 的觸發事件時會用到,因此請先在這邊記住。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 30

發送成功之後,開啟另外一個 GTM 的 Debug 視窗,在左邊側邊欄中找到一個叫做 ajaxComplete 的事件,雖然上面密密麻麻的資料好像很恐怖,但其實你可以先不用管,只要注意在下面我框起來的地方,也有一個地方寫著該表單已成功寄出,跟我上面提到的部分一樣。

因此,我們可以確認到這個事件就是 Elementor 表單提交的事件。

建立 GTM 資料層變數

接著回去 GTM 中,跟之前稍微有點不同的是,這次我們需要新增一個資料層變數作為之後觸發條件的過濾器。

如果你看不懂我前面這句話是什麼意思的話也沒關係,你只要照著做就可以了,反正是等一下才會用到的東西。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 31

依序填入:

  1. 名稱:這邊可以隨便填,例如我的是 DLV - Elementor Form Response
  2. 變數類型:選擇資料層變數
  3. 資料層變數名稱:請填入 attributes.response.data.message
  4. 完成之後,按下右上角的儲存。
建立 GTM 觸發事件
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 32

接著點選左邊側邊欄中的觸發事件,接著新增一個觸發事件,並依序填入:

  1. 名稱:這邊可以隨便填,例如我的是 Elementor Form Submitted
  2. 觸發條件類型:選擇自訂事件
  3. 事件名稱ajaxComplete
  4. 這項觸發條件的啟動時機:選擇部分的自訂事件,並接著選擇前面建立的資料層變數 DLV - Elementor Form Response 以及包含,最後手動填入該表單已成功寄出 。
  5. 完成之後,按下右上角的儲存。

這邊做的比較複雜是因為,我們先前設定的 Ajax 表單監聽器並不只限於發生在 Elementor 的表單提交身上,而是所有使用到 Ajax 事件的網頁元件都會觸發,因此我們必須再進行一個簡單的條件篩選,否則測試出來的結果會非常不準確。

總之我們這樣設定完,之後只要有人提交你網站上的 Elementor 表單之後,GTM 才會偵測到這個事件並且被觸發,徹底解決了誤觸事件的問題。

建立 GA 事件代碼
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 33

接著點選左邊側邊欄中的代碼,然後點選右上角新增一個代碼,並依序填入:

  1. 名稱:這邊可以隨便填,例如我的是 GA - Elementor Form Submitted
  2. 代碼類型:選擇Google Analytics ( 分析 ):通用 Analytics ( 分析 )
  3. 追蹤類型:選擇事件
  4. 類別:填入轉換
  5. 動作:填入 表單提交
  6. 標籤:填入 Elementor Form
  7. Google analytics ( 分析 ) 設定:選擇你之前儲存的 GA 追蹤碼變數,或是直接填入你的 GA 追蹤碼 ( ex. UA-123456789 )
  8. 觸發條件:選擇前面建立的 Elementor Form Submitted 事件。
  9. 完成之後,按下右上角的儲存。

而這一段這樣做的意義是,之後只要有人提交網站上的 Elementor 表單之後,GTM 就會觸發這個事件,並且將資料傳達給 GA。

如此一來,我們之後才能在 GA 的報表中計算到轉換。

發布容器
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 15

最後,確認都設定好之後,點選右上角的提交按鈕進行發佈,GTM 的部分就到這邊告一個段落了,接下來我們要前往 GA。

設定 GA 目標
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 16

來到 GA 之後,請先點選左下角的齒輪 icon,並在資料檢視的欄位之中找到目標的選項。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 17

接著我們要建立一個自訂的目標轉換,因此點擊自訂

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 37

接著,填寫你的目標名稱,這邊可以隨便填寫,自己看得懂就好,並在類型的地方選擇事件

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 38

接著,依序進行:

  1. 類別:請選擇等於,並填入轉換
  2. 動作:請選擇等於,並填入表單提交
  3. 標籤:請選擇等於,並填入Elementor Form
  4. 價值:不用填。

都填完之後,即可按下儲存。

檢查是否成功追蹤轉換
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 39

都設定好之後,最後我們必須回到你的網站之中,再次發送表單進行確認,這邊一樣隨便打點什麼就好。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 40

最後,你就可以在你的 GA 面版左邊工具列中的轉換 -> 目標 -> 總覽 中看到表單提交的轉換率了,我們成功地追蹤了訪客在你網站上提交表單的轉換了。

3. GTM 學習資源

如果你想要學好 GTM 、並將其應用在你的網站上的話,我非常推薦你去上大門談數據所開立的 GTM 線上課程。

如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 41

作者大門目前任職於 Dcard 的資料工程師,擁有強大的 GTM 實戰以及教學經驗,是我目前看過市面上最好的 GTM 教學

當時是在別的社團中,偶然看到有人分享 GTM 的免費線上課程,所以就去聽聽,結果聽完之後發現講的真好,讓我重新建構了對 GTM 的認識。

學完之後,我利用 GTM 管理我幫客戶架的網站上,幫助我的客戶省下了非常多時間追蹤網站數據、分析廣告成效等,並為我帶來了每年超過 15 萬元的管理與指導收益。

目前大門老師有提供一堂免費的 GTM 基礎課程,以及一堂付費的進階 GTM 課程,而這兩堂課程內容是可以完整銜接起來的。

因此,你可以先聽看看免費課程的部分,如果覺得適合你並且想要學習更多的話,可以再付費購買進階課程,以免浪費你寶貴的時間與金錢。

而在完全課程的部分,包含了超過 5 小時的影片時間,內容涵蓋了 GTM 的表單追蹤、資料層 ( Datalayer ) 概念與應用、Google Ads 廣告追蹤、FB 廣告追蹤…等,基本上業界最實用的技能都包含在裡面了。

除此之外,由於 GTM 也有一點偏程式的部分,例如 Datalayer 的概念,所以學會 GTM 之後,其實對於找你工作的幫助也很大 ( 尤其是行銷職 )。

因為大部分的行銷人都非常懼怕程式、非常依賴工程師;但是如果你會 GTM 的話,你可以在不碰程式碼的情況下,就對網站的程式碼進行修改、增添新的功能,並且勝過市面上 99% 的行銷人,可能一次加薪的薪水就超過課程的費用了!

最後,由於我是大門老師的第一批學生,所以如果你想要上老師的進階 GTM 課程,可以私訊我的粉專進行索取 $ 1500 折扣碼,這是只有我的讀者才有的優惠。

4. 整體評價

Google Tag Manager
如何在 GA 中追蹤 Contact Form 7 與 Elementor 表單提交轉換? | 42

Google Tag Manager ( GTM ) 是一款由 Google 推出的免費網站程式碼管理工具,它主要是設計給不懂程式碼的網站站長使用,讓他們能夠在不接觸任何程式碼的情況下,對自己的網站程式碼進行新增功能。

貨幣: USD

運作系統: Web

應用程式分類: WordPress

推薦指數:5

5. 結語

老實說整篇文寫下來之後,我發現表單提交遠遠比我想像中的難教多了,因為我自己做追蹤的時候都是感覺蠻簡單、並且可以順利地追蹤到我要的任何資訊,但沒想到要寫成文章教別人竟然是完全簡單不起來。

畢竟我知道大部分的 WordPress 使用者或是行銷人都不會 JavaScript,但由於 GTM 的操作上實在牽扯到不少關於物件導向 ( OOP ) 的觀念,我已經算是盡力想把它寫得很簡單了,不過寫完之後還是覺得太難、不夠滿意。

所以,這篇算是近期內寫得比較痛苦的教學了,而且其實說真的,寫這種文章也不會帶來什麼流量,算是單純一個「我想順便寫筆記」的記錄類型的教學文。

總之,如果有人真的看到最後,並且解決了你工作上的需求,非常歡迎留言在下面或是私訊我,我會很高興的!