246blog

2nd Life from46

「Googleアナリティクス」を「Googleタグマネージャー」を介して利用する

 いよいよ当ブログもWeb解析ツールである「Googleアナリティクス」を利用しようと思います。本記事では、「はてなブログ」で「Googleアナリティクス」を「Googleタグマネージャー」を介して利用する一連の準備を記録しておきたいと思います。

Googleアナリティクス」で出来ること

 「Googleアナリティクス」は、ブログの閲覧数、訪問者数、訪問者の属性(アクセス地域や性別、年齢等)、ブログへの訪問経路、サイト内の閲覧ページ等のWebにまつわる情報を解析可能なツールです。

 当面は、アクセス数、訪問者数、アクセス地域、どこのサイトから来ているか、といった辺りを把握出来ると面白いんじゃないかな、とポップに考えています。

Googleタグマネージャー」を介して実施する

 利用するにあたっては、「Googleタグマネージャー」を介して「はてなブログ」へコードを登録することで、ブログの各ページにHTMLを編集したり埋め込むことなく設定するやり方を取りたいと思います(イメージは下図)。

今回実施することのイメージ図

Googleアナリティクス」の「測定ID」を生成する

 それでは、始めていきましょう。まずは、「Googleアナリティクス」の利用登録をして、「測定ID」を生成するところまで実施します。

 なお、「Googleアナリティクス」には、従来から提供されている「ユニバーサルアナリティクス(UA)」と2020年10月から提供されている「Googleアナリティクス4プロパティ(GA4)」と2種類ありますが、2023年7月1日をもって、「UA」は処理を停止するとのことなので、以下は「GA4」に絞って記載します。

 「Googleアナリティクス」へアクセスし、「無料で利用する」をクリック。

Googleアナリティクス」

 アカウント設定画面にて、任意のアカウント名を登録します(ブログ名でいいかと思います)。

アカウント設定画面(Googleアナリティクス)

 アカウントのデータ共有設定の項目は、Googleがデフォルトでチェックしてある通りもしくは全項目チェックで問題ないかと思います。

アカウントのデータ共有設定の項目画面(Googleアナリティクス)

 プロパティの設定画面では、プロパティ名(ここもブログ名でいいかと思います)、タイムゾーン、通貨を設定します。

プロパティの設定画面(Googleアナリティクス)

 Google アナリティクス利用規約に同意し、利用登録が完了します。データストリーム設定画面に遷移しますので、プラットフォーム「ウェブ」を選択します。

データストリーム設定画面(Googleアナリティクス)

 ブログのURLとブログ名を入力してストリームを作成します。

ウェブストリーム設定画面(Googleアナリティクス)

 「測定ID」が生成されました。この「Googleアナリティクス」の「測定ID」を「Googleタグマネージャー」へ埋め込みます。

「測定ID」生成画面(Googleアナリティクス)

Googleタグマネージャー」で「コンテナID」を生成する

 次に「Googleタグマネージャー」の利用登録をして、上記で作成した「Googleアナリティクス」の「測定ID」と連携させたコンテナIDを生成します。

 「Googleタグマネージャー」へアクセスし、「無料で利用する」をクリック。

Googleタグマネージャー」

 アカウント作成画面に遷移するので、「アカウントを作成」をクリック。

 新しいアカウントの追加画面にて、アカウント名(ブログ名でいいかと思います)を入力、国を選択し、「Google や他の人と匿名でデータを共有」のチェックボックスにチェックを入れます。

 下段のコンテナ名にはブログのURLの「https://」の部分を省略して入力し、ターゲット プラットフォーム欄はウェブを選択の上、「作成」をクリック。

新しいアカウントの追加画面(Googleタグマネージャー)

 Googleタグマネージャー利用規約に同意すると、Googleタグマネージャーをインストールというウィンドウが表示されますが、HTMLの貼り付けは実施しないので、このウィンドウを閉じます。

Googleタグマネージャーインストールウィンドウ(Googleタグマネージャー)

 Googleタグマネージャーの利用登録が済んでサマリー画面が表示されます。上段にGTM-から始まるコンテナIDが生成されています。

 「新しいタグ」をクリックして「Googleアナリティクス」のタグ設定をしていきます。

サマリー画面(Googleタグマネージャー)

 「タグの設定」をクリックして「タグタイプ選択」画面で「Googleアナリティクス: GA4設定」を選択します。

タグタイプ選択画面(Googleタグマネージャー)

 さき程生成した「Googleアナリティクス」の「測定ID」をここで入力して、下段の「トリガー」をクリックしてトリガーを設定します。

タグの設定画面(Googleタグマネージャー)

 トリガー選択画面では、「All Pages」を選択し、保存します。タグ名が聞かれるのでデフォルトで表示された「Google アナリティクス GA4 設定」で保存します。

 

トリガーの選択画面(Googleタグマネージャー)

 サマリー画面に戻りますので、右上の「公開」をクリックし作成したタグを運用させます。「送信設定」画面では、バージョン名等は何をしたか分かりやすいように入力しておく方が良いと思います。最後に再度右上の「公開」をクリックです。公開完了(バージョンの概要)の画面に遷移します。

送信設定画面(Googleタグマネージャー)

はてなブログ」へ「Googleタグマネージャー」を連携させる

 さて、ここまでで、「Googleアナリティクス」と「Googleタグマネージャー」を連携させてきましたので、最後の作業、「はてなブログ」へ「Googleタグマネージャー」のコンテナIDを埋め込みます。

 はてなブログの「設定」「詳細設定」画面の解析ツールの項目に、「Googleタグマネージャー」の欄がありますので、先ほどの「Googleタグマネージャー」のコンテナIDを入力して「変更する」をクリックします。

詳細設定画面(はてなブログ

 以上で全工程が完了です。Web解析ツールが始動しています。「Googleアナリティクス」のホーム画面でユーザ数(アクセス数)を確認してみましょう。