使用Platform Web SDK設定Adobe Target

前往 擴充功能 標籤區段

選取 設定 適用於Adobe Experience Platform Web SDK擴充功能

選取 將預先隱藏的程式碼片段複製到剪貼簿 按鈕

前往 擴充功能 標籤區段

選取 設定 Platform Web SDK擴充功能的按鈕

選取 編輯預先隱藏樣式 按鈕

修改CSS以包含您要使用的選取器和隱藏方法，例如： body { opacity: 0 !important } 是否想要預先隱藏頁面的整個內文。

儲存變更並建置至程式庫

前往 資料彙集 介面

在左側導覽中選取 資料串流

選取先前建立的 Luma Web SDK: Development Environment 資料流

選取 新增服務

選取 Adobe Target 作為 服務

如有需要，請依照下列指引，輸入有關Target實作的選擇性詳細資料。

選取 儲存

在 資料彙集 介面，開啟您用於本教學課程的標籤屬性

開啟 all pages - library loaded - send event - 50 規則

選取 Adobe Experience Platform Web SDK - Send event 動作

啟用 呈現視覺個人化決定 勾選核取方塊

儲存您的變更，然後建置到您的程式庫

導覽至Adobe Target介面

使用活動URL的Luma首頁建立體驗鎖定目標(XT)活動

修改頁面，例如，變更首頁主圖橫幅上的文字。 完成後，選取 儲存 則 下一個.

更新事件名稱，然後選取 下一個.

選擇Adobe Analytics作為報表來源，搭配適當的報表套裝，並選擇「訂單」量度作為目標

儲存活動

如果您熟悉變更，那麼可以啟動活動。 否則，如果您想預覽體驗而不啟動，您可以複製 QA預覽URL.

載入Luma首頁，應該會看到變更已套用

幾小時後，您應該就能在Adobe Analytics中檢視Target活動資料和轉換。 請參閱Target指南，瞭解更多關於 Analytics for Target (A4T)報表.

開啟Adobe Experience Platform Debugger瀏覽器擴充功能

前往 Luma示範網站 並使用除錯工具 將網站上的tag屬性切換為您自己的開發屬性

重新載入頁面

選取 網路 Debugger中的工具

篩選依據 Experience PlatformWeb SDK

在事件列中選取第一次呼叫的值

請注意，底下有索引鍵 query > personalization 和 decisionScopes 具有值 __view__. 此範圍等同於 target-global-mbox. 此Platform Web SDK呼叫要求Target做出決定。

關閉覆蓋圖並選取第二個網路呼叫的事件詳細資料。 只有在Target傳回活動時，此呼叫才會出現。

請注意，有從Target傳回的活動和體驗的詳細資料。 此Platform Web SDK呼叫會傳送Target活動已轉譯給使用者的通知並增加曝光次數。

開啟 all pages - library loaded - send event - 50 規則

選取 Adobe Experience Platform Web SDK - Send Event 動作

新增一或多個要使用的範圍。 在此範例中，使用 homepage-hero.

儲存您的變更並將組建組建至程式庫

建立名為的規則 homepage - send event complete - render homepage-hero.

將事件新增至規則。 使用 Adobe Experience Platform Web SDK 擴充功能與 傳送事件完成 事件型別。

新增條件以將規則限制在Luma首頁(不含查詢字串的路徑等於 /content/luma/us/en.html)。

將動作新增至規則。 使用 Adobe Experience Platform Web SDK 擴充功能和 套用主張 動作型別。

輸入 %event.propositions% 放入主張欄位，因為我們正在使用「傳送事件完成」事件當作此規則的觸發器。

在「主張中繼資料」區段中，選取 使用表單

對於 範圍 欄位輸入 homepage-hero

對於 選擇器 欄位輸入 div.heroimage

的 動作型別 選取 設定HTML

選取 保留變更

除了呈現活動之外，您必須額外呼叫Target，指出已呈現表單式活動：

將另一個動作新增至規則。 使用 核心 擴充功能與 自訂程式碼 動作型別：

貼上下列JavaScript程式碼：

var propositions = event.propositions;
var heroProposition;
if (propositions) {
   // Find the hero proposition, if it exists.
   for (var i = 0; i < propositions.length; i++) {
      var proposition = propositions[i];
      if (proposition.scope === "homepage-hero") {
         heroProposition = proposition;
         break;
      }xw
   }
}
// Send a "display" event
if (heroProposition !== undefined){
   alloy("sendEvent", {
      xdm: {
         eventType: "display",
         _experience: {
            decisioning: {
               propositions: [{
                  id: heroProposition.id,
                  scope: heroProposition.scope,
                  scopeDetails: heroProposition.scopeDetails
               }]
            }
         }
      }
   });
}

選取 保留變更

儲存您的變更並將組建組建至程式庫

載入Luma首頁幾次，這應該足以製作新的 homepage-hero 決定範圍在Target介面中註冊。

開啟 Adobe Target

停用上一個課程使用的活動

使用表單式體驗撰寫器選項建立體驗鎖定目標(XT)活動

選取 homepage-hero 位置(從位置下拉式清單和 建立HTML選件 從內容下拉式清單。 如果該位置無法使用，您可以鍵入該位置。 Target在收到該位置或範圍的請求後，會定期填入新的位置名稱。

將下列程式碼貼到內容方塊中。 此程式碼為具有不同背景影像的基本主圖橫幅：

<div class="we-HeroImage jumbotron" style="background-image: url('/content/luma/us/en/women/_jcr_content/root/hero_image.coreimg.jpeg');">
   <div class="container cq-dd-image">
      <div class="we-HeroImage-wrapper">
         <p class="h3">New Luma Yoga Collection</p>
         <strong class="we-HeroImage-title h1">Be active with style&nbsp;</strong>
         <p>
            <a class="btn btn-primary btn-action" href="/content/luma/us/en/products.html" role="button">Shop Now</a>
         </p>
      </div>
   </div>
</div>

在 目標與設定 步驟，選擇Adobe Target作為報表來源，然後 參與 > 頁面檢視 作為目標

儲存活動

如果您熟悉變更，那麼可以啟動活動。 否則，如果您想預覽體驗而不啟動，您可以複製 QA預覽URL.

載入Luma首頁，應該會看到變更已套用

開啟Adobe Experience Platform Debugger瀏覽器擴充功能

前往 Luma示範網站 並使用除錯工具 將網站上的tag屬性切換為您自己的開發屬性

重新載入頁面

選取 網路 Debugger中的工具

篩選依據 Adobe Experience Platform Web SDK

在事件列中選取第一次呼叫的值

請注意，底下有索引鍵 query > personalization 和 decisionScopes 具有值 __view__ 就像之前一樣，但現在也有一個 homepage-hero 已包含範圍。 此Platform Web SDK呼叫要求Target針對使用VEC和特定 homepage-hero 位置。

關閉覆蓋圖並選取第二個網路呼叫的事件詳細資料。 只有在Target傳回活動時，此呼叫才會出現。

請注意，有從Target傳回的活動和體驗的詳細資料。 此Platform Web SDK呼叫會傳送Target活動已轉譯給使用者的通知並增加曝光次數。 這是由您先前新增的自訂程式碼動作起始。

開啟 all pages - library loaded - send event - 50 規則

選取 Adobe Experience Platform Web SDK - Send event 動作

新增 data.content 資料元素至資料欄位

儲存您的變更並將組建組建至程式庫

開啟 all pages - library loaded - send event - 50 規則

開啟 傳送事件 動作

選取 使用引導式事件 然後選取 要求個人化

這樣會鎖定 型別 作為 決策主張擷取

導覽至 Luma示範網站 並使用電子郵件登入 test@adobe.com 和密碼 test

導覽至產品詳細資料頁面

開啟Adobe Experience Platform Debugger瀏覽器擴充功能，並 將tag屬性切換為您自己的開發屬性

重新載入頁面

選取 網路 Debugger中的工具並篩選依據 Adobe Experience Platform Web SDK

在事件列中選取第一次呼叫的值

請注意，底下有索引鍵 data > __adobe > target 其中會填入產品、類別和登入狀態的相關資訊。

開啟 Adobe Target

導覽至 受眾 區段

建立受眾並選擇 自訂 屬性型別

搜尋 引數 欄位 web. 下拉式功能表應該會填入與網頁詳細資料相關的所有XDM欄位。

選擇 訪客資料 屬性型別

搜尋 loggedIn. 如果下拉式選單中有屬性，表示該屬性已正確傳遞至Target。 新屬性可能需要幾分鐘的時間才能在Target UI中使用。

導覽至 Recommendations 區段

選取 目錄搜尋 在左側導覽列中

搜尋您先前在Luma網站上造訪的產品SKU或產品名稱。 產品應顯示在產品目錄中。 新產品可能需要幾分鐘的時間才能在Recommendations產品目錄中搜尋。

開啟 保證

啟動新的保證工作，輸入 工作階段名稱 並輸入 基礎url 針對您的網站或您正在測試的任何其他頁面

按一下 下一個

選取您的連線方法，在此案例中，我們將使用 複製連結

複製連結並貼到新的瀏覽器標籤中

按一下 完成

您的保證工作階段啟動後，您會看到事件標籤中填入的事件

依「tnta」篩選

選取最近的呼叫並展開訊息，以確定其是否正確填入並記下「tnta」值

接著，保留「tnta」篩選，並選取analytics.mapping事件（在我們剛才檢視的目標事件之後發生）。

檢查「context.mappedQueryParams」。<yourschemaname>「值」以確認其包含「tnta」屬性，該屬性具有符合在先前目標事件中找到的相符串連字串。