前から気になっていたGoogleタグマネージャーなんですが、導入しようかといろんなサイトを見るたびに導入の壁は高く、挫折してました。
そろそろ真面目にやってみようかと、あるサイトを参考にしながらGoogleタグマネージャーを導入しました。
この記事では、Googleタグマネージャーなんか良さそうだけと、なかなか導入までに至らない人に参考になる世界一簡単なGoogleタグマネージャーの導入手順をご紹介します。
Googleタグマネージャーのアカウント作成
Googleタグマネージャーのアカウント作成は、Googleタグマネージャーのサイトから作成するのが基本です。そのように説明しているサイトが殆どですが、Googleのサイトにありがちな見た目がコロコロ変わって入り口がわかりにくいのが難点です。
Googleアナリティクスの管理画面からもGoogleタグマネージャーを開くことができます。Googleタグマネージャーを導入しようとしている人は、Googleアナリティクスを導入済みだと思いますので、その方が簡単だとおもいます。
まず、Googleアナリティクスの画面を開きます。
次に、画面の上にある、すべてのアカウント>XXXX すべてのウェブサイトの…というところをクリックします。
Googleのサービスのアイコンが並んでいる部分が見えると思いますので、①のGoogleタグマネージャーのアイコンをクリックします。
次に、②のアカウントのページをクリックします。
そうすると、Googleタグマネージャーのアカウント画面にいきます。
アカウント画面で、アカウントの作成をクリックすれば、Googleタグマネージャーのアカウントの作成画面になります。
そのあとの、アカウント作成の手順は、以下の記事に書かれている通りにやれば大丈夫です。
GoogleタグマネージャーとGoogleアナリティクスの関係
よく見かけるのが、以下のフレーズ。
『Googleタグマネージャーを使えば、Googleアナリティクスは不要になり、Googleタグマネージャーに一本化できます。』
これがとても分かりにくいです。少なくとも以前の私にはわからなかった。
これは、Googleタグマネージャーで『ある設定』を行うことで、Googleアナリティクスのデータ収集コードが不要になり、データ収集コードを張り付けなくても、Googleタグマネージャーでデータ収集して、Googleアナリティクス上でデータを今まで通り確認できるという意味です。
Googleタグマネージャーで内部クリックや外部クリックなどの計測する場合も、その結果の確認はGoogleアナリティクスで行います。
結局、Googleタグマネージャーを導入しても、Googleアナリティクスは不要になりません。
Googleタグマネージャーで内部クリックと外部クリックを観測する
こちらの記事を参考に設定していけば大丈夫です。
少々わかりにくいのが、従来Googleアナリティクスで行っているデータ収集を行う部分をGoogleタグマネージャーでで行う設定が並行して書かれていることです(先に述べた『ある設定』の部分)。
ページビュー用タグ作成
変数とトリガーができたらようやくタグを作成できます。ワークスペース内で作ったすべてのタグが、
1つのタグマネージャをサイトに貼るだけで適応されるわけです。ワークスペース > タグ > 新規
から作成です。
トリガーは今回は「All Pages」です。
どのページでもアクセスした人全てをとりあえずAnalyticsに送り込むために。
最終的には、すべてをGoogleタグマネージャー経由でデータ収集するので書かれている通りに設定すれば問題ありません。
Google タグマネージャーのプラグイン導入
参照記事ではGoogleタグマネージャープラグインを導入しています。
このプラグインは色々便利な機能がありますが、今回の使い方だとGoogleタグマネージャーそのもののタグをWordpreessテーマに設定するためのもので、タグを自力でテーマに設定すれば不要です。
Googleタグマネージャーの設定タグは2つあります。
- <head>内に設定するもの
- <body>の先頭に配置するもの
現時点で、Googleタグマネージャーのプラグインを導入しても設定できるのは前者の<head>内に設定するものだけです。後者の<body>の先頭に配置するタグは、プラグインを導入してもダメで結局は自力で設定することになるのでプラグインを導入する意味はあまりないかもしれません。
<body>の先頭に配置とかかれているタグについては、自分の場合はフッター内に配置しても問題なく動作しました。Wordpressテーマでフッターにタグを設定できる場合はフッターに設定するのが簡単だとおもいます。
Luxeritasの場合
Luxeritasの場合は、body先頭にタグを設置できるようにカスタマイズが用意されているので、そこに書きます。
テーマの機能にフッターにタグを設定する機能がない場合
もし、テーマの機能にフッターにタグを設定する機能がない場合、wordpressのフックwp_footer()を使ってbodyの一番最後に追加すれば同じことができます。それを使ってfunction.phpに記述してもよいかもしれません。
プラグイン使ってる場合
function add_custom_gtm(){
?>
<!--[Google Tag Manager Plugin]>
<?php if ( function_exists( 'gtm4wp_the_gtm_tag' ) ) { gtm4wp_the_gtm_tag(); } ?>
<?php
}
add_action('wp_footer', 'add_custom_gtm');
プラグイン使ってない場合
function add_custom_gtm(){
?>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-??????"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<?php
}
add_action('wp_footer', 'add_custom_gtm');
とりあえず、参考記事の通りにやって、プレビューでタグの発火が確認出来たら設定は終わりです。
Google アナリティクスのデータ収集タグを削除
Googleタグマネージャーで、従来のGoogleアナリティクスのデータ収集も行うように設定しているので、Googleアナリティクスのデータ収集タグを<head>内から削除します。
残っていても、大丈夫そうに思いますが、Googleアナリティクスのデータ収集タグが残っていると、直帰率の分析結果が異常に低くなっておかしくなります。
必ずGoogleアナリティクスのデータ収集タグを<head>内から削除しましょう。
まとめ
Googleタグマネージャーを導入して今回紹介した方法で内部リンククリックや外部リンククリックを計測すると、訪問者がクリックした全てがGoogleアナリティクス上で確認できるようになります。今まで見えていなかった訪問者の行動が見えるようになります。Googleタグマネージャーは便利そうだけど導入の仕方がよくわからないという人も、今回の記事の内容であれば手順通りにやるだけですから、一度導入してみたらよいと思います。