Triggers and rules

トリガーは、ツールがアクションを開始する 条件を定義します。多くの場合、ビジネスに関連する特定のウェブサイトイベントに一致するトリガーを作ることが目的です。トリガーは、ボタンの選択後や特定ページの読み込みなど、ウェブサイトで起きたイベントを基準にできます。

これらのウェブサイトイベントは、いくつかの方法で Cloudflare Zaraz に渡せます。Web API の Track メソッドや、dataLayer 呼び出しを使えます。コードを書いてウェブサイト上のイベントを追跡したくない場合は、クリックリスナーやフォーム送信など、種類の異なるルールで、ブラウザー側のウェブサイトイベントをリッスンするようトリガーを設定できます。

トリガーの構成は、選ぶルールの種類によって変わります。

Zaraz は、Variable name に入力した変数を、Match string のテキストと照合します。対応する変数の一覧は、Properties reference を参照してください。

トリガーの例: zaraz.track("purchase") に一致

Page Properties、Cookies、Device Properties、Miscellaneous カテゴリの変数を使う Match rule でトリガーを作る場合は、多くの場合 Pageview に一致する 2 つ目のルールを追加します。そうしないと、このページで起きるほかのイベントでもトリガーが有効になります。トリガーに複数の条件を追加する方法は、トリガーを作成する を参照してください。

トリガーの例: /blog 配下のすべてのページ

トリガーの例: ログイン済みのすべてのユーザー

Match rule で使える変数の詳細は、Properties reference を参照してください。

ウェブページ上のクリックを追跡します。クリックリスナーは、CSS セレクターまたは XPath 式で設定できます。Wait for actions（ミリ秒）は、指定した時間だけページの遷移を遅らせるよう Zaraz に指示します。クリックリスナーが起動したリクエストが、すべて宛先に届くようにします。

CSS セレクターのトリガー例:

クリックリスナーを特定の URL に限定すると、ウェブページのパフォーマンスを改善できます。Match rule と組み合わせます。たとえば、特定ページのボタンクリックを追跡するには、トリガーに次のルールを設定します。

CSS セレクターで要素のリンクを追跡する必要がある場合（クリック可能なボタンなど）は、<a> タグの href 属性にリスナーを作成します。

トリガーに複数のルールを追加する方法は、トリガーを作成する を参照してください。

XPath のトリガー例:

CSS セレクターが画面上に表示されたときに、アクションを起動します。

ユーザーがあらかじめ決めたピクセル量をスクロールしたときに、アクションを起動します。固定ピクセル数、または画面に対する割合を指定できます。

ピクセルの例

画面に対する割合の例

CSS セレクターでフォーム送信を追跡します。Validate トグルをオンにすると、バリデーションエラーがない場合だけトリガーが発火します。

トリガーの例:

フォーム送信トリガーを特定の URL に限定すると、ウェブページのパフォーマンスを改善できます。Match rule と組み合わせます。たとえば、特定ページのフォームを追跡するには、トリガーに次のルールを設定します。

トリガーに複数の条件を追加する方法は、トリガーを作成する を参照してください。

各 Interval のあとにトリガーを発火するタイマーを設定します。間隔はミリ秒で指定します。Limit には、間隔を何回実行してトリガーを発火するかを指定します。上限を指定しないと、ページが表示されているあいだタイマーは繰り返します。

トリガーの例:

上記の Timer は、5 秒後に 1 回だけ発火します。Timer トリガーを特定の URL に限定すると、ウェブページのパフォーマンスを改善できます。Match rule と組み合わせます。たとえば、特定ページでタイマーを設定するには、トリガーに次のルールを設定します。

トリガーに複数の条件を追加する方法は、トリガーを作成する を参照してください。