Common Web SDK Pluginsエクステンションの紹介

はじめに Common Web SDK Pluginsエクステンションをインストールすると、AppMesurement.jsでよく使われていたプラグイン群をデータエレメントで利用できるようになります。 エクステンションのURL https://exchange.adobe.com/apps/ec/108520 エクステンションのインストール WebプロパティのExtensions画面のCatalogタブをクリックし、下のテキストボックスにてCommonなどの文字列で検索します。 クリックすると右タブが表示されるのでInstallボタンをクリックしてインストールします。 このエクステンションには設定項目は特にありません。 ただし、通常のエクステンション同様、このままだと未Publish状態のため、Publishは忘れず対応してください。 プラグインの紹介 Common Web SDK Pluginsをインストールするとデータエレメントの設定画面のExtensionで選択できるようになり、その後、Data Element Typeでプラグインが選択できるようになります。 本ページ作成時点では利用できるプラグインは12種類あり、そのうちAppMesurement.jsでよく使われていたプラグインをいくつかご紹介します。 ●getAndPersistValue Cookieに値を保持(保存する値が空値だとCookieは上書きされません)しつつその値を参照できるプラグインです。 利用するには、保存する値、Cookie名、保持日数(0は30分無操作)を指定します。 ●getNewRepeat Cookieを利用して、新規(New)または再訪問(Repeat)かを判別するプラグインです。 日数を指定します。 ●getPagename URLのパスなどを用いてページ名を生成するプラグインです。 サイトID(FQDNの識別子のようなもの、未指定だと現在のドメインが使用される)、ページ名に追加するクエリパラメータ名、ページ名に追加するハッシュ名、セパレータを指定します。 ただし、いくつか注意が必要です。 トップページ(/)だとwww.implementdigital.com:homeのように末尾がhomeとなる 末尾が「/」終わりのパスだとそれを省いたページ名となる 例: https://www.implementdigital.com/google-analytics-implementation/ ↓ www.implementdigital.com:google-analytics-implementation もし、既存のページ名が下層ページと粒度を合わせる構造、例えば、 www.implementdigital.com:google-analytics-implementation:index のようなページ名で運用されている場合は注意が必要です。 と、いくつかの特徴がありますので、既存のページ名のパターンと比較した上で導入を検討してみてください。 ●getPreviousValue Cookieを利用して値を一定期間保持しつつ、比較したい値との差異があるかをチェックします チェック対象の値とCookie名を指定します。 ●getQueryParam URLより指定のクエリパラメータを取り出します。 複数のクエリパラメータが指定でき、複数のクエリパラメータがある場合には設定した区切り文字で連結した値を返します。 クエリパラメータ(複数ある場合にはカンマ区切り)、区切り文字、チェック対象のURLを指定します ●getTimeParting 「year=2023 | month=December | date=21 | day=Thursday…

Adobe LaunchでもdataLayerを活用したい

はじめに Google Tag Managerを用いたサイトではGoogle AnalyticsなどのサービスやツールにdataLayerが頻繁に活用されているケースも珍しくはありません。 そこにAdobe Launchタグを追加することになった場合に、せっかくのdataLayerがあるのに活用できないという懸念がある場合には、本記事は参考になるかと思います。 ぜひご一読ください。 結論としましては、Google Data Layerエクステンションを利用することで、一般的なdata Layer運用であれば、特にページ側での追加対応なしに対応ができるシーンが多いと思われます。 Google Data Layerエクステンション Adobe Launchのエクステンション画面のCatalogよりGoogle Data Layerを探します。 Google Data Layerパネルをクリックして画面右のInstallをクリックします。 dataLayer変数名が聞かれます。(dataLayerのままでしたら入力は不要です) Saveを押してインストールができると、ルールやデータエレメントでdataLayer関連の設定ができるようになります。 データエレメント ExtensionプルダウンにてGoogle Data Layerが選択できるようになり、選んだ画面は以下となります。 プロパティの入力や「Only event properties」のON/OFF状態で返り値に違いが生じます。 画面右に詳細な説明がありますのでご利用時にはまずご確認ください。 一般的には、pushされたオブジェクト内のデータをAdobe Analyticsの計測値にも使うというシーンが多いかと思われますので、参照したいプロパティ名を入力します。 なお「Only event properties」はeventなしのpushを無視するオプションで、通常だとOFFで済むことが多いように見受けられます。 ルール ルールではEVENTSとACTIONSのExtensionプルダウンにてGoogle Data Layerが選択できるようになります。 EVENTS こちらもご利用時には右側の説明をまずご確認ください。 運用中(予定)のdataLayerの設計/要件次第ですが、基本はユニークなeventのpushをアクションの発生と見なし、それをAdobe Analyticsで取りたい、という実装が多いかと思います。その場合には一番下のSecific Eventを活用することになります。 例えば、コンテンツの読了の際に、dataLayerに{event: “Finished reading”}というオブジェクトをpushされているとします。 これをトリガーにAdobe Analyticsに読了計測を実施する場合は以下のようなEVENTS設定となります。 ルール(ACTIONS) ACTIONSだと更にAction Typeに3種類があります。 Google…

Adobe Launch (Tags)で簡単にYouTube動画計測を行う方法

はじめに Adobe AnalyticsでYouTube動画の再生回数などを計測する場合、いくつか方法がありますが、本コラムでは比較的簡単な方法としてYouTube ビデオトラッキング拡張機能を使った方法をご紹介します。 前提条件 (1)Adobe Experience Platform Data CollectionのLaunch(Tags)プロパティでは、次の拡張機能がExtensions画面から設定されている必要があります。 「Adobe AnalyticsとExperience Cloud ID Service」 ※「Adobe Experience Platform Web SDK」でも動作可能です。 「Core」 拡張機能 (2)各webページのYouTubeプレーヤー埋め込みタグは、以下のようにIFrame Player APIを利用したコードスニペットである必要があります。

Adobe Launch Mapping Tableエクステンションの紹介

はじめに Mapping Tableエクステンションはデータエレメントタイプ「Mapping Table」をインストールしたLaunchプロパティに追加します。 このデータエレメントタイプ「Mapping Table」は特定の文字パターンをもとに計測値を作ることができます。そのため、あまり複雑な構文でなければ、カスタムコードにてJavaScriptでIfやSwitch構文の代わりにもなりえます。 エクステンションのインストール WebプロパティのExtensions画面のCatalogタブをクリックし、下のテキストボックスにてMappingなどの文字列で検索します。 Mapping Tableをクリックすると右タブが表示されるのでInstallボタンをクリックしてインストールします。 Mapping Tableエクステンションの画面が表示されますので、Saveをクリックします。 このエクステンションには設定項目は特にありませんのでインストールはこれで完了です。 ただし、通常のエクステンション同様、このままだと未Publish状態です。 DevelopmentまたはStaging環境へのBuildとProductionへのPublishは忘れず対応してください。 Mapping Tableデータエレメント エクステンションを追加すると、データエレメント画面の左メニュー > Extensionにて「Mapping Table」が選べるようになります。 データエレメント「Mapping Table」の画面 設定例 以下の要件を対応するのにMapping Tableを使用してみます。 要件: Implement Digitalの「プロフェッショナルサービス」の配下ページ群へのアクセスをそれぞれのサービスの製品群カテゴリの粒度(下記)で分析したいとします。 Adobe Experience Cloud Google Marketing Platform Smart Sheet Core Web Vitals Optimizely ただ、「プロフェッショナルサービス」の配下ページはURLパスの第一階層レベルで既に個々のサービスまで分かれています。 例: Adobe Analytics導入支援:/adobe-analytics-introduction/ Adobe Analytics実装支援:/adobe-analytics-implementation/ Adobe Target運用支援:/adobe-target-operation/ 等々…。 よって、URLパスのパターンより各ページの製品群カテゴリを判別する対応が必要です。 これをMapping Tableデータエレメントで対応すると、以下のような例が考えられます。 Default Value:…

Adobe Launchで読了計測を実装してみる

はじめに 記事が読了されているかどうかが気になる、というお話はそれなりに耳にすることがありますので、Adobe Launchにて読了計測を実装してみる例を取り上げてみたいと思います。 Enters Viewport LaunchのEnters Viewportは特定のHTML要素が見えたときにルールを発火させるEVENTです。 これを利用して、読了位置(多くはフッター近辺だと思います)が見えたら読了を計測する、というルールを設定することで読了計測を実現します。 読了計測を行う上で決めること 読了位置を決めることが重要です。 今回の例としてIMPLEMENTDIGITALのコラム記事ページの読了計測をするとして、フッターブロックの「お問い合わせ」のHTML要素が見えたら読了とみなします。 例: ルール例 その他、以下の条件/要件を追加してルールを作ってみます。 「どのコラム記事」が読了されたかは、本例ではページURLやページタイトルを利用するものとし、eVar1〜3にて計測します 読了計測対象のページはIMPLEMENTDIGITALのコラム記事ページのみとする トップページやカテゴリトップページなど他のページでは計測しない 読了数のカウント用にevent50を策定する (専用のカスタムイベントがあると読了数をレポーティングしやすいため) 設定してみたルール例がこちらとなります。 ●EVENTS もちろんEnters Viewportです。 また、読了とみなすHTMLブロックが見えた際に即時かつ最初の1回のみ発火と設定しています。 ●CONDTION ドメインとパスとでIMPLEMENTDIGITALのコラム記事ページのみ対象とするとしました。 ●ACTIONS いつものAdobe Analytics計測の設定です。 Clear Variablesは設定項目がないACTIONのため割愛しております。 Set Variables Send Beacon 読了計測はページビュー数のカウントをさせたくなかったのでs.tlを選び、カスタムリンク計測としました カスタムリンクレポートに「Finish Reading Tracking」という値も計測されるようになるため、読了計測のみを絞り込む際などに活用します。 なお、本例では挙げていませんが、ドメインやサイトセクション、記事カテゴリ、タグなども一緒に計測するとより面白い分析ができるかもしれません。 Implement DigitalではAdobe Launchの導入、運用を支援するサービスを提供しています。 ご興味がありましたらお問い合わせください。

Adobe Launchのデータエレメントタイプ JavaScript Toolsの紹介

はじめに 今回はAdobe Launchのデータエレメントタイプ「JavaScript Tools」を紹介したいと思います。 JavaScript Toolsとは 平たく言ってしまうと、文字列または配列型の値を返すデータエレメントについて、それを調整する機能を持つデータエレメントです。 例:JavaScript Toolsの画面 カスタムコードが主体の運用だとほぼ馴染みが出づらいかもしれません。 ただし、ページのデータレイヤーやJavaScript変数、DOM要素などをよく用いている運用だと、 ちょっとした値の修正 元となる値は既存のデータエレメントで取れている というところで出番もありそうでしたので紹介してみたいと思います。 主な機能の紹介 本ページ作成時点では12種類ほどありますが、そのうち利用場面が多そうなものに絞って取り上げてみたいと思います。 ・Simple Replace 所定の文字列を別の文字列に置換します。  例えば、誤った綴りのデータを正しいものに書き換える、といった利用方法が考えられます。 例:SpecailContentsPageをSpecialContentsPageに書き換える ・Regex Replace こちらは正規表現での文字列置換を設定できます。 以下の例は「article:published_time」(値の例:2023-03-15T03:10:23+00:00)より太字の時刻部分を抜き出す例となります。 ただし、注意点として、本コラム作成時点では、Replacement Valueが未指定だと空文字ではなくundefinedという文字列に置換されているようです。 空文字へ置換したい場合には以下のような工夫が必要となります。 Replacement Valueに空文字を返すデータ要素を指定する 実は本例のスクリーンショットでは、わかりづらいのですが、Replacement Valueに半角スペースを設定しています。 本例のように前後の不要な文字列を削除したいケースだと、不要文字列をまず半角スペースに置換し、さらにそれをClean text設定で削除するというやり方です。 関連の設定は以下になります。 ①Replacement Expressionで取り出す文字列の前後を示す正規表現を入力 ②Replacement Valueに半角スペースを設定 ③左のClean textをチェックONとする(チェックONだと文字列の前後の空白文字を削除します) 順を追った形では以下となります。「」は値の変化がわかりやすくなるため付与しています ①で取り出したい文字列以外の前後(不要箇所:赤字)を特定 「2023-03-15T03:10:23+00:00」 ②で①を半角スペースに置換 「 03:10:23 」 ③で②で得られた値の前後のスペースを削除 「 03:10:23 」 ・Extract Value with…

Adobe Launch Runtime Environmentデータエレメントの紹介

はじめに 以前、以下の記事を書いていました。 💡 Adobe Analyticsの計測調査のために役立つ計測項目 https://www.implementdigital.com/column/adobe-experience-cloud/useful-measurement-items-for-adobe-analytics-measurement-studies/ この記事では以下の2項目も取り上げていますが、従来だとJavascriptコードでの実装対応が必要でした。 Adobe Launchプロパティ名 Adobe Launchビルド日時 ただし、現在は、Coreエクステンションv3.1.0で追加されたデータエレメントタイプRuntime Environmentで対応ができるため紹介したいと思います。 Runtime Environment Coreエクステンションv3.1.0以降であると、データエレメントの作成・編集画面のData Element TypeにRuntime Environmentも表示されるようになります。 これを選ぶと下図のようにAttributeプルダウンメニューが表示され、Adobe Launch実行環境の情報が参照できるデータエレメントを作成できます。 ※データエレメント作成画面(Coreエクステンションバージョンv3.3.0時点のもの) なお、前出の2項目は以下のAttributeが該当します。 Adobe Launchプロパティ名:Property Name Adobe Launchビルド日時:Library Build Date 例:2023-01-10T09:54:37Z ※上の日時はUTCのため日本時間は+9時間後となります。 他のAttributeもデバッグや込み入った実装に役立つケースもあります。 何らかの出番がありそうでしたら是非お試しください 参考ページ Coreエクステンションのリリースノート: https://experienceleague.adobe.com/docs/experience-platform/tags/extensions/client/core/release-notes.html?lang=en CoreエクステンションのHELP: https://experienceleague.adobe.com/docs/experience-platform/tags/extensions/client/core/overview.html?lang=en Implement DigitalではAdobe Launchの導入、運用を支援するサービスを提供しています。 ご興味がありましたらお問い合わせください。

Adobe Launchで行うクロスドメイントラッキングの実装方法とその留意点

はじめに 今回はAdobe LaunchでappendVisitorIDsToを使ったクロスドメイントラッキングの実装方法とその留意点をご紹介します。 appendVisitorIDsTo を使ったクロスドメイントラッキングの実装方法 複数のドメインをまたいで訪問者を追跡したい場合に、Safariなどのブラウザーではサードパーティーのクッキーがブロックされているため、追跡できない場合があります。 この問題を解決するには、Visitor.appendVisitorIDsTo(“宛先url”)を実装します。 これにより、ブラウザーがサードパーティークッキーをブロックしていても、IDサービスが複数ドメインにわたってサイト訪問者のExperience Cloud IDを共有し、適切に追跡できます。 appendVisitorIDsToは、アドビに訪問者のIDのリクエストを送信するのではなく、元のドメインから宛先ドメインへのURLリダイレクトのクエリーパラメーターとしてmidが追加されます。 <コードサンプル> var o = document.querySelectorAll(‘a[href*=“www.example.com”]‘); for (var i=0; i

YouTube動画の再生数をAdobe LaunchとAdobe Analyticsで計測する方法

ウェブサイトの計測においてページ内に掲載されたYouTube動画の再生数を計測したいケースがあると思います。本記事ではAdobe Launchを利用してYouTube動画の再生開始数、再生完了数をAdobe Analyticsで計測する方法を紹介していきます。 計測仕様 今回紹介する内容は以下の計測仕様を前提としています。 計測タイミング 動画の再生開始時 動画の再生完了時 計測データ 動画のタイトル 動画の再生開始数 動画の再生完了数 計測変数 eVar11 : 動画のタイトル event11 : 再生開始数 event12 : 再生完了数 前提条件 YouTubeプレーヤーの再生開始、再生完了のタイミングを取得するため、IFrame Player APIを利用します。このためYouTubeプレーヤー埋め込みタグのsrc属性に指定するURLにはクエリーパラメーターenablejsapi=1を指定する必要があります。 YouTube IFrame Player API https://developers.google.com/youtube/iframe_api_reference?hl=ja YouTube IFrame API用Ruleの作成 このRuleではページに埋め込まれたYouTubeプレーヤー埋め込みタグ用のプレーヤーオブジェクトの生成と再生開始、再生終了のステータス変更が通知されるイベント関数(onPlayerStateChange)を定義します。そして再生開始、再生完了のタイミングで、この後に設定するDirect Call用のルール(YouTube_Action)を_satellite.track()により実行することで計測を行います。 以下の内容でRule設定を行います。 Name YouTube_IFrame_API EVENTS Core – DOM Ready ACTIONS Core – Custom Code ACTIONSのCore – Custom Codeの設定は以下の通りです。 またCodeの内容は以下の通りです。 //…

動画で学ぶAdobe Analytics入門 – YouTubeチャンネルの紹介

はじめに 今回はAdobe AnalyticsのYouTubeチャンネルをご紹介します。 Adobe Analyticsやデジタルマーケティングをこれから始める方向けの解説動画です。 Adobe Analyticsの基本から応用までを知るにはちょうどよい内容となっていますので、ぜひご活用ください。 Adobe Analytics入門 ▼プレイリスト https://youtube.com/playlist?list=PLP… 「Web解析概要」編 ①Web解析とは https://www.youtube.com/watch?v=HXIE15qdCGI&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=1 ②ビジネスゴールとKBO https://www.youtube.com/watch?v=_enNpRhLuBI&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=2 ③俯瞰分析 https://www.youtube.com/watch?v=y4B4ihRLk18&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=3 ④Adobe Analyticsの特徴 https://www.youtube.com/watch?v=S-0eZwnla_4&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=4 「ワークスペースの基本」編 ①ワークスペースとは https://www.youtube.com/watch?v=f6XljvD1AXY&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=5 ②フリーフォームテーブルの作成 https://www.youtube.com/watch?v=nTjEBalgd4k&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=6 ③視覚化機能 https://www.youtube.com/watch?v=Hw5_ZI1i2Yg&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=7 ④計算指標機能 https://www.youtube.com/watch?v=hGGywqgaYqM&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=8 ⑤日付範囲機能 https://www.youtube.com/watch?v=DXwmuqKt0gE&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=9 ⑥プロジェクトの共有 https://www.youtube.com/watch?v=CjeBnC02Ejg&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=10 「セグメントの基本」編 ①セグメントとは https://www.youtube.com/watch?v=ZNemHgQrNeU&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=11 ②セグメントビルダーの使い方 https://www.youtube.com/watch?v=rJ9KmghgsHc&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=12 ③セグメントの条件と演算子の使い方 https://www.youtube.com/watch?v=7mtLITUYAOM&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=13 ④パネルドロップゾーンについて https://www.youtube.com/watch?v=Hh33uTexOSo&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=14 「Adobe SenseiのAI/ML機能」編 ①異常値検知/貢献度分析/インテリジェントアラート https://www.youtube.com/watch?v=_PAa5c3WDYg&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=15 ②セグメント比較 https://www.youtube.com/watch?v=2vbeQHVrrBw&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=16 ③アトリビューション分析 https://www.youtube.com/watch?v=tlWQ-ei7WkM&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=17 「便利な機能とTips」編 ①クイックインサイトパネル https://www.youtube.com/watch?v=Dtw-U5p1G1M&list=PLPb9pw8z80aG6Nq73HS5KVYPuTI95O24T&index=18 ②モバイルアプリダッシュボード…