イベントを作成する方法

Last Updated 12月 10, 2024

概要

コンソールのイベントページでは、ユーザーは簡単に追跡イベントとエンゲージされたエレメントを作成できます。イベントは、手動で設定する方法（トラッキングされたイベントのみ）と、イベントをキャプチャする方法の2つで作成できます。このセクションでは、イベントを作成するための利用可能なすべての方法を網羅した包括的なステップバイステップガイドを提供しています。

知って使う

Engaged Elements（エンゲージされたエレメント）

エンゲージされたエレメントは、ユーザーのアクションを伴わずに追跡可能な、エディターから公開されたWalkMeコンテンツタイプです。これは、ユーザーセッション中に要素が画面に表示されたか、ユーザーアクション（クリック、ホバー、入力、可視、テキストの変更）によって追跡できることを意味します。

エンゲージされたすべての要素は、WalkMeエディターでキャプチャして作成され、ルールエンジンにアクセスできるため、データの正確さと信頼性が向上します。さらに、エディターでのキャプチャは、データのセキュリティを心配している場合に、セキュリティを追加します。

エンゲージされたエレメントを作成する

イベントページでイベントを作成をクリックします
イベントタイプとしてエンゲージされたエレメントを選択します
システムを選択します
エディタを開くをクリックして、要素のキャプチャを開始します
アイコンを作成をクリックします
追跡する要素をキャプチャする
エレメント名を入力します
追跡するインタラクションタイプを選択します。
1. クリック：ユーザーが定義されたエンゲージされたエレメントをクリックするたびにトリガーされる
2. 入力：ユーザーが入力を変更するたびにトリガーされる
  1. たとえば、テキストフィールドでは、ユーザーがテキスト入力を変更し、定義済みのエンゲージされたエレメントフィールドからフォーカスを外すと、入力イベントがトリガーされる
3. ホバー：ユーザが定義済みのエンゲージされたエレメントで300ミリ秒以上ホバリングするたびにトリガーされる
4. 表示：定義されたエンゲージされたエレメントがページの読み込みやURLの変更ごとに表示されるたびにトリガーされます。イベントが削除され、再度表示されると、イベントが再びトリガーされます
［Save（保存）］をクリックします。
本番環境に公開します
公開されると、コンソールのイベントページの管理タブに戻ります
ページを更新して、イベントリストで新しいエンゲージされた要素を表示します

追跡イベントダッシュボード

追跡イベントは、デジタルエクスペリエンス分析（DXA）を使用して、ユーザーがHTML要素と行う特定のインタラクションを追跡するために分析されるイベントです。

追跡イベントでは、ウェブサイト上のWalkMeアイテムの有無にかかわらず、エンドユーザーがプロセスの完了を追跡できます。 WalkMeの使用前と使用後を追跡することで、WalkMeソリューションの有効性を評価できます。

追跡イベントは、パラメータを定義するか、キャプチャすることで手動で作成できます。

追跡イベントを手動で作成します

イベントページでイベントを作成をクリックします
イベントタイプとして追跡イベントを選択します
手動で作成を選択します
追跡イベントの名前を入力します
システムを選択します
イベントを追跡するデータを選択します。エレメント、コンテンツ、ページの 3 つのオプションがあります。次のステップは、選択したイベントデータオプションによって異なります

エレメント

ウェブページやアプリに表示されるビジュアルコンポーネントです。

エレメントタイプを選択します。これはエレメントに関連するアクションです。

- クリック/タップ：ユーザーがエレメントをクリック/タップしました
- 入力：ユーザーがエレメントフィールドにテキストを入力します
条件ビルダーを使用して、データが有効であるとみなすルールを定義します
1. 以下のオプションから条件を選択します。
  1. ラベル：入力フィールド名でエレメントを識別します
  2. クラス：1つ以上のクラスで入力要素を識別します
  3. ID：一意のエレメント識別子で入力エレメントを識別します
  4. CSSセレクター：以下の展開で詳細を確認します
2. 値を選択または入力します
オプション：ページフィルターを追加して、データセットの小さな部分を追跡します。詳細はこちらをご覧ください。
WalkMeは、定義をDXAデータベースと比較し、一致するデータ定義があるかどうかを判断します
作成をクリック

注

エレメントデータタイプを使用するには、DXA（Digital Experience Analytics）を有効にする必要があります。顧客は、CSMに連絡して、この有料機能を利用できます。

クリックしてCSSセレクターの詳細を確認してください。

CSS セレクターを使用すると、要素の正確な定義を追跡できます。 CSS セレクターを使用すると、ID、クラス、タイプ、属性、属性値などの特性に基づいて HTML 構造内の要素を識別できます。

注：WalkMeで追跡イベントを定義する前に、CSSを使用する方法や、CSSの記述や使用についての基本的な理解をしておくことをお勧めします。

CSSを使用/構築/作成する方法：

要素を右クリックして［Inspect Element（要素の検査）］を選択し、HTMLで要素を見つけます。その要素が画面と開発者パネルで強調表示されます。 CSS セレクターを作成するために、要素固有の特性 (場所、クラス、ID、追加属性など) を特定します。
特定したら、CSS セレクターを作成します。以下は現在サポートされている CSS のサブセットです。
- ID：ハッシュセレクターは、id属性に基づいてエレメントを具体的に定義するために使用されます
  - 構文：#IdName
- クラス：ドットは、クラス属性に基づいてエレメントを具体的に定義するために使用されます
  - 構文：.className
- [attribute='value']：属性セレクターは、HTML属性に基づいて要素を具体的に定義するために使用されます。
  
  デフォルトではクラスおよび ID 属性が収集されています。追加のHTML属性を収集するには、「環境設定 → コレクション有効化セクションで有効にする必要があります。」
  - 構文：
    - 等しい：[attribute=a]
      含む：[attribute*=b]
      aで始まる要素: [attribute^=a]
      Ends with: [attribute$=c]
- タグ名; Synax: 名前
- スペース - エレメント階層：スペースは、エレメント間の階層を定義するために使用されます。例：.className .className
- 上記の組み合わせ
  - Synaxの例：#idName。 className. className

CSSセレクターのテスト：

追跡イベントを定義すると、インサイトは定義にマッチするデータがすでに存在しているかどうかを示すメッセージを表示します。その定義に対してイベントがすでにキャプチャされているかどうかを確認できます。
ウェブサイトでイベントをシミュレートし、リアルタイムで追跡されたことを確認できます。
Sessions Playbackが有効になっている場合、イベントが表示されるセッションを簡単に見ることができます。

ベストプラクティスと制限：

一部のプラットフォームでは、生成された（ダイナミック）属性があります。これらの属性を使用して追跡イベントを作成することはお勧めできません。（関連：Salesforce Lightening、Workday。（Workdayの場合、使用可能な属性は「data-automation-id」です）
シングルページアプリケーション：PageViewタイプのイベントを見逃す場合があります。
iframes：
- ドメインのiframeをクロスさせる：iframeとページがWalkMeを読み込む場合、UBTは両方で個別に有効になります。つまり、iframe外のクラスは iframe内のイベントに登録されません。
- iframe内の要素の追跡イベントを有効にするには、FF: insightsCaptureAllContextsを追加します
長いクラスとIDを回避しながら、追跡イベントを定義します
- 長いクラス（35文字以上）と長いID（40文字以上）は収集されません
- 注：これは個々のクラスにのみ適用され、複数のクラスには適用されません
- 例：[class='btn btn_otherclass button_enable_specific_button superlongclassthatissupposedtobethislongtoreachthelimit]
- クラス「btn btn_otherclass button_enable_specific_button」は収集されますが、クラス「superlongclassthatissupposedtobethislongtoreachthelimit」は収集されません

サポートされているCSS構文：

クラス名: `.className`
ids: `#id`
タグ名: `div`
要素階層: `.className #id`
[attribute='value']
以前の例の組み合わせ：`div.class1.class2 #someId[attributeName=value]

内容

選択したシステム内で作成されたWalkMeアイテムです。

コンテンツタイプを選択します（例：ランチャー、シャウトアウト）
アイテムのドロップダウンから、コンテンツタイプ内の特定のWalkMeアイテムを選択します
アクションドロップダウンからアクションを選択します
- クリック/タップ：ユーザーがWalkMeアイテムをクリック/タップしました
- 入力：ユーザーがWalkMeアイテムフィールドにテキストを入力します
作成をクリック

ページ

ユーザーの訪問を追跡するための特定のウェブページ。

条件ビルダーを使用して、データが有効であるとみなすルールを定義します
1. 以下のオプションから条件を選択します。
  1. URL：特定のウェブページのアドレス
  2. パス：ページが保存されているウェブサイトのサーバー内のファイルまたはディレクトリの場所
  3. ハッシュ：フラグメント識別子としても知られ、リンクされているページ内の特定のセクションを指します
  4. ドメイン：ウェブサイトを識別するURLの主要部分
  5. クエリ：URLの質問マークの後に表示されるテキスト
値を選択または入力します
プラスアイコンをクリックして、追加条件を追加します
WalkMeは、定義をDXAデータベースと比較し、一致するデータ定義があるかどうかを判断します
作成をクリック

注

ページデータタイプを使用するには、ページ収集を有効にする必要があります。これはインサイトクラシック設定で行うことができます。

キャプチャで追跡イベントを作成します

イベントページでイベントを作成をクリックします
イベントタイプとして追跡イベントを選択します
キャプチャで作成を選択します
システムを選択します
URLの宛先を入力します
キャプチャ

注

を開始しますキャプチャを開始するには、WalkMeエディタを開いている必要があります。
追跡する要素をキャプチャする
イベント名を入力します
［Done（完了）］をクリックします。
新しいイベントは、コンソールのイベントページの管理タブのイベントリストに追加されます

技術的なノート

前提条件

エンゲージされたエレメントを使用するには、DeepUIが必要です
完全なDXAは、過去に遡って使用する必要があります
- DXAを完全に満たさないユーザーは、クリック/入力追跡イベントを設定してデータの収集を開始する必要があります。したがって、完全なDXAのないユーザーにはエンゲージされたエレメントを推奨します
そのシステムに基づいたイベントを表示するには、ユーザーがそのシステムにアクセスする必要があります
ページの追跡を使用するには、ページ収集を有効にする必要があります
追跡イベントをキャプチャするには、ユーザーはエディターの最新バージョンを使用する必要があります

制限

「Contains」演算子は、ユーザー名と統合プロパティのフィルターでのみ使用できます
- 「Contains」演算子を使用する場合、読み込み時間が長くなり、より大きなデータセットで失敗する可能性が得られます。絶対に必要な場合のみ使用します
統合フィルターは、統合と同じシステムを持つイベントでのみ使用できます
手動で追跡イベントを設定する場合、ユーザーはORまたはAND演算子のみを使用できますが、一緒にすることはできません

サポート

本番環境のみサポートされています
Workstationシステムとデータはサポートされていません
Mobile Webデータはサポートされていません
アクションボット、クイズ、TeachMeはサポートされていません
インサイトはChromeを公式にのみサポートしています
- 他のブラウザでも動作しますが、バグが発生する可能性があります
追跡イベントを設定する際、現在はis equals演算子のみをサポートしています
- [Contains]、[Does not contain]、[is greater than]、[is less than]、[is in List]、[is not in List]などはサポートされなくなりました。
- これらの古い演算子を使用した既存のイベントは、視覚化でサポートされますが、編集はできません
  - ただし、追跡イベントページの設定ではワイルドカードをサポートしています（例：console.com/insights/*

この記事は役に立ちましたか？

はいいいえ

はい

いいえ

ご意見ありがとうございます！