文件Experience PlatformWeb SDK 教學課程

建立資料元素

Last update: Mon May 05 2025 00:00:00 GMT+0000 (Coordinated Universal Time)
  • 主題：

建立對象：

  • 初學者
  • 中繼
  • 開發人員

瞭解如何在Luma示範網站的內容、商務和身分資料的標籤中建立資料元素。 然後以Adobe Experience Platform Web SDK擴充功能變數資料元素型別填入XDM結構描述中的欄位。

學習目標

在本課程結束時，您能夠：

  • 瞭解將資料層對應至XDM的不同方法
  • 建立資料元素以擷取資料
  • 將資料元素對應至XDM物件

先決條件

您已瞭解什麼是資料層，並已完成本教學課程中的先前課程：

IMPORTANT
此課程的資料來自Luma網站上的digitalData資料層。 若要檢視資料層，請開啟您的開發人員主控台，並輸入digitalData以檢視可用的完整資料層。 digitalData資料層

資料層方法

有多種方式可使用Adobe Experience Platform的標籤功能，將資料從資料層對應至XDM。 以下是三種不同方法的一些優點和缺點。 如有需要，可以合併方法：

  1. 在資料層中實作XDM
  2. 在標籤中對應到XDM
  3. 在資料流中對應到XDM
NOTE
本教學課程中的範例會依照標籤中的「對應至XDM」方法進行。

在資料層中實作XDM

此方法涉及使用完整定義的XDM物件作為資料層的結構。 然後將整個資料層對應到標籤中的XDM物件資料元素。 如果您的實作未使用標籤管理程式，此方法可能是最理想的方法，因為您可以使用XDM sendEvent命令，直接從您的應用程式傳送資料至XDM。 如果您確實使用標籤，您可以建立自訂程式碼資料元素，將擷取整個資料層作為傳遞JSON物件至XDM。 然後，您將傳遞JSON對應到「傳送事件動作」中的XDM物件欄位。

以下是資料層使用Adobe使用者端資料層格式的範例：

資料層中的XDM範例
code language-json 
window.adobeDataLayer.push({
"eventType": "web.webPageDetails.pageViews",
"web":{
         "webInteraction":{
            "linkClicks":{
               "id":"",
               "value":""
            },
            "URL":"",
            "name":"",
            "region":"",
            "type":""
         },
         "webPageDetails":{
            "pageViews":{
               "id":"",
               "value":"1"
            },
            "URL":"https://luma.enablementadobe.com/",
            "isErrorPage":"",
            "isHomePage":"",
            "name":"luma:home",
            "server":"enablementadobe.com",
            "siteSection":"home",
            "viewName":""
         },
         "webReferrer":{
            "URL":"",
            "type":""
         }
      }
});

優點

  • 消除重新對應至XDM資料層變數的額外步驟
  • 如果您的Web開發團隊也擁有標籤數位行為，部署可能會更快一些

缺點

  • 完全依賴開發團隊和開發週期來更新要傳送到XDM的資料
  • XDM從資料層接收確切的裝載，因此彈性有限
  • 無法使用內建標籤功能，例如刮取、持續性、快速部署功能
  • 資料圖層較難用於協力廠商畫素(但您可能想要將這些畫素移至事件轉送！
  • 無法在資料層和XDM之間轉換資料

在標籤中對應資料層

此方法包括將個別資料層變數或資料層物件對應至標籤中的資料元素，並最終對應至XDM。 這是使用標籤管理系統實作的傳統方法。

優點

  • 最靈活的方法，因為您可以在資料進入XDM之前控制個別變數並轉換資料
  • 可使用Adobe標籤觸發器和刮取功能將資料傳遞至XDM
  • 可以將資料元素對應至第三方畫素使用者端

缺點

  • 將資料層重新建構為資料元素需要時間
TIP
Google資料層
如果您的組織已使用Google Analytics，且您的網站上具有傳統Google資料層物件，您可以在標籤中使用Google資料層擴充功能。 這可讓您更快部署Adobe技術，而不需要向IT團隊請求支援。 將Google資料層對應至XDM會遵循上述相同步驟。

在資料流中對應到XDM

此方法使用內建在資料流設定中的功能，稱為資料收集的資料準備，並略過將資料層變數對應到標籤中的XDM。

優點

缺點

  • 資料層變數無法當作使用者端協力廠商畫素的資料元素使用，但可用於事件轉送
  • 無法使用Adobe Experience Platform標籤功能的刮擦功能
  • 如果將資料層對應到標籤和資料流中，維護複雜性就會增加
IMPORTANT
如先前所述，本教學課程中的範例依照標籤中的「對應至XDM」方法進行。

建立資料元素以擷取資料層

建立XDM物件之前，請先為Luma示範網站資料層建立下列資料元素集：

  1. 移至​ 資料元素 ​並選取​ 新增資料元素 (或​ 建立新資料元素 （如果標籤屬性中沒有現有的資料元素）

    建立資料元素

  2. 將資料元素命名為 page.pageInfo.pageName

  3. 使用​ JavaScript變數 資料元素型別 ​指向Luma資料層中的值： digitalData.page.pageInfo.pageName

  4. 勾選​ 強制小寫值 ​和​ 清除文字 ​方塊，以標準化大小寫格式並移除多餘的空格

  5. 保留None為​ 儲存期間 ​設定，因為此值在每個頁面上都不相同

  6. 選取​ 儲存

    Page Name資料元素

請依照相同的步驟建立這些額外的資料元素：

  • page.pageInfo.server ​對應至
    digitalData.page.pageInfo.server

  • page.pageInfo.hierarchie1 ​對應至
    digitalData.page.pageInfo.hierarchie1

  • user.profile.attributes.username ​對應至
    digitalData.user.0.profile.0.attributes.username

  • user.profile.attributes.loggedIn ​對應至
    digitalData.user.0.profile.0.attributes.loggedIn

  • product.productInfo.sku ​對應至digitalData.product.0.productInfo.sku

  • product.productInfo.title ​對應至digitalData.product.0.productInfo.title

  • cart.orderId ​對應至digitalData.cart.orderId

  • product.category ​使用​ 自訂程式碼 資料元素型別 ​和下列自訂程式碼來剖析最上層類別的網站URL：

    code language-javascript 
    var cat = location.pathname.split(/[/.]+/);
if (cat[5] == 'products') {
   return (cat[6]);
} else if (cat[5] != 'html') {
   return (cat[5]);
}

  • cart.productInfo ​使用以下自訂程式碼：

    code language-javascript 
    var cart = digitalData.cart.cartEntries;
var cartItem = [];
cart.forEach(function(item, index, array){
cartItem.push({
"SKU": item.sku
});
});
return cartItem;

  • cart.productInfo.purchase ​使用以下自訂程式碼：

    code language-javascript 
    var cart = digitalData.cart.cartEntries;
var cartItem = [];
cart.forEach(function(item, index, array){
var qty = parseInt(item.qty);
var price = parseInt(item.price);
cartItem.push({
"SKU": item.sku,
"quantity": qty,
"priceTotal": price
});
});
return cartItem;
CAUTION
JavaScript變數資料元素型別會將陣列參照視為點而非括弧，因此將使用者名稱資料元素參照為digitalData.user[0].profile[0].attributes.username 將無法運作。

為XDM和資料物件建立變數資料元素

您剛建立的資料元素將用於建立XDM物件（適用於Platform應用程式）和資料物件(適用於Analytics、Target和Audience Manager)。 這些物件有自己的特殊資料元素，稱為​ 變數 ​資料元素，這些資料元素很容易建立。

若要建立XDM的變數資料元素，請將其連結至您在設定結構描述課程中建立的結構描述：

  1. 選取​ 新增資料元素

  2. 為資料元素命名xdm.variable.content。 建議您為XDM專屬的資料元素加上前置詞「xdm」，以便更妥善地組織標籤屬性

  3. 選取​ Adobe Experience Platform Web SDK ​做為​ 擴充功能

  4. 選取​ 變數 ​做為​ 資料元素型別

  5. 選取​ XDM ​做為​ 屬性

  6. 選取您建立結構描述的​ 沙箱

  7. 選取適當的​ 結構描述，在此案例中為Luma Web Event Data

  8. 選取​ 儲存

    XDM 的變數資料元素

接下來，為資料物件建立變數資料元素：

  1. 選取​ 新增資料元素

  2. 為資料元素命名data.variable。 建議您為資料物件特定的資料元素加上前置詞「data」，以便更妥善地組織標籤屬性

  3. 選取​ Adobe Experience Platform Web SDK ​做為​ 擴充功能

  4. 選取​ 變數 ​做為​ 資料元素型別

  5. 選取​ 資料 ​做為​ 屬性

  6. 選取您要在本教學課程中實施的Experience Cloud解決方案

  7. 選取​ 儲存

    資料物件的變數資料元素

在這些步驟結束時，您應該建立下列資料元素：

核心擴充功能資料元素
Platform Web SDK擴充功能資料元素
cart.orderId
data.variable
cart.productInfo
xdm.variable.content
cart.productInfo.purchase
page.pageInfo.hierarchie1
page.pageInfo.pageName
page.pageInfo.server
product.category
product.productInfo.sku
product.productInfo.title
user.profile.attributes.loggedIn
user.profile.attributes.username
TIP
在未來的建立標籤規則課程中，您將瞭解​ 變數 ​資料元素如何讓您使用​ 更新變數動作型別，棧疊標籤中的多個規則。

設定好這些資料元素後，您就可以開始使用標籤規則將資料傳送至PlatformEdge Network了。 但首先，瞭解如何使用Web SDK收集身分資料。

下一步：

NOTE
感謝您投入時間學習Adobe Experience Platform Web SDK。 如果您有任何疑問、想分享一般意見或有關於未來內容的建議，請在這篇Experience League社群討論貼文上分享
recommendation-more-help
8cbc0fd8-ca1d-433b-9c3d-bc3f113347d4