7
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Googleタグマネージャーを環境ごとに切り替える

Posted at

動機、背景

業務で運用しているWebアプリケーションではGoogleタグマネージャーを使いトラッキングタグを管理しています。
これまでトラッキングタグは依頼を受けて開発チームが実装していたこともあり、現在もアプリケーション中にハードコーディングされているものがあります。
今回、運用の効率化とビジネス側の要求にスピーディに対応するために、トラッキングタグをGoogleタグマネージャーに移行しようと考えましたが、以下の課題がありました。

  • 本番公開前にタグの確認および回帰テストをしていないものがあり、本番環境でバグが発覚した。
  • テストのためにサブドメインをトリガーに設定したものが乱立し、どのタグがテストできているのか分からない。
  • 複雑さが心理的ハードルとなり、移行がなかなか進まない。

そこで、Googleタグマネージャーの「環境」という機能を使い、テスト環境で全てのタグがテストできるようにしました。

Googleタグマネージャーとは

Webビーコン型の計測ツールなど、HTMLにコード片を埋め込むことで機能するサービスがありますが、それらのコード片を管理することができるGoogleのサービスです。

タグに関する概念

項目 内容
タグ HTMLに埋め込みたいコード片。
トリガー タグを表示する条件やタイミングの設定。
変数 特定のHTMLの要素やURL等の変数。タグやトリガーに利用できる。

公開に関する概念

項目 内容
ワークスペース 作業スペース。作業中の変更を保持しておくことができる。
バージョン ワークスペースの変更履歴。タグを公開する時にはバージョンを作成して公開する。
環境 バージョンを公開する環境。

Googleタグマネージャーの環境を設定

スクリーンショット 2019-03-02 1.36.02.png
  • [管理]->[環境]を開いて環境の設定画面を開きます。
  • [新規]ボタンをクリックして環境を作成します。
  • 環境の名前をつけて[環境を作成]をクリックします。
  • 作成した環境の[操作]->[コードを取得]をクリックし、表示されたコード片をHTMLに貼ります。

環境の名前

環境の名前は任意に作成できますが、今回は以下のように設定しました。

項目 内容
Dev 開発環境
QA テスト環境
Live(公開中)* 本番環境

*Live(公開中)環境はデフォルトで設定されている環境です。

バージョンを指定の環境に公開

以下のスクリーンショットのように、[バージョン]画面から各環境に向けてタグを公開することができるようになります。
スクリーンショット 2019-03-02 1.55.15.png

スクリーンショット 2019-03-02 1.59.44.png
  • [バージョン]の右にあるアイコンをクリックし[次に公開]をクリック。
  • [環境]を選択し[今すぐ公開]をクリック。

以上で各環境にタグを公開することができます。
Googleタグマネージャーの環境を使うと、複数の環境があるアプリケーションにも対応でき、本番公開前にテストができるので安心できます。
タグのプレビュー、公開方法が今までと変わるため、実際に運用している人たちにも共有が必要なので、その点は注意してください。

参照

https://www.axis-corp.com/other/4512.html
https://goodpatch.com/blog/gtm-pageviews/

7
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?