GA4でバナークリック数をカウントする
参考ページ)
https://www.northdetail.co.jp/blog/2596/
作業の流れ。参考ページとは作業順番を変える。
(1)GA4管理画面でカスタムイベントを作成する
(2)GA4管理画面でカスタムディメンションを作成する
(3)GA4管理画面新しいディメンションを集計項目に追加する
(4)HTML内のバナーのリンクタグ(aタグ)に、onclickイベントを追加する
以下詳しく。
(1)GA4管理画面でカスタムイベントを作成する
メニューのイベントから、イベントを作成をクリック。
作成をクリック
カスタムイベント名:
自分がわかりやすい名前をつける。今回はお問い合わせバナーのクリック数をカウントしたいので 「bnr_お問い合わせ」とした。パラメータ条件の「値」も同じものにしておく。
パラメータ:
これも任意の名前で良いが、event_bnr_clickとする。
ここで設定した、パラメータ名と値は、後でHTMLのaタグに onclickとして書くのに使う。
複数のバナーを計測したいときは、同じようにイベントを作成しておく。
カスタムイベントが作成された。
(2)GA4管理画面でカスタムディメンションを作成する
メニューのカスタム定義から、カスタムディメンションを作成をクリック。
ディメンション名とイベントパラメータは、先程カスタムイベント作成でパラメータ名に指定したものと同じものを指定。
今回は event_bnr_click とする。
カスタムディメンションが作成された。
(3)GA4管理画面新しいディメンションを集計項目に追加する
探索のメニューから自由形式を選ぶ。
ディメンションの横の「+」をクリックする。
カスタムのカテゴリの中に、先程作成したカスタムディメンジョンの名前、今回はevent_bnr_click が表示されているので、チェックをして、インポートする。
ディメンションの中に追加されたものを、「行」の方へドラッグ&ドロップすると、コピーされたような状態になる。
これで完了。
(4)HTML内のバナーのリンクタグ(aタグ)に、onclickイベントを追加する
onclick="gtag('event', 'click', {'event_category': 'links','パラメータ名': 'パラメータ値'});"
パラメータ名とパラメータ値は、(1)のカスタムイベント作成で自分がつけた名前をつける。
実際のaタグ。
<a href="/contact/"><img src="画像パス" alt="お問い合わせ" onclick="gtag('event', 'click', {'event_category': 'links','event_bnr_click': 'bnr_お問い合わせ'});"></a>