Show Menu
主題×

Adobe Experience Manager ContextHub tool

使用 AEM ContextHub 工具將 Dynamic Tag Management 與 Adobe Experience Manager (AEM) ContextHub (資料層的 AEM 版本) 整合。您也可以使用此工具來將 DTM 與任何資料層整合,甚至是未使用 AEM 的網站亦然。
DTM 客戶經常使用資料元素來對映至其網站的資料層。例如,資料層可能包括使用者正在查看特定產品或已將產品放入購物車的資訊。DTM 可以在規則條件中使用此資訊,並以數個方式採取行動。這包括針對報告目的傳送資料至 Analytics 或傳送資料至 Target 以顯示使用者的自訂內容。
AEM ContextHub 工具可解決許多與資料層關聯的問題。某些資料層不會在頁面頂端載入。其他資料層為動態或非同步,並且隨著頁面變更經常變更。在過去,這兩個問題都造成 DTM 無法有效傳送資料或觸發動作的困難。
AEM ContextHub 工具則能使得您不需編寫可經常檢查以判斷資料層是否變更、在頁面頂端以外的其他位置載入或在頁面變更時遭到修改的自訂代碼。
作為範例,假設客戶購物車中放入項目,然後移除了該項目。如果頁面未隨著資料層變更而重新整理,DTM將無法識別變更,而不會新增自訂代碼。AEM ContexHub 工具包含的輪循引擎會檢查每秒,以判斷是否有任何變更。
因為 DTM 現在可主動地透過資料層填入資料元素,使用者也可以使用 AEM ContextHub 資料元素結合先前釋出的條件,例如資料元素值。這可讓使用者管理頁面載入時的資料層值,或是結合資料元素值條件與 dataelementchanged 事件,若資料層由於使用者互動而變更。
配置此工具時,您可以使用預設設定來與 AEM ContextHub 整合,或可以自訂結構以與任何網站搭配使用。
  1. Click <Web Property Name> > Overview > Add a Tool > AEM ContextHub .
  2. 為工具指定描述性名稱。
    This name displays on the Overview tab under Installed Tools.
  3. Click Create Tool to display the AEM ContextHub Settings page.
  4. 填寫欄位:
    元素
    說明
    使用預設 ContextHub 資料層
    使用 AEM ContextHub 格式。藉由選取此選項,DTM 會對此整合參考預設的 ContextHub 架構。如果已對您的 ContextHub 架構進行變更,或想要使用不同的資料層,請使用自訂選項。
    自訂 ContextHub 資料層
    使用與網站的資料層結構對應的自訂格式,即使網站未使用 AEM 亦然。此選項可讓您編輯資料層架構。依預設,它會在編輯視窗中填入預設的 ContextHub 資料層,您可以在該位置進行變更或將它以您的代碼完全取代。
    開啟編輯器
    如果您選擇「自訂 ContextHub 資料層」選項,您可以使用編輯器來插入您的自訂代碼。
    新增附註
    新增任何有關此實施的附註。
  5. Click Save Changes .

Data layer management using the ContextHub tool

動態標籤管理 (DTM) AEM ContextHub 工具可用於 ContextHub 和一般資料層實施。ContextHub 資料層結構依預設會載入工具中,並提供與 Adobe Experience Manager (AEM) ContextHub 商店的簡單整合。提供預設 ContextHub 實施以及自訂一般資料層實施的範例。

必要條件

若要使用 ContextHub 工具,您必須符合下列必要條件:
  • 網站上現有的 ContextHub 或 JavaScript 物件資料層。
  • 正確定義網站上使用中資料層的 JSON 架構。
  • 網站上使用的作用中 DTM Web 屬性。

AEM ContextHub tool components

AEM ContextHub 工具新增了兩個功能至 DTM:
  • 資料層定義
  • AEM ContextHub 資料層類型
此外,新增了新事件類型,以促進稱為 dataelementchanged 的資料層監視。此事件類型可獨立於 AEM ContextHub 工具使用。
每個功能區域對應於以下的兩個範例中所述的配置步驟。

Data element monitoring

The new dataelementchanged event type monitors any changes that occur to a specific data element value during a page view. 使用此事件類型時應該注意下列觀察。
  1. 資料元素必須對應至簡易的 JavaScript 值。在資料元素自訂指令檔中傳回的陣列和物件之類的複雜值,將無法正確運作。Cookie、CSS 選擇器和 URL 參數也會產生非預期的結果,且可能無法正確運作。字串和整數之類的簡單值將可正常運作。
  2. 請盡量減少單一頁面上參考的 dataelementchanged 事件類型數量。雖然監視有效率,但大量的評估可能影響頁面效能。
  3. dataelementchanged 事件類型僅能在目前頁面檢視內運作,因為它是 DOM 式監視系統。
  4. 資料元素監視會輪循以取得值。

ContextHub data layer default example

Example using the AEM ContextHub tool that references and uses the default ContextHub data layer within the Dynamic Tag Management configuration.
ContextHub 資料層會在 Adobe Experience Manager (AEM) 的測試網站中載入,但您可在 AEM 以外獨立使用 ContextHub。如果您想要在 AEM 以外獨立使用 ContextHub,請聯絡您的 Adobe 代表。
可以從瀏覽器主控台參考所有 ContextHub 儲存區。
DTM 資料層監視會在任何其他 DTM 功能之前開始,因此,範例將不會透過 DTM 部署資料層,即使是可行亦然。而是會仰賴於伺服器產生的資料層。否則因為某些資料層值可能無法使用,可能會出現 JavaScript 警告。

定義資料層

配置 AEM ContextHub 工具的第一個步驟是將它新增至 Web 屬性。
目前每個DTM Web屬性只允許一個AEM ContextHub工具。
  1. Click <Web Property Name> > Overview > Add a Tool > AEM ContextHub .
  2. 為工具指定描述性名稱。
  3. Click Create Tool to display the AEM ContextHub Settings page.
  4. Select Use Default ContextHub Data Layer to leverage the standard ContextHub stores.
    Select Customize ContextHub Data Layer to modify the schema. 如果實施中使用非預設 ContextHub 資料層,則有必要使用 自訂選項。
    預設的資料層根可啟用對所有 ContextHub 儲存區的存取。考慮到 ContextHub 儲存區的動態本質,有其他功能可在此資料層使用,但無法在一般資料層方法所使用的簡易 JavaScript 物件參考中使用。
  5. (Conditional) To use a custom data layer, click Open Editor to view the data layer schema definition. If the custom data layer is a modification of the ContextHub schema be sure to add “ContextHub” in the Data Layer Root field.
    預設的 ContextHub 架構隨即在編輯器中填入。
    1. 視需要修改架構以符合網站資料層架構。
    2. Click Save and Close to save the schema and close the editor.
  6. Click Save Changes .

建立資料層資料元素

  1. In the web property, click the Rules tab, then click Data Elements in the left menu.
  2. Click Create New Data Element .
  3. 指定資料元素的名稱。在此範例中,將資料元素命名為「total_price」。
  4. From the Type drop-down list, select AEM ContextHub .
    AEM ContextHub 工具的名稱會在「來源」中填入,但目前的版本中只能定義一個 AEM ContextHub 工具。
  5. 透過在物件選擇器中選取一個路徑,將資料元素對應至資料層。
    在此範例中,選取 cart.totalPriceFloat 「」物件。
  6. Click Save Data Element .

建立使用資料元素變更事件類型的事件型規則

  1. In the web property, click the Rules tab, then click Event Based Rules in the left menu.
  2. Click Create New Rule .
  3. 為規則命名。在此範例中,將規則命名為「cart_total_update」。
  4. 展開「條件」區段。
  5. From the Event Type drop-down list, select dataelementchanged .
  6. 選取在前一節建立的「資料元素」(total_price)。
  7. Under Rule Conditions , select Data Element Value from the drop-down list, then click Add Criteria .
  8. 選取在前一節建立的「資料元素」(total_price),並指派一個值來造成規則觸發。
    在此範例中,使用規則運算式來評估大於或等於 50 的各個項目: ^([5-9]\d|[1-9]\d{2,})$
    如果資料元素值以此方式使用,請務必在相符項目中考慮資料元素設定。For example, selecting the Force Lowercase Value option in the data element settings would convert the value to all lowercase before evaluation. 因為 JavaScript 區分大小寫,「test」與「Test」不同,因此預期不會觸發條件。
  9. Expand the Javascript / Third Party Tags section.
  10. Click Add New Script .
  11. 新增在規則觸發時提供通知的非循序 JavaScript。將規則命名為「big_money_alert」,然後新增類似下列範例的警示指令檔:
    alert('$' + _satellite.getVar(‘total_price’) + ‘ is big money!’);
  12. Click Save Code , then click Save Rule .

驗證實作

在執行以上 Web 屬性、啟用 DTM 的網站上驗證實施。
  • 在開發人員主控台中,檢查是否存在資料層 ( ContextHub )。
  • 將正在監控的資料層物件變更為「不符合」上述條件的值: ContextHub.setItem('/store/cart/totalPriceFloat','5');
  • 將正在監控的資料層物件變更為「符合」上述條件的值: ContextHub.setItem('/store/cart/totalPriceFloat','52');
  • 在範例實施中,應該會出現警示方塊:
如果已開啟 DTM 除錯,主控台中應該會出現失敗的評估。

Custom data layer example

Example using the AEM ContextHub tool that references and uses a custom, non-ContextHub data layer within the Dynamic Tag Management configuration.
The example data layer ( _dl ) will be loaded on the test web page as a Javascript object definition in the <head/> section of the page before the DTM embed code is referenced.
<head> 
    <script> 
        window._dl = { 
            page: { 
                name: 'homepage', 
                quantity: 1, 
                friend: 'No one' } 
        } 
    </script> 
    <script src="//assets.adobedtm.com/satelliteLib-*.js"></script> 
</head> 

DTM 資料層監視 (請參閱以下) 會在任何其他 DTM 功能之前開始,因此,範例將不會透過 DTM 部署資料層。否則因為某些資料層值可能無法使用,可能會出現 JavaScript 警告。

定義資料層

配置 AEM ContextHub 工具的第一個步驟是將它新增至 Web 屬性。
目前每個DTM Web屬性只允許一個AEM ContextHub工具。
  1. Click <Web Property Name> > Overview > Add a Tool > AEM ContextHub .
  2. 為工具指定描述性名稱。
  3. Click Create Tool to display the AEM ContextHub Settings page.
  4. Select Customize ContextHub Data Layer to modify the schema.
    A root Javascript object name must be added to the Data Layer Root field for non-ContextHub data layers. _dl 此定義會用於本節的一般範例中。
  5. Click Open Editor to view the data layer schema definition.
    依預設,預設的 ContextHub 架構隨即在編輯器中填入。
  6. 刪除預設的架構並在網站資料層架構貼上。
    下列非 ContextHub 架構範例用於一般範例:
    { 
      "$schema": "https://json-schema.org/draft-04/schema#", 
      "type": "object", 
      "properties": { 
        "page": { 
          "type": "object", 
          "properties": { 
            "name": { 
              "type": "string" 
            }, 
            "quantity": { 
              "type": "number" 
            }, 
            "friend": { 
              "type": "string" 
            } 
          }, 
          "required": [ 
            "name", 
            "quantity", 
            "friend" 
          ] 
        } 
       }, 
      "required": [ 
        "page" 
      ] 
    } 
    
    
  7. Click Save and Close to save the schema and close the editor, then click Save Changes .

建立資料層資料元素

  1. In the web property, click the Rules tab, then click Data Elements in the left menu.
  2. Click Create New Data Element .
  3. 指定資料元素的名稱。在此範例中,將資料元素命名為「my_friend」。
  4. From the Type drop-down list, select AEM ContextHub .
    AEM ContextHub 工具的名稱會在「來源」中填入,但目前的版本中只能定義一個 AEM ContextHub 工具。
  5. 透過在物件選擇器中選取一個路徑,將資料元素對應至資料層。
    在此範例中,選取 page.friend 「」物件。
  6. Click Save Data Element .

建立使用資料元素變更事件類型的事件型規則

  1. In the web property, click the Rules tab, then click Event Based Rules in the left menu.
  2. Click Create New Rule .
  3. 為規則命名。在此範例中,將規則命名為「find_a_friend」。
  4. 展開「條件」區段。
  5. From the Event Type drop-down list, select dataelementchanged .
  6. 選取在前一節建立的「資料元素」(my_friend)。
  7. Under Rule Conditions , select Data Element Value from the drop-down list, then click Add Criteria .
  8. 選取在前一節建立的「資料元素」(my_friend),並指派一個值來造成規則觸發。
    在此範例中,使用「Carl」作為值。
    如果資料元素值以此方式使用,請務必在相符項目中考慮資料元素設定。For example, selecting the Force Lowercase Value option in the data element settings would convert the value to all lowercase before evaluation. 因為 JavaScript 區分大小寫,「test」與「Test」不同,因此預期不會觸發條件。
  9. Expand the Javascript / Third Party Tags section.
  10. Click Add New Script .
  11. 新增在規則觸發時提供通知的非循序 JavaScript。將規則命名為「found_my_friend」,然後新增類似下列範例的警示指令檔:
    alert(_satellite.getVar(‘my_friend’) + ‘ is my friend.’);
  12. Click Save Code , then click Save Rule .

驗證實作

在執行以上 Web 屬性、啟用 DTM 的網站上驗證實施。
  • 在開發人員主控台中,檢查是否存在資料層 ( _dl )。
  • Change the data layer object that is being monitored to the value that was set in the condition above ( _dl.page.friend = ‘Carl’ ).
    • 在範例實施中,應該會出現警示方塊:
  • Change the object to a different value ( _dl.page.friend = ‘Bob’ ) and no alert should display.
    如果已開啟 DTM 除錯,主控台中應該會出現失敗的評估。
  • Change the object to a lowercase value of the match ( _dl.page.friend = ‘carl’ ) and no alert should display.
  • Change the object to the correct case value of the match ( _dl.page.friend = ‘Carl’ ) and the alert should once again display.