すべてのコレクション
Apps
Googleタグマネージャーの連携方法
Googleタグマネージャーの連携方法
Saika avatar
対応者:Saika
一週間前以上前にアップデートされました

💡 この機能は、有料プラン契約プロジェクトでご利用いただけます

STUDIOのApps機能には、「Google タグマネージャー」があります。これを使えば、たいていのコードの埋め込みが可能となります。これにより、STUDIOで直接サポートしていないツールやJavascriptを導入することが可能です。

連携方法

1. GoogleタグマネージャーのIDを取得

Googleタグマネージャーのアカウントを作成し、コンテナを作ります。この時、連携したいサイトのドメインを指定し、「ウェブ」をタイプとして選択します。

コンテナを作成すると、下記のような画面が表示されます。この画面中の「GTM-XXXX」という形式のIDをコピーしておいて下さい。

もし既にコンテナが存在する場合は、タグ マネージャーで、[ワークスペース] をクリックし、ウィンドウ上部にあるコンテナ ID(「GTM-XXXXXX」の形式)をコピーします。

2. STUDIOのプロジェクトと連携

IDを取得したら、連携したいSTUDIOサイトのプロジェクトダッシュボード画面でAppsタブを開きます。

Google Tag Manager をクリックし、ID入力欄にコピーしたGTM IDをペーストし、保存します。

※余計なスペースがあると正確な連携ができません

IDの設定が終わったら、公開パネルから「更新」を忘れずに行って下さい。IDの設定が完了したら、忘れず「更新」を行ってください。

これで連携は完了です。

※タグマネージャー側のより詳しい使い方については、タグマネージャーヘルプ をご利用ください

3. 動作確認

機能が正常に動作しているか確認するためには、タグマネージャーのワークスペースで、「プレビュー」ボタンをクリックします。その後、連携したサイトでページを再読み込みし、検証パネルが表示されれば、タグマネージャーとの連携が成功していることが確認できます。

もし検証パネルが表示されない場合は、IDの入力に誤りがあるか、Adblockなどの拡張機能が原因で連携がうまく行っていない可能性があります。設定を再度ご確認ください。

なお、ライブプレビューURLにアクセスしてもGoogle Tag Manager は動作しません。

こちらの回答で解決しましたか?