使用 Adobe Journey Optimizer と Platform Web SDK

Adobe Experience Platform Web SDK では、で管理されるパーソナライズされたエクスペリエンスを配信およびレンダリングできます Adobe Journey Optimizer を web チャネルに追加します。 WYSIWYG エディタを使用できます。 Adobe Journey Optimizer Web チャネルまたは非ビジュアルインターフェイス コードベースの Experience Channel を作成、アクティブ化、配信するには、以下を実行します。 Journey Optimizer Web キャンペーンとパーソナライゼーションエクスペリエンス。

IMPORTANT
詳しくは、 Adobe Journey Optimizer Web チャネルドキュメント の基本を学ぶには Journey Optimizer Web エクスペリエンスのオーサリングとレポート。

用語 terminology

サーフェス:Web サーフェスは、URI で識別される Web ページまたはページ上の場所で、 Adobe Journey Optimizer エクスペリエンスコンテンツが配信されます。

提案:内 Adobe Journey Optimizer、提案は、 Journey Optimizer Campaign.

有効化 Adobe Journey Optimizer enable-ajo

を使用し始めるには Adobe Journey Optimizer、次の手順に従います。

  1. 詳しくは、 前提条件 から Adobe Journey Optimizer Web エクスペリエンスガイド具体的には、次のようになります。

    • 設定 Adobe Experience Cloud Visual Editing Helper.
    • 有効にする Adobe Journey Optimizer の datastream.
    • を有効にします。 エッジ上でのアクティブな結合ポリシー オプション。
  2. 次を追加: renderDecisions オプションをイベントに追加できます。 設定 renderDecisions から true 配信されたJourney Optimizerコンテンツ提案を web ページ上に自動レンダリングする場合。

    code language-javascript
    alloy("sendEvent", {
        ...,
        "renderDecisions": true
    })
    
  3. 必要に応じて、イベントに追加のサーフェスを指定します。 デフォルトでは、Web SDK は現在の Web ページの Web サーフェスを自動的に生成し、Edge Network へのリクエストに含めます。 必要に応じて、リクエストに追加のサーフェスを含めるには、 personalization.surfaces オプション sendEvent コマンド、または対応する サーフェス イベントを送信 アクション Web SDK 拡張機能の設定。

    code language-javascript
    alloy("sendEvent", {
        ...
        "personalization": {
            "surfaces": [ "web://my.site.com/about.html", "web://my.site.com/contact.html" ]
        }
    })
    

    extension-add-surface

    イベントサーフェスは、 query.personalization.surfaces リクエストフィールド:

    code language-json
    {
    "events": [
        {
            "query": {
                "personalization": {
                "schemas": [
                    ...
                ],
                "decisionScopes": [
                    "__view__"
                ],
                "surfaces": [
                    "web://ajostage.weebly.com/"
                ]
                }
            },
            ...
        }
    ]
    }
    
  4. 他のパーソナライゼーション機能と同様に、 スニペットを非表示にする エクスペリエンスを取得する際に、ページの特定の部分のみを非表示にする。

Adobe Journey Optimizer Web エクスペリエンスの作成 create-ajo-web-experiences

フォロー: web キャンペーンのオーサリング からの指示 Adobe Journey Optimizer Web エクスペリエンスガイド を作成します。 Journey Optimizer Web キャンペーンとエクスペリエンス。

パーソナライズされたコンテンツのレンダリング rendering-personalized-content

次のドキュメントを参照してください: パーソナライゼーションコンテンツのレンダリング を参照してください。

Adobe Journey Optimizerの Web サーフェスの提案は、 __view__ 決定範囲の提案。 特に、 renderDecisions オプションが true (内) sendEvent コマンドを使用すると、Web SDK によって自動的にレンダリングされます。

Journey Optimizerのコンテンツ提案の例:

{
    "scope": "web://ajostage.weebly.com/",
    "scopeDetails": {
        "correlationID": "ccfaf19c-6360-4aea-b464-0cf924db5da7",
        "characteristics": {
            "eventToken": "eyJtZXNzYWdlRXhlY3V0aW9uIjp7Im1lc3NhZ2VFeGVjdXRpb25JRCI6ImEzNDYxYTMzLTc5MjktNGQyNS1hNmMxLTVkYzM2YWY1NzRmMyIsIm1lc3NhZ2VJRCI6ImNjZmFmMTljLTYzNjAtNGFlYS1iNDY0LTBjZjkyNGRiNWRhNyIsIm1lc3NhZ2VUeXBlIjoibWFya2V0aW5nIiwiY2FtcGFpZ25JRCI6IjEzN2JmMzllLWM1ODgtNGI1My1iODQxLTJiMWZiZDYxM2JkYiIsImNhbXBhaWduVmVyc2lvbklEIjoiMTA1NzY1MmEtZWYwNS00YjE3LWExMmUtY2FlOTQyOTFhMWFjIiwiY2FtcGFpZ25BY3Rpb25JRCI6ImViNTlmODQ4LTk5ZDYtNGE1OC05YmU4LTk4MjIxODU0NmYzNiIsIm1lc3NhZ2VQdWJsaWNhdGlvbklEIjoiYzg2NzFjZmItNDdjYS00YTVjLTg4Y2YtNzYwZDFlZjU1MzQyIn0sIm1lc3NhZ2VQcm9maWxlIjp7ImNoYW5uZWwiOnsiX2lkIjoiaHR0cHM6Ly9ucy5hZG9iZS5jb20veGRtL2NoYW5uZWxzL3dlYiIsIl90eXBlIjoiaHR0cHM6Ly9ucy5hZG9iZS5jb20veGRtL2NoYW5uZWwtdHlwZXMvd2ViIn0sIm1lc3NhZ2VQcm9maWxlSUQiOiI2YTViY2I3ZC02MmYxLTQ5NDItODRkMC02MzE5ZjM5Zjk1ZGUifX0="
        },
        "decisionProvider": "AJO",
        "activity": {
            "id": "137bf39e-c588-4b53-b841-2b1fbd613bdb#eb59f848-99d6-4a58-9be8-982218546f36"
        }
    },
    "id": "002321c0-dff5-4153-b171-a9dfb70b9750",
    "items": [
        {
            "schema": "https://ns.adobe.com/personalization/dom-action",
            "data": {
                "uiData": {
                    "tagType": "Text",
                    "actionType": "changed"
                },
                "content": "Welcome AJO!",
                "prehidingSelector": "#wsite-content > DIV:nth-of-type(2) > DIV:nth-of-type(1) > DIV:nth-of-type(1) > DIV:nth-of-type(1) > DIV:nth-of-type(1) > DIV:nth-of-type(3) > FONT:nth-of-type(1) > SPAN:nth-of-type(1)",
                "type": "setHtml",
                "selector": "#wsite-content > DIV.wsite-section-wrap:eq(1) > DIV.wsite-section:eq(0) > DIV.wsite-section-content:eq(0) > DIV.container:eq(0) > DIV.wsite-section-elements:eq(0) > DIV.paragraph:eq(0) > FONT:nth-of-type(1) > SPAN:nth-of-type(1)"
            },
            "id": "0a522f66-9e6a-4ded-b1d0-e9167f103290"
        },
        {
            "schema": "https://ns.adobe.com/personalization/dom-action",
            "data": {
                "uiData": {
                    "tagType": "Text",
                    "actionType": "changed"
                },
                "content": {
                    "font-weight": "bold"
                },
                "prehidingSelector": "#wsite-content > DIV:nth-of-type(2) > DIV:nth-of-type(1) > DIV:nth-of-type(1) > DIV:nth-of-type(1) > DIV:nth-of-type(1) > DIV:nth-of-type(3) > FONT:nth-of-type(1) > SPAN:nth-of-type(1)",
                "type": "setStyle",
                "selector": "#wsite-content > DIV.wsite-section-wrap:eq(1) > DIV.wsite-section:eq(0) > DIV.wsite-section-content:eq(0) > DIV.container:eq(0) > DIV.wsite-section-elements:eq(0) > DIV.paragraph:eq(0) > FONT:nth-of-type(1) > SPAN:nth-of-type(1)"
            },
            "id": "66216ca5-5d0f-4239-a8c8-6bc4a5a7cbdb"
        }
    ]
}

デバッグ debugging

Adobe Journey Optimizerのパーソナライゼーション実装をデバッグするには、 Web SDK のデバッグ. Adobe Journey Optimizer を使用したトラブルシューティング時に、デバッグトレースを利用できます Adobe Experience Platform Assurance. でのイベントを確認します。 AJO: プレフィックス。

assurance-ajo-trace

recommendation-more-help
ad108910-6329-42f1-aa1d-5920a2b13636