お知らせ：当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

たとえば、Webサイトに問い合わせフォームがあり、フォームが正常に送信されても、訪問者が専用の確認ページに移動しない場合を考えてみます。この場合、ボタンのクリックだけでなく、このフォームの送信成功を追跡するために、PageSenseでカスタムイベントを設定できます。また、サイトに複数の手順で構成されたユーザー登録フォームがあり、ユーザーが各手順を進めてもページのURLが変更されない場合を考えてみます。この場合、フォームが正常に送信されたかどうかを追跡するカスタムイベントを設定できます。

GTMを使用してZoho PageSenseと連携している場合、GTMで個別のタグとトリガー条件を設定することで、Webサイト上のさまざまなPageSenseカスタムイベントやユーザー操作を簡単に追加して追跡できます。GTMで特定のカスタムイベントタグがトリガーされるたびに、対応するPageSenseカスタムイベントが実行され、テストレポートにコンバージョンの成功が記録されます。

カスタムイベントが実行されるすべてのWebページに、PageSenseの追跡用コードスニペットを追加してください。

GTMにPageSenseのカスタムイベントのコードを追加するには。

2. ［無題の変数］欄に、追跡するカスタムイベントに関連するタグ名を入力します。

たとえば、ショッピングサイトで、訪問者が商品をカートに追加しても専用の確認ページや購入手続きページに移動しない場合に、［カートに追加］ボタンのクリックを追跡するとします。この場合、タグ名を「カートに追加 - PageSenseカスタムイベント」とします。

</script>
 

</script>


5. ［トリガー］アイコンをクリックし、用途に適したトリガーの種類を選択します。タグの実行に使用できる既定のトリガーは14種類あります。また、GTMではこれらのトリガーを組み合わせることで、強力な制御と詳細な実行条件を設定できます。



次に、トリガーの種類を選択する方法について、2つの例を確認します。

例01：シングルページアプリケーションでのボタンクリックの追跡

前述の例をもう一度確認します。ショッピングサイトに［カートに追加］ボタンがあり、このCTAをクリックすると、商品がカートに追加された後にオーバーレイのポップアップが開くか、画面上にメッセージが表示されるとします。購入手続きページや確認ページのURLには移動しないため、このボタンが正常にクリックされた回数を確認する必要があります。

この場合、以下のように、トリガーの種類として［すべての要素］を選択し、ショッピングサイトの［カートに追加］ボタンで発生したコンバージョン数を追跡できます。

1. 画面右上のプラスアイコン（+）をクリックし、トリガーの名前を入力して、トリガーの種類として［すべての要素］を選択します。
   
   
   
2. 特定のクリックを追跡するようすでに設定しているため、［一部のクリック］を選択し、条件と定義を次のように指定します。［クリックされた要素］→［CSSセレクターに一致］→要素のセレクターをコピーして貼り付けます。
   
   
   
   Webページから要素のセレクターをコピーするには、追跡するCTA要素を右クリックし、［検証］を選択します。強調表示されたコードをもう一度右クリックし、［セレクターをコピー］を選択して、図のように値の欄へ貼り付けます。
   
   
   これで、訪問者がWebサイトの［カートに追加］ボタンをクリックすると、GTMで設定したカスタムイベントタグによって、PageSenseのクリックイベント目標がトリガーされます。これにより、サイトを訪問した訪問者の合計数と、このCTAを正常にクリックした訪問者の割合（%）がPageSenseのテストレポートに記録されます。
   
   さらに、レポートでは、さまざまなオーディエンス条件や、サイズ、色、商品モデルなど、カート内の商品の種類に基づいてデータをフィルター処理し、セグメント化できます。GTMの［クリックされた要素］というトリガーの種類を使用すると、カートからの商品削除、欲しいものリストへの商品追加、商品の返品や交換など、ECストアでのその他の重要なユーザー行動も追跡できます。

同様に、GTMで［クリック - すべての要素］というトリガーの種類を使用してカスタムファネルイベントを実装し、コンバージョンプロセスの各段階を完了した訪問者数を追跡できます。

たとえば、ショッピングサイトに購入者ジャーニーのファネルがあり、見込み客が購入を完了するまでに、ホームページ→商品ページ→カートページ→決済ページの4段階を進む必要があるとします。ここで、商品の購入に成功しても「ありがとうございます」ページや確認ページのURLには移動せず、同じURL上にお礼のポップアップメッセージが表示される決済ボタンのクリックを追跡するとします。

この場合、以下の図のように、ショッピングサイトの［決済］ボタンにカスタムクリックイベントトリガーを設定して、ファネルの完了を追跡できます。また、各ボタンをクリックしたときに有効になるトリガーを、ファネルの手順ごとに作成することもできます。

例02：固有の確認ページや「ありがとうございます」ページのURLがないフォーム送信の追跡（データレイヤーイベントを使用）。

Webサイトに［お問い合わせ］フォームがあり、訪問者がフォームを正常に送信しても、固有の確認ページや「ありがとうございます」メッセージのページに移動しないとします。ここで、フォームに入力した訪問者による実際の送信数と離脱率を追跡するとします。

この場合、以下の説明に従って、［カスタムイベント］をトリガーの種類として選択し、お問い合わせフォームの正常な送信を追跡できます。

1. 画面右上のプラスアイコン（+）をクリックし、トリガーの種類として［カスタムイベント］を選択します。
   
   
   
2. ［イベント名］欄にフォームイベントの名前（例：お問い合わせフォームの場合は「contactFormSubmission」）を入力し、［すべてのカスタムイベント］を選択します。
   
   
   

さらに、Webサイトの［お問い合わせ］フォームにある［送信］ボタンのPOST成功関数に、以下で強調表示されているコードを追加する必要があります。

以下は、Webサイトの［お問い合わせ］ページにある［送信］ボタンの成功関数に表示されるコードの例です。このコードをサイトに追加するときは、［GTMでのトリガーの設定］で指定したものと同じイベント名を入力してください（例：'Event': 'contactFormSubmission'）。

<script>

function submitForm() {

var xhttp = new XMLHttpRequest();

xhttp.onreadystatechange = function() {

     window.dataLayer.push
({

'event':''contactFormSubmission''

 });

}

};

xhttp.open('GET', '/', true);

xhttp.send();

}

</script>

6. タグとトリガー条件の設定が完了したら、右上の［保存］をクリックします。

7. 次に、右上の［送信］ボタンをクリックし、変更内容のバージョン名と説明を入力します。

実際に公開する前に、［プレビュー］ボタンをクリックして、タグに基本的なエラーがないか確認し、指定したクリック時にタグが実行されることを検証することもできます。
8. 最後に、［公開］をクリックします。これにより、タグが公開され、テストページでカスタムイベントのコードが実行されます。