baserCMS5 でアクセス解析 / GTMタグを埋め込んでみる

はじめに

basercms5 では、管理画面からGTM（Google Tag Manager）の埋め込み設定をすることができます。
自分でサイト作ったらGTMでアクセス解析してみたいなと思いつつ使ったことはなかったので、その概要調査と設定方法を備忘録としてまとめていきます。

GTMって？

Googleが提供する各種サイト計測ツールを一元管理できるツールのことです。無料で使うことができます。

従来、広告分析やGoogleアナリティクス（GA4）など使いたい計測ツールごとにタグを用意しHTMLに埋め込む必要があり、設定にはそこそこ手間がかかってしまいます、
しかしGTMを使うと、GTMのタグ1つを埋め込むだけで複数のツールをまとめて設定することができるようになります。
GTMタグを入り口として各種ツールの設定を振り分けるイメージですかね。


今回はGTM埋め込みのお試しとして、GA4を設定したGTMタグをbaserCMS5 で埋め込んでみることにしました。

GTMの準備

GTM用のアカウントを作成します。
Googleアカウントにログインした状態で以下URLへアクセスします。
・https://tagmanager.google.com/

「アカウントを作成」をクリックして、必要な情報を入力していきます。
ちなみにアカウントとコンテナは以下のようなものです。

• アカウント：コンテナを管理するための大枠。１アカウントで複数コンテナを管理できる
• コンテナ：GTMを設定するWEBサイト。１ドメイン１コンテナで管理することが多い

アカウントとコンテナの名前は任意のわかりやすものでOKです（自分のサイト名など）

利用規約についての確認が出るので、問題なければ同意にチェックを入れて次へ進めば初期設定完了です。

その後、GTMの埋め込みタグが表示されるかと思います。
後ほどこの2つのタグをbaserCMSで管理するWEBページへ埋め込む設定をしますので控えておいてください。

GA4の設定

まずはGTMと同様に以下URLからGA4用のアカウントを作成します。
・https://analytics.google.com/

アカウントの作成が完了したら、GA4の管理画面にアクセスし「データ ストリーム」から先ほど追加したサイトを選択します。

ウィンドウを開いたら「測定ID」の項目を控えておきます。このIDをGTMとの連携に使います。


GTMの管理画面に戻り、「タグ」タブから「新規」を選択します。


わかりやすいタグ名を入力して、「タグの設定」から「Goolge アナリティクス」をクリックします。


先ほど控えた測定IDを入力して保存します。

baserCMSの準備

ここまでで計測の準備は整いました。
実際に計測する前に「プレビュー」という機能で動作確認をしておきます。
動作確認のためにはGTMタグを公開しているWEBページに埋め込んでおく必要があるようなので、先にbaserCMSの管理画面から設定しておきます。

設定 > システム基本設定 > 外部サービス設定 からヘッダー・フッター埋め込みスクリプトに先ほどGTMで発行したスクリプトをそれぞれ入力して保存します。


ここに記述したスクリプトがGTMタグとして、baerCMSで管理しているWEBページに反映されます。（基本的に全てのページ）
本来なら全てのHTMLページに手作業で埋め込む必要があるので、とてもお手軽ですね。

※ これらのスクリプトの出力には以下の2つのスクリプトが正しい場所に組み込まれている必要があります。自作のテーマを使っている場合は公式ドキュメントを参考に組み込んでください。
 

	
$this->BcBaser->scripts()
$this->BcBaser->func()
	

試しにいくつかページを開いて、それぞれのタグが埋め込まれていることを確認してみます。
ブラウザの開発者ツールなどを使うと簡単に確認できます。

プレビューでの動作確認

GTMの管理画面右上の「プレビュー」をクリックし、

プレビューモードのWebサイトのURLにGTMタグを設置したサイトのURLを入力して「リンク」をクリックします。

「Tag Assistant」への接続が成功し、「Tag Assistant」ウィンドウに計測結果が表示されていれば動作確認は問題ありません。
画面遷移やスクロールなどの操作を試し、数値が更新されることを確認してください。

GTMの公開

プレビューで問題なければ、プレビューの右の「公開」から計測設定を反映し計測を開始します。
計測結果は48時間程度たたないと更新されないみたいなので、反映されるまでは気長に待ちましょう。

計測結果はGoogleアナリティクスの管理画面から確認できます。

さいごに

baerCMSとGTM・GA4を連携してアクセス解析をする準備手順についてまとめました。
初めてで手探りな部分も多いですが、各ツールの設定はスムーズにすることができました。

実際にデータをある程度計測できたら、どんな属性がとれるのかなど確認して、分析の方法を調べてみたいです。


おわり