この記事は約 3 分で読めます。
外部サイトに誘導するボタンやリンクをクリックしたり、スマホから電話番号をタップして電話をした場合、Googleアナリティクスで計測することができます。
個人的な備忘録を兼ねて、こちらにご紹介します。
Googleアナリティクスを既に登録済。
トラッキングコードが「グローバルアナリティクス」になっていること。
この記事の目次
- Googleアナリティクスの設定
- サイトに挿入するタグ
- 実装テスト
Googleアナリティクスの設定
Googleアナリティクスのトラッキングコードを確認します。
このトラッキングコードの冒頭が以下のようになっていればOKです。
1 |
<!-- Global site tag (gtag.js) - Google Analytics --> |
目標設定
Googleアナリティクスで、「管理」→「目標」を開きます。
「新しい目標」という赤いボタンをクリックします。
「カスタム」を選択します。
※【追記】ここの部分の画面がなくなっている可能性もあります。その場合は、飛ばして次を設定してください。
「目標」の「名前」に入力します。(例は「電話」)
「イベント」にチェックを入れて、「続行」ボタンをクイック。
「カテゴリ」「アクション」「ラベル」に入力します。
(例は、「カテゴリ:contact」「アクション:tel」「ラベル:label」)
「保存」ボタンを押して、Googleアナリティクスでの設定は完了。
入力した箇所の名前は自由です。複数設定するときは、ネーミングを変更してくださいね。
サイトに挿入するタグ
「ボタンやURL」をクリックしたパターンと、電話番号をタップして電話するパターンの計測タグをご紹介します。
ボタンクリックを計測
ボタンやURLをクイックした場合、計測するタグです。
1 2 |
//Googleアナリティクスで入力した「イベント」を「click1」としています。 <a href="https://resound-weblab.com/" onclick="gtag('event', 'click1', {'event_category': 'linkclick','event_label': 'label'});">ここをクリック</a> |
電話番号タップを計測
記述は以下を参考にしてください。
上のタグは、Goolgeアナリティクスで入力する部分を「日本語の言葉」で入れています。
下のタグは、Googleアナリティクスで入力した言葉が同じなら、コピーして電話番号を変えるだけで使えます。
1 2 |
//電話の計測タグパターン <a href="tel:09012345678" onclick="gtag('event', 'アクション名', {'event_category': 'カテゴリ名','event_label': 'ラベル名'});">ここにリンクしたい文字や画像</a> |
1 2 |
//以下のコードは、電話番号のテキストを入れたものです。 <a href="tel:09012345679" onclick="gtag('event', 'tel', {'event_category': 'contact','event_label': 'label'});">Tel.090-1234-5679></a> |
実装テスト
Googleアナリティクスで登録が終わって、タグを挿入した後に、テストをしてみます。
以下の画像は、リンクをクリックした場合です。
実際にWeb上でリンクをクリックしたり、電話してみたりしてテストをします。
「リアルタイム」→「イベント」もしくは「コンバージョン」で、Googleアナリティクスで計測できるか試してみます。
ちゃんと計測できたら、完了です。
Webサイトやブログで、どうなったらゴールなのか設定するときに、今回の電話やボタンクリックなどを1つの指標にすることはよくあります。
そんなときに、今回の方法も役立つかもしれません。