21.10.2024

Administration

How to Set Up Google Tag Manager and Find Your GTM ID

Google Tag Manager (GTM) is a free tag management system (TMS) from Google that lets you deploy and manage JavaScript tracking snippets — called tags — on your website through a centralized web interface, without touching your site's source code directly. Your GTM container ID (formatted as GTM-XXXXXXX) is the unique identifier that links your website's installed container snippet to your GTM account, and it is required whenever you integrate GTM with external platforms like Google Analytics 4, Meta Pixel, or any third-party data layer consumer.

This guide covers the complete setup process end-to-end: account and container creation, snippet installation across different platforms, locating your container ID, and the critical post-installation verification steps that most tutorials skip.

What Is Google Tag Manager and Why It Matters for Site Architecture

Before touching any configuration, it helps to understand what GTM actually does at the infrastructure level. When a browser loads your page, the GTM container snippet fires a request to https://www.googletagmanager.com/gtm.js?id=GTM-XXXXXXX. Google's servers return a compiled JavaScript bundle containing only the tags, triggers, and variables you have published in your current container version. This means:

No hard-coded tracking scripts are scattered across your HTML templates.
Tag firing is conditional — triggers evaluate DOM events, URL patterns, or custom JavaScript before a tag executes.
Version control is built in — every published container version is saved, and you can roll back instantly.
A single container can hold hundreds of tags from different vendors, all managed from one dashboard.

This architecture is particularly valuable when your site runs on a VPS Hosting environment where you control the full stack, because it decouples marketing instrumentation from your deployment pipeline entirely.

Step 1: Create a Google Tag Manager Account and Container

Account vs. Container — Understanding the Hierarchy

GTM uses a two-level hierarchy:

Account: Typically represents your company or organization. One account per business is the standard practice.
Container: Represents a single deployable unit — usually one website, one mobile app, or one AMP property. A single account can hold multiple containers.

Conflating these two levels is a common mistake. If you manage tracking for shop.example.com and blog.example.com as separate properties, they should be separate containers under the same account — not separate accounts.

Creating the Account

Navigate to tagmanager.google.com and sign in with the Google account that owns or has admin access to your Google Analytics property.
Click Create Account.
Enter your Account Name (your company or brand name).
Select your Country.
Leave Share data anonymously with Google checked or uncheck it per your privacy policy requirements.

Configuring the Container

Within the same creation flow:

Enter a Container Name — use the full domain (e.g., example.com) for clarity.
Under Target platform, select the appropriate option:

Platform Option	Use Case
—	—
Web	Standard HTML/JavaScript websites
iOS	Native iOS apps using Firebase SDK
Android	Native Android apps using Firebase SDK
AMP	Accelerated Mobile Pages
Server	Server-side tagging (GTM server container)

For most web projects, select Web.

Click Create and accept the Google Tag Manager Terms of Service. If you operate under GDPR jurisdiction, read the Data Processing Amendment before accepting.

After accepting, GTM immediately presents your two container code snippets. Do not close this window before copying them.

Step 2: Install the GTM Container Snippet on Your Website

GTM requires two separate code snippets placed in specific locations. Placing them incorrectly is one of the most common implementation errors and can cause tags to fire late, miss page views, or fail entirely on certain browsers.

The Two Required Snippets

Snippet 1 — <head> placement (JavaScript):

<!-- 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 -->

Place this as high in the <head> as possible — ideally immediately after the opening <head> tag.

Snippet 2 — <body> placement (noscript fallback):

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

Place this immediately after the opening <body> tag. This <noscript> iframe is the fallback for browsers with JavaScript disabled — it ensures basic tag firing still occurs via an iframe pixel load.

Critical note: Replace GTM-XXXXXXX with your actual container ID in both snippets.

Installation on WordPress

WordPress is the most common CMS for GTM deployments. You have three methods:

Method A — Theme functions.php (direct, no plugin dependency):

// Add to your child theme's functions.php
function add_gtm_head() {
    echo "<!-- 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 -->";
}
add_action('wp_head', 'add_gtm_head', 1);

function add_gtm_body() {
    echo '<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX" height="0" width="0"></iframe></noscript>';
}
add_action('wp_body_open', 'add_gtm_body', 1);

Method B — Plugin (Insert Headers and Footers or GTM4WP): Install the plugin, paste Snippet 1 into the header field and Snippet 2 into the body/after-body field. The GTM4WP plugin is preferred over generic header/footer plugins because it also pushes WordPress-specific data (post type, author, WooCommerce cart data) into the dataLayer automatically.

Method C — Direct template editing: Edit header.php in your theme to insert both snippets at the correct positions. Always use a child theme — editing a parent theme directly means your changes are wiped on the next theme update.

Installation on Shopify

Shopify restricts direct <head> access to the theme.liquid file. Navigate to Online Store > Themes > Edit Code > Layout > theme.liquid and insert both snippets at the appropriate positions. Note that Shopify's checkout pages require a Shopify Plus plan to add custom scripts.

Installation on a Custom HTML/Server-Rendered Site

If you manage a custom application on a Dedicated Server or VPS, edit your base HTML template directly. For server-side rendered frameworks (Node.js/Express, Django, Laravel), add the snippets to your base layout template file.

For a Node.js/Express application using EJS templates:

# Locate your base layout template
find /var/www/myapp/views -name "layout.ejs"

Then edit the file to insert both GTM snippets at the correct positions within the <head> and immediately after <body>.

Content Security Policy Considerations

If your site enforces a Content Security Policy (CSP) header — which it should on any hardened production server — you must whitelist GTM's domains. Add the following to your CSP directives:

script-src 'self' https://www.googletagmanager.com;
img-src 'self' https://www.googletagmanager.com;
frame-src https://www.googletagmanager.com;

Failing to update your CSP will silently block GTM from loading, and no error will appear in GTM's own interface — only in the browser console.

Step 3: Find Your Google Tag Manager ID

Your GTM container ID is always formatted as GTM- followed by an alphanumeric string (e.g., GTM-K2F9XP3). There are three reliable ways to locate it.

Method 1 — Container Dashboard (Primary Method)

Log in at tagmanager.google.com.
On the Accounts overview page, you will see all your accounts and their associated containers listed in cards.
The container ID (GTM-XXXXXXX) is displayed directly beneath the container name on each card — visible without clicking into the container.

Method 2 — Container Admin Panel

Open the container you want.
Click Admin in the top navigation bar.
Under the Container column, click Container Settings.
The Container ID field at the top of this page shows your full GTM ID.

Method 3 — Installed Page Source

If GTM is already installed on your site and you need to retrieve the ID without logging into GTM:

curl -s https://example.com | grep -o 'GTM-[A-Z0-9]*'

This command fetches your page source and extracts any GTM container ID string using a regex pattern — useful for auditing third-party sites or verifying which container is actually live.

Step 4: Verify the Installation

Skipping verification is the single most expensive mistake in GTM deployments. A misplaced snippet, a CSP block, or a theme override can silently break your entire tracking setup.

GTM Preview Mode (Recommended)

Inside your container, click Preview in the top-right corner.
Enter your website URL and click Connect.
A new browser tab opens your site with the Tag Assistant panel attached.
The panel shows every tag that fired on page load, which triggers activated them, and the full dataLayer state.

If the container loads correctly, you will see gtm.js listed as a fired tag and gtm.load as a completed event in the summary panel.

Google Tag Assistant Chrome Extension

Install the Tag Assistant Legacy or use the newer Tag Assistant Companion extension. Navigate to your site and the extension will confirm whether GTM is detected, display the container ID found, and flag any implementation errors (such as the snippet being placed in the wrong location or firing multiple times).

Manual Browser Console Check

Open Chrome DevTools (F12), go to the Network tab, filter by gtm.js, and reload the page. You should see a successful 200 response from www.googletagmanager.com. If you see a blocked or failed request, check your CSP headers and server firewall rules.

# Check response headers from GTM's script endpoint
curl -I "https://www.googletagmanager.com/gtm.js?id=GTM-XXXXXXX"

Step 5: Using Your GTM ID with Third-Party Platforms

Once your container is verified, the GTM ID is used in several integration contexts:

Google Analytics 4

Do not install GA4's gtag.js snippet directly on the page if GTM is present. Instead, create a Google Tag (formerly GA4 Configuration Tag) inside GTM, enter your GA4 Measurement ID (G-XXXXXXXXXX), and set the trigger to All Pages. This keeps all tracking centralized in GTM.

Meta (Facebook) Pixel

Add a Custom HTML tag in GTM containing the Meta Pixel base code. Use GTM's built-in variables ({{Page URL}}, {{Click URL}}) to populate event parameters dynamically rather than hardcoding them.

WordPress Plugins Requesting GTM ID

Plugins like Rank Math, MonsterInsights, or WooCommerce Google Analytics may ask for your GTM ID directly. If you have already installed the GTM snippet manually or via GTM4WP, do not enter your GTM ID into these plugins as well — this will cause the container to load twice, doubling all tag fires and inflating your analytics data.

Server-Side GTM (Advanced)

For high-traffic sites or privacy-sensitive deployments, GTM supports a server-side container that runs on your own infrastructure. Instead of the browser loading tags directly from vendor CDNs, all requests go to your server first. This improves page load performance, bypasses ad blockers, and gives you full control over what data leaves your infrastructure. Running a server-side GTM container is well-suited to a VPS with cPanel or a raw VPS where you can configure Node.js or a containerized tagging server.

GTM Container Types Compared

Container Type	Deployment Location	Primary Use Case	Requires Server Infrastructure
—	—	—	—
Web	Browser (client-side)	Standard website tracking	No
iOS / Android	Mobile app	App event tracking via Firebase	No
AMP	AMP pages	Tracking on Accelerated Mobile Pages	No
Server	Your server	Privacy-first, high-performance tracking	Yes

Common Pitfalls and Edge Cases

Double-firing containers: If your WordPress theme already includes GTM via a hardcoded snippet and you also activate a plugin that injects GTM, both will fire. Always audit your page source with curl -s https://example.com | grep -c 'GTM-' to count occurrences.

Wrong container environment: GTM supports multiple Environments (Live, Development, Staging). If a developer shares a preview link using a non-live environment token, tags may behave differently than in production. Always test against the Live environment before sign-off.

dataLayer initialization order: If your site pushes data to window.dataLayer before the GTM snippet loads, those pushes are lost. The dataLayer array must be initialized before the GTM snippet, or the snippet itself handles initialization — but any pushes that happen before the snippet executes are not captured. This is a frequent source of missing e-commerce data on slow-loading pages.

HTTPS requirement: GTM's gtm.js is always served over HTTPS. If your site still runs over HTTP, the mixed-content policy in modern browsers will block the GTM script. Ensure your site has a valid SSL certificate — SSL Certificates are a prerequisite for any production GTM deployment.

Tag sequencing: When multiple tags fire on the same trigger, execution order is not guaranteed unless you explicitly configure Tag Sequencing (Setup Tag / Cleanup Tag) in GTM's advanced tag settings.

Practical Decision Matrix

Use this checklist before considering your GTM setup production-ready:

[ ] Container snippet is present in <head> and immediately after <body> on every page, including dynamically generated pages.
[ ] GTM ID appears exactly once per page — confirmed via curl or browser source inspection.
[ ] CSP headers whitelist www.googletagmanager.com for script-src, img-src, and frame-src.
[ ] Preview Mode confirms the container loads and gtm.js fires on page load.
[ ] No duplicate GA4 or other vendor snippets exist outside GTM.
[ ] dataLayer is initialized before the GTM snippet in the HTML source.
[ ] If using WordPress, a child theme or a dedicated plugin (not the parent theme) holds the snippet.
[ ] Server-side firewall rules permit outbound requests to www.googletagmanager.com:443.
[ ] For e-commerce: dataLayer pushes for purchase, add_to_cart, and view_item events are verified in Preview Mode before going live.
[ ] Container is published — unpublished changes exist only in the workspace and do not affect the live site.

If your hosting environment is a managed Shared Web Hosting plan without direct server access, focus on the CMS-level installation methods (plugin or theme file) and rely on GTM Preview Mode for verification rather than server-level curl commands.

FAQ

What is a GTM container ID and where is it used?

A GTM container ID is a unique identifier in the format GTM-XXXXXXX that links the JavaScript snippet installed on your website to your specific GTM container. It is used in the container snippet code, in third-party platform integrations, and in GTM's own admin interface to identify which container's tag configuration should be loaded.

Can I use the same GTM container on multiple domains?

Technically yes — the same snippet can be placed on multiple domains — but it is not recommended. Tags and triggers configured for one domain's URL structure will produce unreliable data on a different domain. The correct approach is to create a separate container per domain and use cross-domain tracking configuration within GA4 if you need to track user journeys across both.

Why is my GTM container not firing even though the snippet is installed?

The most common causes are: a Content Security Policy blocking www.googletagmanager.com, the snippet being placed inside a conditional comment or an async-loaded template partial, a WordPress caching plugin serving a cached page that was built before the snippet was added, or the container having no published version. Check the browser console for CSP violations and use GTM Preview Mode to isolate the issue.

What is the difference between GTM Preview Mode and Tag Assistant?

GTM Preview Mode is a built-in GTM feature that connects a debug session directly to your container, showing real-time tag firing, trigger evaluation, and dataLayer state for your specific browser session. Tag Assistant is a Chrome extension that provides a lighter-weight overlay showing which Google tags (GTM, GA4, Ads) are detected on a page and flags basic implementation errors. For deep debugging, Preview Mode is authoritative; Tag Assistant is useful for quick surface-level checks.

Does Google Tag Manager affect website performance or page load speed?

The GTM snippet itself is loaded asynchronously, so it does not block HTML parsing or render-blocking resources. However, the tags fired by GTM — particularly synchronous custom HTML tags or heavy third-party scripts — can significantly impact page load time. Audit your container's tags regularly, use GTM's built-in tag firing priority and sequencing controls, and consider server-side GTM for high-traffic sites where client-side script overhead is a measurable concern.

Save 15% on All Hosting Services