メインコンテンツにスキップ
すべてのコレクションApps
Googleタグマネージャーの連携手順
Googleタグマネージャーの連携手順

Apps連携機能を使いGoogleタグマネージャーをStudioサイトへ連携する手順をご紹介します。

Saika avatar
対応者:Saika
2か月以上前に更新

対象プラン: Starterプラン以上


StudioにGoogle タグマネージャーを連携すると、様々なコードの埋め込みが可能となります。Studioで直接サポートしていないツールやJavascript導入にご利用いただけます。

タグマネージャー側の詳しい使い方については、タグマネージャーヘルプ をご覧ください。

注意

  • 本手順には外部サービスの手順も含まれています。外部サービスの仕様や動作、記事内の手順以外についてはチャット窓口でのサポート対象外となる可能性があります。

  • 記事内の外部サービスの画面や仕様は2023年12月時点の情報です。記事と異なる場合、外部サービスにて最新情報をご確認ください。

GoogleタグマネージャーのApps連携手順

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 は動作しません。

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