WordPressサイトにグーグルタグマネージャー（GTM）を連携させ、各タグを一元管理してみる

グーグルタグマネージャー、略してGTMを使っていますか？

相変わらずグーグルのプロダクトは多機能なので、無料ですし、使いこなせれば大変便利な訳ですが、その反面非常に取っつき辛いのですよね..。

こちらでは実際に使う目的を踏まえて、GTMの使い方を整理してみたいと思います。

そもそもタグマネージャーとは？

ウェブサイトを作成したらアクセス解析をしたかったり、ウェブ広告を貼り込んだりしたくなりますよね？
それらを実現させる為にはウェブサイトの中にそれぞれのタグを貼り込んだりしなければならないのですが、そもそもそれが非常に難解で面倒な訳です。

それぞれのタグ自体がアップデートされた場合どこに書いたのかを探し出し、そのタグを間違えない様にアップデートしなければなりません。
更に都度都度折角書き込んだとしても、Wordpressのテーマを更新したりしてしまったら全て吹っ飛んでしまいますので、また一からのやり直しとなってしまいます。

また外部と連携させるタグを沢山貼り込んでしまうと、読み込み速度の低下の原因にもなってしまいます。

それらを一元管理して効率化してくれるのがタグマネージャーと言うツールなのです。

タグマネージャーは色々在るようですが、無料で十分過ぎる程多機能なので、グーグルタグマネージャー（GTM）とYahoo!タグマネージャーの２つを覚えておけば十分かと思います。

しかしながらYahoo!タグマネージャーは対応タグが多いと言う優位点があるものの、Yahoo!プロモーション広告（スポンサードサーチ、YDN）を使用していない場合は無料で使用する事が出来ません。

その様に考えるとやはり取り敢えず学ぶべきなのではグーグルタグマネージャー（GTM）の一択と考えて良いと思います。

GTM↔Wordpressの設定

実際にはGTMの中身を設定しなければ具体的には何も起こらないのですが、ここではその前の段階のGTMとWordpressを連携付けるところまでの流れを説明します。

GTMの設定

GTMには先ずコンテナと言う入れ物が有り、その中にタグやトリガーや変数が詰め込まれる感じとなります。

” ◯◯の時に△△する ” と言う感じの命令になり、◯◯の時と言うタイミングを指定するのがトリガーで、△△すると言う内容が記されているのがタグとなります。
必ずトリガーとタグはセットで使われる事になります。

コンテナIDの発行

GTMでアカウントの設定→コンテナの設定と進み、任意のコンテナ名を設定し、コンテナの使用場所を ” ウェブ ” と選択して下さい。

ここで言うコンテナは、自サイトのドメイン毎に作成する箱の様なイメージで良いかと思います。
コンテナが作成されたらコンテナIDが発行されます。

タグの作成

タグとは何らかの行動の命令です。

GAにページが見られたと言うアクセス履歴を送信したり、イベントを受けてコンバージョンされたと言うデータを送信したりなどです。

トリガーとは？

トリガーとはタグを動かすタイミングの指定と考えて下さい。

例えば全てのページでタグを動作させるだとか、ボタンが押されるなどのイベントが起きたらタグを動作させるなどの様に連携をさせていきます。

プレビューモード

実際にタグを動かす前に、こちらのプレビューモードで確認する事が出来ます。

プレビューモードにした状態で同じウェブブラウザでタグを埋め込んだページを開くと、そのページにどのタグが埋め込まれていて動作しているのか、埋め込まれているけれども動作していないタグを見る事が出来る様になります。

公開

各設定をしたままだけでは、実際に動作する事は有りません。
公開ボタンを押してようやく、埋め込まれたタグが動作する様になるので注意して下さい。

WordPressにGoogle Tag Manager for WordPressと言うプラグインをインストール

GTMをWordpressと簡単に連携させる一つの方法がプラグインを使用する事です。

こちらではGoogle Tag Manager for WordPressを使用していきます。
プラグインをダウンロード→インストール→有効化したら、設定→Google Tag Managerと移動し、Generalタブ内のGoogle Tag Manager IDと言う所に先程発行されたコンテナIDを入力して保存すれば、WordpressとGTMの連携自体は始まる事になります。

どの様なタグを一元管理したいのか？

グーグルアナリティクスでのアクセス解析

今まではグーグルアナリティクスの為だけに単独のプラグインをインストールしていたり、テーマの設定を使用していたりしました。

グーグルアナリティクスでのContactForm7からのコンバージョン解析

今まではon_sent_ok のフックを使用していましたが、近々に廃止されると言う事で早急な移管を考えざるを得ませんでした。

Yahoo!プロモーション広告のコンバージョン解析

これは今回のGTMが初の試みとなります。

自サイト→GTM→グーグルアナリティクス：アクセス解析

それぞれの具体的説明ですが、先ずは基本となるグーグルアナリティクス（以下、GA）との連携からです。

新しいタグを追加し、 ” GA解析タグ ” など自分がわかり易い任意の名前を付けます。
1. タグの設定から ” Google アナリティクス: ユニバーサルアナリティクス ” を選択し、
  1. トラッキングタイプにはページビューを選択
  2. Googleアナリティクス設定には特に触らず選択しないまま
  3. このタグでオーバーライド設定を有効にするのチェックボックスにチェックを付ける
  4. トラッキングIDにGAの管理画面で確認が出来るUAから始まるIDを入力
    ※未だ設定がされていない場合は、GAの管理からプロパティを作成に進み、サイトのURLなどを入力したらトラッキングIDが発行されます
2. トリガーからAll Pagesを選択します。

新しいタグは設定したら忘れずに公開ボタンを押すのを忘れないで下さい。

これでGAでいつものページビューのトラッキングが出来る様になりました。

自サイト→ContactForm7→GTM→グーグルアナリティクス：コンバージョン計測

これは正直ちょっとややこしいのですが、ContactForm7（以下、CF7）と言うプラグイン経由で受けた問い合わせを、GTM経由でGAに送りコンバージョンとして計測すると言う連携になります。

CF7はボタンが押されると ” cf7submit ” と言うイベントが発生しますので、そちらをトリガーとして利用していきます。

トリガーを新規作成し “CF7トリガー ” など自分がわかり易い任意の名前を付けます。
1. トリガーの設定からフォームの送信を選択し、一部のフォームのラジオボタンを選択、Click Classes・含む・cf7submitと入力します。
タグを新規作成し ” CF7をGAへ送信タグ ” など自分がわかり易い任意の名前を付けます。
1. タグの種類から ” Google アナリティクス: ユニバーサルアナリティクス ” を選択し、
2. トラッキングタイプをイベント、
3. カテゴリをContact Form、アクションをsubmitなど、ラベルや値もGAに送り込みたい様に設定します。（１つ設定していればそれ以外は空白でも可）
4. 非インタラクションヒットは偽、
5. Googleアナリティクス設定は、ユーザー定義変数でトラッキングIDを指定したものを選択
GAの目標設定で、
1. 目標設定はカスタム、
2. 目標の説明
  1. 目標名” CF7コンバージョン ” など自分がわかり易い任意の名前を付けます。
  2. 目標タイプはイベント、
3. 目標の詳細はカテゴリから値まで、先程の設定と同じ（空白なら空白）

これらの設定でCF7の問い合わせボタンがクリックされたら、GAの方でコンバージョンとして計測される様になります。