Tag: Adobe Target

はじめに Adobe TargetではmboxパラメータやProfile Scriptパラメーターといった動的データをオファーに活用することもできます。 これを押さえておくと、ちょっとしたパターン違いのための対応の際に追加ページを利用するか単一オファーで対応できるかといった検討もできるようになります。 オファーでの書き方 オファー内で以下のように書くと、パラメータの値に置き換えられます。太字の箇所は該当パラメータ名に置き換えてください。 プロファイルスクリプトパラメータ： ${user.<プロファイルスクリプトパラメータ名>} mboxパラメータ： ${mbox.<mboxパラメータ名>} In-mboxプロファイルパラメータ ${profile.<プロファイルパラメータ名>} 備考： Adobe Target Recommendationのデザインの場合には$の前にバックスラッシュ（）を追加してエスケープさせる必要があります。 例 Implement Digitalのカテゴリカラム（https://www.implementdigital.com/category/column）ページにて、Global mboxパラメータ「favoriteColor」値がorangeまたはgreenのときに各行の日時カラーを変更します。 デフォルト： ●Adobe Target設定例（VEC） ●オファー（カスタムコード）例 ●表示例：「favoriteColor」値がorangeのとき ●表示例：「favoriteColor」値がgreenのとき 参考HELP https://experienceleague.adobe.com/ja/docs/target/using/experiences/offers/passing-profile-attributes-to-the-html-offer 終わりに いかがでしょうか？ mboxパラメータやScript Profileパラメータをオファーもオファー設定の活用できると１つオファーのオファーにまとめられるなどのメリットが出てくることもあります。 この内容が今後のオファー作成時の一助となれば幸いです。Implement DigitalではAdobe Analyticsの分析を支援するサービスを提供しています。ご興味がありましたらお問い合わせください。

はじめに Adobe Targetの設定確認でアクティビティQA URLはよく使うかと思います。（余談ですが、アクティビティQA URLでページにアクセス後、施策が動作している状態をアクティビティQAモードと呼びます） ただし、アクティビティQAモードは一定期間中有効となるため、通常URLでのアクセスでもアクティビティQA URLの設定がページに表示されることがままあります。アクティビティQAモードは解除できますので、紛らわしいようでしたら都度解除することをおすすめします。 アクティビティQAモードの解除方法 Adobe Targetのライブラリ「at.js」のバージョンによって対応方法が異なります。もしご利用のバージョンが不明であれば(1) -> (2)の順で確認するとよいでしょう。 (1) at.js 2系の場合 アクティビティQA URLでページにアクセスした後に「at_qa_mode」クッキーが作成されますのでこれを削除すると解除されます。 (2) at.js 1系の場合 「at_qa_mode」クッキーは作成されませんので、アクティビティQA URLのURLパラメータ部分を「at_preview_token=」のみに書き換えて再度アクセスします。 Implement DigitalトップURLを例とすると以下のようなURLとなります。https://www.implementdigital.com/?at_preview_token= (3) Web SDKの場合 バージョン 2.19.2で確認したところでは(1)同様に「at_qa_mode」クッキーが作成されましたため、(1)同様にこのクッキーを削除します。 まとめ 今回はAdobe TargetのアクティビティQAモードの解除方法について紹介しました。 Implement DigitalではAdobe Targetの導入・実装・運用を支援するサービスを提供しています。ご興味がありましたらお問い合わせください。

はじめに Adobe Targetで施策を実施する際にはPCとSPで画面確認が必要なことは多々あるかと思います。 特にレスポンシブデザインのサイト向けであれば、Mobile Viewportが確認の一助になるかと思いますので紹介したいと思います。 Mobile Viewportとは Adobe TargetのMobile Viewportは、平たく言うと、Visual Experience Composer（以下、VECと呼称します）にて様々な画面サイズで画面表示を試すことができる機能です。 HELP： https://experienceleague.adobe.com/ja/docs/target/using/experiences/vec/mobile-viewports ※いくつかのデバイスのビューポートサイズも掲載されています   初期状態ではDesktopしかありませんがこれのパターンを増やすことができます。よって、サイトのガイドラインなどで指定された幅・高さをVEC上で擬似的に再現することで、一次確認などに活用ができます。 例えば、下図はiPhone 14の幅・高さのMobile Viewportを追加した例となります。（画面上部のComposeタブ近くにiPhone 14と表示されています） モバイルビューポートの追加 あらかじめ画面幅や高さ、OSを調べておきます。 その上で、管理者メニューのVisual experience composerメニューを開き、Mobile viewport configurationブロックのAddボタンをクリックします。 登録フォームがモーダル表示されます。 名前、幅、高さ、OSを選択してSaveボタンをクリックします。 Mobile viewport configurationブロックに保存した設定が追加されます。 Mobile Viewportの使い方 VECのギアアイコンをクリックしAdd Mobile Viewportsをクリックします。 ヘッダーメニュー下にモバイルアイコンが表示されるためクリックします。 Viewportsパネルが表示されるので追加するViewportをクリックしてONにします。 VECの画面UI部分がONにしたViewport設定の画面幅や高さにUIが変更されます モバイルアイコン右横をクリックすると横向きの表示も確認できます。 ビューポートは複数ONにできます。 以下はiPhone 12 Pro Maxの画面幅・高さのMobile Viewport設定もONした表示例となります。 帯のViewport名（上図だとiPhone 12やDesktop）をクリックするとそのViewport設定の幅・高さに表示が切り替わります。 以下は上図でDesktopをクリックした後の表示となります。 まとめ いかがでしょうか？ Mobile Viewportを設定しておくとVEC設定時にちょっとした表示確認が便利になるかと思います。…

はじめに Adobe Target のアクティビティを確認したい場合に、アクティビティIDからアクティビティを特定する方法を紹介します。 ※アクティビティIDとはアクティビティの詳細情報に表示されている数字を指します。 手順 アクティビティ一覧を表示します。 ブラウザーの開発者ツールを開きます。 ページの再読み込みを行います。 ネットワークパネルで、「activities.at.json」でフィルタリングを行います。 activities.at.jsonのレスポンスを整形表示にします。 対象のアクティビティIDで検索します。 アクティビティの件数が多くて現在のページに全て表示されていない場合は、アクティビティ一覧を下までスクロールさせてさらにactivities.at.jsonを読み込ませて同様に検索を行います。（アクティビティが大量にある場合は、すべてのアクティビティのリストを表示させて後でレスポンスの検索からIDを検索する方法が有効です） activities.at.jsonのitems > sync > root > targetIdがアクティビティIDにあたります（①）。少し上にある「jcr:title」がアクティビティ名称（②）になりますので、対象のアクティビティが特定できます。 まとめ 今回は個別のTarget実装というよりは、トラブルシューティング等で複数のアクティビティから特定のアクティビティを見つけるような時に使えるようなTipsになります。 もし何かの時にお役立て頂けましたら幸いです。 Implement DigitalではAdobe Targetの導入・実装・運用を支援するサービスを提供しています。 ご興味がありましたらお問い合わせください。

はじめに Adobe Target の関数 adobe.target.trackEvent、adobe.target.getOffer、adobe.target.getOffersはAdobe Targetの実装でmboxパラメーターをリクエストする際に使用する関数ですが、その違いについて説明します。 前提条件 at.jsのバージョンは2.xを対象としています。 それぞれの主な機能 adobe.target.trackEvent クリックの追跡やコンバージョンの計測に使用します。レスポンスは受け取りません。 リクエストにはtimestampが含まれており、閲覧している端末の内部時計のずれが大きいと400エラーになり計測がされない場合があります。 内部的には navigator.sendBeacon() が呼ばれています。 adobe.target.getOffer ターゲットのオファーを受け取るためのリクエストを発行します。レスポンスでオファーを受け取り、必要に応じてadobe.target.applyOfferを実行します。 リクエストにはwindow.targetPageParams()やwindow.targetPageParamsAll()が定義されている場合にはそれらで追加されたパラメーターが追加されます。 内部的には window.XMLHttpRequest()が呼ばれています。 adobe.target.getOffers 複数のオファーを同時にリクエストできます。それ以外に、有効なアクティビティの全てのオファーを受け取ることもできます。レスポンスでオファーを受け取り、必要に応じてadobe.target.applyOffersを実行します。 リクエストにはwindow.targetPageParams()やwindow.targetPageParamsAll()が定義されている場合にはそれらで追加されたパラメーターが追加されます。 at.js初期化パラメーターのpageLoadEnabledが有効な場合は自動的にパラメーターexecute -> pageLoadで呼び出されます。 内部的には window.XMLHttpRequest()が呼ばれています。 使用例 adobe.target.trackEvent adobe.target.trackEvent({ “mbox”: “clicked-cta”, “params”: { “param1”: “value1” } }); adobe.target.getOffer adobe.target.getOffer({ “mbox”: “target-global-mbox”, “params”: { “a”: 1, “b”: 2 }, “success”: function(offer) { adobe.target.applyOffer( {…

はじめに Adobe Targetで、非同期で取得される会員IDなどをmboxパラメーターに含めたい場合は、window.targetGlobalSettings.dataProviders を使用すると効率的に設定可能です。 しかし会員情報取得API等とAdobe Targetの連携がされていない場合は、独自で値を取得する仕組みが必要です。 ページ要素に必要な値が設定される場合に、それらから値を取得する方法を説明します。 window.targetGlobalSettings.dataProviders の基礎 window.targetGlobalSettings.dataProviders に配列で設定します。 （https://developer.adobe.com/target/implement/client-side/atjs/atjs-functions/targetglobalsettings/#data-providers より抜粋） KEY TYPE DESCRIPTION name String Provider名 version String Providerバージョン timeout Number Providerのタイムアウト値。オプション provider Function Providerデータ取得ロジック。 引数のcallbackはデータが取得成功または失敗した際に呼び出す。 callbackには2つのパラメーターがある。 1つ目がエラーで、エラー発生時にはエラーを指定し、成功時にはnullを指定します。 2つ目がTargetリクエストに含めたいJSONオブジェクトで指定します。 同期で設定しているシンプルな例 var syncDataProvider = { name: “simpleDataProvider”, version: “1.0.0”, provider: function(callback) { callback(null, {t1: 1}); } }; window.targetGlobalSettings = { dataProviders: [ syncDataProvider…

Adobe Targetのアクティビティーの検証のためにQAモードを使用しますが、QAモードが使用できない、オーディエンス条件を満たす条件が作れないなどの場面に遭遇することもあると思います。 そういった場合に、trackEventを使用してプロファイルスクリプトに値を設定することによって任意の条件のオーディエンスを作成する方法を考えました。 1.プロファイルスクリプトを作成 下記のようにmboxのパラメーターを返すようにします。 if (mbox.name == “debug-activity”) { return mbox.param(“value”); } 2.オーディエンスを作成 先程作成したプロファイルスクリプトを参照し、条件として後でtrackEventで渡すvalue値を指定します。   属性：訪問者プロファイル user.debugActivity 条件：等しい（静的値） test1 3.アクティビティーにオーディエンスを指定 作成したオーディエンスを検証するアクティビティーのターゲットに指定します。   属性：訪問者プロファイル user.debugActivity 条件：等しい（静的値） test1 4.検証する環境で、trackEventを実行 Chrome等のjavascriptコンソールで下記を実行します。 adobe.target.trackEvent({ “mbox”: “debug-activity”, “params”: { “value”: “test1” } }); この後、対象のページにアクセスすれば3で作成したアクティビティーのエクスペリエンスをテストできます。 5.最後に 1で作成したプロファイルスクリプトは使い回しができ、2のオーディエンスで比較する文字列と、4で実行するtrackEventのvalue値を変更することで様々なアクティビティーの検証ができるようになります。 Implement DigitalではAdobe Targetの導入・実装・運用を支援するサービスを提供しています。 ご興味がありましたらお問い合わせください。

Adobe Target プロファイルスクリプトの無効化 Adobe Targetのプロファイルスクリプトで、それまで動作していたのにいつの間にか非アクティブになってしまっていたことがありました。 調べてみると繰り返し処理のループ回数が当初より多くなっていたことにより、javascript命令数エラーになっていたので、その際に行った対策を紹介します。 プロファイルスクリプトの一覧で確認すると、ステータスにメッセージとして「属性は自動的に無効化されました : Script XXXXX executed more than 2000 instructions」と表示されています。 原因について プロファイルスクリプトにはjavascript命令が2,000という制限があり、それを超えてしまうと自動的に無効化されてしまいます。 繰り返し処理がある場合などは、当初は動作していたのに、日数が経ったり特殊な条件下で制限を超えてしまう場合があります。 対処方法 new演算子はリテラルにする 例： new Object() -> {} new Array() -> [] Array.push()は使用せず、文字列の結合を使用する arr.push(variable) -> arr += variable + ‘,’ 複雑な処理を別スクリプト化する スクリプト内で生成した変数を使用しない複雑な処理は別スクリプトとして記述し、コード内でuser.get(‘scriptName’)で参照します。 別スクリプトでは必要に応じてスクリプトの実行条件やパラメータ参照をメインのスクリプトと同様に記述します。 参考 特定の状況での Target によるプロファイルスクリプトの無効化 https://experienceleague.adobe.com/docs/target/using/audiences/visitor-profiles/profile-parameters.html?lang=ja#section_C0FCB702E60D4576AD1174D39FBBE1A7 ベストプラクティス https://experienceleague.adobe.com/docs/target/using/audiences/visitor-profiles/profile-parameters.html?lang=ja#best Implement DigitalではAdobe Targetの導入・実装・運用を支援するサービスを提供しています。 ご興味がありましたらお問い合わせください。