GA4とGTMをブログに導入してみた

投稿日: 2025-09-01
更新日: 2025-10-07

こんにちは、webディレクターの渡邉です。ブログ開設にあたりGTMとGA4を導入しましたので、その導入についてまとめてみましたので参考にしていただけたら幸いです。

1. はじめに

Webディレクターとして成長するために、これまで触れる機会の少なかった GA4（Google アナリティクス 4） や GTM（Google タグマネージャー） を学んでみることにしました。まずは自分のブログに導入し、実践しながら基礎を理解していきたいと思います。

2. GA4とGTMの導入手順

（1） GA4プロパティの作成

Googleアナリティクスの管理画面から新しいプロパティを作成。ウェブサイトの情報を入力すると 計測ID（G-XXXXXXXXXX） が発行されます。

（2） GTMコードの設置

Googleタグマネージャーで発行された2つのコードを <head> と <body> 直下に貼り付けます。

<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
<!-- End Google Tag Manager -->

<!-- Google Tag Manager (noscript) -->
<noscript>
<iframe> src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX" 
height="0" width="0" style="display: none; visibility: hidden"><iframe>
<noscript>
<!-- End Google Tag Manager (noscript) -->

（3） GA4タグの設定

GTM管理画面で「新しいタグ」を作成し、タグタイプに「GA4設定」を選択。計測IDを入力し、トリガーを「All Pages」に設定します。最後に公開するとGA4で計測が開始されます。

3. 実際にやってみて気づいたこと

データが反映された瞬間に「本当に計測できている」と実感できた。
GTMを使えばクリック計測やスクロール率などのイベントを簡単に追加できる。
コードを直接編集せずに済むので、運用・管理が楽になる。

4. 今後の活用について

記事数が増えたら「どのページが読まれているか」「どの流入経路が多いか」を分析し、Webディレクターとしての業務にも活かしていきたいと思います。

5. まとめ

GA4とGTMの導入は思ったよりシンプルでした。ブログを始める方は、アクセス解析を早めに設定しておくと後の改善に役立ちます。初心者の方にもおすすめです。