Clipkit® Support
Clipkitに関する情報・よくあるご質問は
こちらでご確認いただけます。
2022.04.28公開
2022.04.28更新
Clipkit for ECでカートのクリックを計測したい(GTMを使った計測タグの設置方法)
Clipkit for ECでカートのクリックを計測する場合、以下の手順で計測タグを設置する必要があります。 ここではGoogle Tag Manager(GTM)を用いた設定方法をご紹介します。
GTMでClipkit for ECのカートクリックを計測するタグを設置する手順
アカウントを選択しましょう
GTMのトップページにアカウント一覧が表示されています。
今回カートクリックを計測したいアカウントをクリックしましょう。
組み込み変数を追加しましょう
左のメニューから変数を選択します。
組み込み変数の設定画面が表示されますので、設定をクリックすると下の画面が表示されます。
・Click Element
・Click ID
・Click Text
・Click URL
・Page URL
以上の項目にチェックをつけましょう。
ユーザー定義変数を新規作成しましょう - カートボタン編
次にユーザー定義変数を作成します。「新規」をクリックして作成しましょう。
変数タイプを選択して設定を開始します。
変数のタイプをページ要素から【DOM要素】を選択して、以下の設定を進めてください。
選択方法:CSSセレクタ
要素セレクタ:.js-item-shopify__cartin-btn
属性名:data-item-title
ここまで設定できたら、保存を選択し完了です。
※ 要素セレクタ、属性名は、サイトにより変わる可能性があります。
ユーザー定義変数を新規作成しましょう - 今すぐ購入する編
カートボタン編と同じ手順で、「今すぐ購入する」の計測も設定します。
変数のタイプをページ要素から【DOM要素】を選択して、以下の設定を進めてください。
選択方法:CSSセレクタ
要素セレクタ:.js-item-shopify__checkout-btn
属性名:data-item-title
ここまで設定できたら、保存を選択し完了です。
※ 要素セレクタ、属性名は、サイトにより変わる可能性があります。
トリガーを新規作成しましょう - カートボタン編
次に、トリガーを設定します。左のメニューよりトリガーを選択します。
下の画面が表示されますので、新規をクリックしましょう。
トリガーの設定画面に進みますので、鉛筆のマークを選択してください。
トリガーのタイプをクリックから【すべての要素】を選択し、以下の設定をしてください。
トリガーの発生場所:一部のクリック
トリガー配信:以下を選択
・Click Element
・CSSセレクタに一致する
・.js-item-shopify__cartin-btn
ここまで設定できたら、保存をクリックし完了です。
※ 要素セレクタ、属性名は、サイトにより変わる可能性があります。
トリガーを新規作成しましょう - 今すぐ購入する編
カートボタン編と同じ手順で、「今すぐ購入する」の計測も設定します。
トリガーのタイプをクリックから【すべての要素】を選択し、以下の設定をしてください。
トリガーの発生場所:一部のクリック
トリガー配信:以下を選択
・Click Element
・CSSセレクタに一致する
・.js-item-shopify__cartin-btn
ここまで設定できたら、保存をクリックし完了です。
※ 要素セレクタ、属性名は、サイトにより変わる可能性があります。
タグを新規作成しましょう - カートボタン+購入ボタン
新規をクリックして作成します。
以下の通り設定を進めましょう。
タグの接続:ユニバーサルアナリティクス
カテゴリ:カートに入れる(任意の言葉)
アクション:{{Page URL}}
ラベル:{{カートボタン計測}}※1
非インタラクションヒット:真
Googleアナリティクス:GA計測変数※2
トリガー:カートボタン登録※3
ここまで設定できたら保存を選択し、完了です。
※1:変数で作ったカート計測変数
※2:変数で作ったGA計測変数
※3:トリガーで作成したもの
これで設定は完了です。
設定が完了した状態
設定が完了すると、Googleアナリティクス(GA)では、このように計測されます。