データ収集におけるHTML属性

最終更新日:

この記事では、Pendoがデフォルトでアナリティクス用に収集するHTML属性と、デフォルトのデータ収集を変更する方法をまとめています。

HTML属性

HTML属性は、フォーム入力値や画像のURLなど、HTML要素に関する追加情報を提供するものです。一般的なHTML属性には、srchrefclassidなどがあります。これらの属性のコンテンツであるCSSセレクターは、ウェブサイトの特定の要素を識別し、スタイルを設定します。Pendoはこれらのセレクターによって、フィーチャーのクリックを識別し、ガイドをターゲティングします。このため、CSSセレクターは静的かつ一意で、安定的である必要があります。

デフォルトで収集されるイベント

アナリティクスに使用するクリックイベントやフォーカスイベントについて、Pendoはデフォルトで特定の属性やプロパティを収集します。

  • <div><p><button>などのクリックされた要素の種類
  • <a><span><div>などの要素内のテキスト
  • 要素のidまたはclass
  • 要素の他の属性(存在する場合)titlehreftabindexなど
  • <button>については、value(ボタンのテキスト)およびnameを収集。
  • <img>については、srcおよびaltを収集。
  • <select>については、typeおよびselectedIndexを収集。
  • <textarea>および<input>については、nameを収集。

プライバシー保護の観点から、ユーザーが入力したテキストを<input><textarea>のフィールド内で収集したり、読み込みイベントでドキュメント<title>を収集したりすることはありません。

クリックされた要素のすべての親要素について同じデータを収集し、HTML階層(またはドキュメントオブジェクトモデル:DOM)を経て、<body>タグまでのデータを収集します。

カスタムHTML属性を追加したり、特定の要素に対してPendoのデータ収集を制限したりすることで、Pendoがクリックイベントやフォーカスイベントで収集するデータを調整することができます。

注: インストールスクリプトを使用するウェブアプリケーションの場合、要素のinnerTextを含むページ上のすべてのテキストがデフォルトで収集されます。この自動テキスト収集は、Pendoサポートに連絡してサブスクリプションレベルでオフにしたり、インストールスクリプトを更新してページレベルでオフにしたりできますが、これを行うとフィーチャーのタグ付けが複雑になる可能性があります。拡張アプリの場合、デフォルトではInnerTextは収集されません。個々の拡張アプリでテキスト収集を有効にするには、Pendoサポートにお問い合わせください。

特定の要素の追跡を除外する

個人を特定できる情報(PII)やその他の機密情報を保護するために、Pendoが収集する属性を制限したい場合があるとします。Pendoに渡される特定の要素からデータを除外するには、以下のいずれかを実行します。

  • Pendoサポートに、該当するHTML属性をアプリケーションのhtmlAttributeBlacklistに追加するよう依頼します。これにより、Pendoは今後のすべてのクリックイベントやフォーカスイベントにおいて、指定した属性を収集しなくなります。
  • .pendo-ignoreクラスをコード内の任意の要素に追加して、Pendoが該当する要素を収集しないようにします。この方法は、Pendoエージェントバージョン2.9以降で機能します。

以下の例は、最初のボタン要素のみを無視するコードです。「決済する(Submit Payment)」というテキストを含むスパンまたは「決済する」ボタン要素自体のクリックは、クリックイベントが選択された要素とその親要素を収集するため、Pendoによって無視されます。つまり、スパンまたは特定のボタンをクリックすると、イベント内の.pendo-ignoreクラスが収集され、そのイベントは無視されます。

<div class="payment">
<button class="pendo-ignore payment-button">
<span>Submit Payment</span>
</button>

<button class="cancel-button">
<span>Cancel</span>
</button>
</div>

以下の例は、div全体を無視するコードです。.pendo-ignoreクラスを両方のボタンの親要素に追加したため、該当するdiv内のどこをクリックしても、Pendoによって無視されます。

<div class="pendo-ignore payment">
<button class="payment-button">
<span>Submit Payment</span>
</button>

<button class="cancel-button">
<span>Cancel</span>
</button>
</div>
この記事は役に立ちましたか?
16人中8人がこの記事が役に立ったと言っています