top of page

Google Tag Manager: Setup Guide and How to Use It Effectively

Google Tag Manager (GTM) is a free tag management system that allows you to add, edit, and remove marketing and analytics code (tags) from your website without modifying the site's source code directly. Instead of asking a developer to add each new tracking pixel or analytics code, you deploy a single GTM container snippet once — and then manage all future tracking implementations through the GTM interface.

For marketing teams that need to iterate quickly on tracking and measurement without a constant development dependency, Google Tag Manager is essential infrastructure.

Core Concepts: Tags, Triggers, and Variables

Understanding three concepts is sufficient to use GTM effectively:

Tags are the code snippets that execute on your website — GA4 tracking code, Google Ads conversion pixels, Meta Pixel, LinkedIn Insight Tag, scroll depth tracking scripts, and more. GTM contains pre-built templates for all major platforms; you configure the template with your account IDs rather than writing code.

Triggers define when a tag fires. Common trigger types:

  • Page View — fires when a specific page (or all pages) loads

  • Click — fires when a specific element, button, or link is clicked

  • Form Submission — fires when a form is submitted

  • Scroll Depth — fires when a user scrolls to a defined percentage of the page

  • Custom Event — fires when a specific named event is pushed to the GTM data layer

Variables are dynamic values that tags and triggers use. Built-in variables include the current page URL, the clicked element's CSS class, the clicked element's text, and form field values. Custom JavaScript variables allow you to extract any value from the page dynamically.

Setting Up Google Tag Manager

Step 1 — Create a GTM account and container

Go to tagmanager.google.com. Create a new account (typically your company name) and within it a container (typically your website domain). Select "Web" as the target platform.

GTM provides two code snippets: a <script> tag for the <head> and a <noscript> tag for immediately after the <body> opening tag. Your developer (or CMS plugin) installs both snippets once — this is the only code change required.

Step 2 — Deploy GA4 via GTM

In the GTM workspace, click New Tag → Tag Configuration → Google Tag. Enter your GA4 Measurement ID (G-XXXXXXXXXX). Set the trigger to "All Pages." Preview the tag in debug mode to verify it fires on all pages, then publish the container.

This replaces the need to add the GA4 global site tag directly to your website code. All future GA4 configuration (event tracking, conversion setup) happens through GTM.

Step 3 — Verify with Tag Assistant

Install the Google Tag Assistant browser extension. With Tag Manager Preview Mode active, browse your website and confirm the GA4 tag fires on every page. Tag Assistant shows which tags fired, which triggers activated them, and whether any errors occurred.

Implementing Conversion Tracking via GTM

Form submission conversion

To track a form submission as a conversion event:

  1. Create a trigger: Trigger type → Form Submission. Configure conditions to fire on the specific form URL or form ID.

  2. Create a tag: GA4 Event. Name the event generate_lead (or your convention). Associate it with the form submission trigger.

  3. Test in Preview Mode: Complete the form and verify the tag fires and the event name is correct.

  4. Publish.

Thank-you page conversion (simpler alternative)

If your form submission redirects to a confirmation page:

  1. Create a trigger: Page View. Condition: Page URL contains /thank-you (or your confirmation URL)

  2. Create a GA4 Event tag with event name generate_lead

  3. Test and publish

Button click conversion

To track a specific CTA button click:

  1. Enable the built-in variable "Click Classes" (or "Click ID")

  2. Create a trigger: Click → All Elements. Condition: Click Classes contains the button's CSS class

  3. Create a GA4 Event tag and associate with the click trigger

Advanced GTM Techniques

Data Layer

The GTM Data Layer is a JavaScript object that passes information from your website to GTM, allowing tags to access values not available through standard page scraping. For e-commerce tracking, the data layer passes product IDs, names, prices, and transaction IDs to GA4 and Google Ads conversion tags.

Most e-commerce platforms (Shopify, WooCommerce) have native GTM/data layer integrations that handle this automatically.

GTM variable types for dynamic values

Custom JavaScript variables allow you to extract any page value — the text of a specific DOM element, a value from a cookie, or a calculation based on page content. This is how you track dynamic prices or custom attributes without platform-specific development work.

Testing and Publishing in GTM

Never publish a Google Tag Manager container change without testing in Preview Mode first. The GTM preview mode shows a real-time debug console on your website that displays:

  • Which tags fired on each page

  • Which triggers activated each tag

  • Data Layer contents at each moment

  • Any errors that prevented tags from firing

Common testing steps before publishing:

  • Load the home page → verify GA4 page view tag fires

  • Submit the contact form → verify the conversion tag fires

  • Click the phone number → verify the phone click event fires

  • Complete a checkout → verify the purchase event fires with correct parameters

Publish only after all tested scenarios produce the expected tag firing behavior.

Blakfy implements Google Tag Manager for clients — configuring the complete tracking infrastructure for GA4, Google Ads conversion tracking, and all third-party pixels through a properly structured GTM container.

Frequently Asked Questions

Does Google Tag Manager slow down my website?

GTM adds a small amount of loading overhead, but when implemented correctly, it typically has negligible impact on page speed. The more important factor is what tags you load through GTM — loading many heavy third-party scripts (chat widgets, ad pixels, analytics tools) will affect load time regardless of whether they're deployed through GTM or hardcoded. GTM itself is not the performance bottleneck.

Can I use GTM without GA4?

Yes — GTM is a generic tag management system, not a Google Analytics tool. You can use it to deploy any third-party tracking code: Meta Pixel, LinkedIn Insight Tag, Hotjar, Intercom, Drift, HubSpot tracking, and any other JavaScript snippet. GA4 is simply one of the most common tags deployed through GTM.

What is the difference between a tag, a trigger, and a variable in GTM?

A tag is the code that runs (the tracking pixel or analytics call). A trigger is the condition that determines when the tag runs (a specific page load, a button click, a form submission). A variable is a dynamic value used by tags or triggers (the current page URL, the clicked element's text, a value from the data layer). Every GTM tag needs at least one trigger to define when it fires.

Do I need a developer to use GTM after the initial setup?

After the initial GTM container snippet is installed on the site, most tag management tasks can be performed by a non-developer using GTM's visual interface. Exceptions include complex data layer implementations (e-commerce tracking, custom event tracking with specific parameters) which may require developer support for the data layer push code. Standard conversion tracking, GA4 events for clicks and form submissions, and third-party pixels can all be configured without coding.

bottom of page