How to Set Up Google Tag Manager on Your Online Store and Test It in Preview Mode
Google Tag Manager lets you add and change tracking tags on your store from one place, without editing the site’s code every time. You install one container, add tags such as the Google tag for Google Analytics 4, choose when each tag fires, test it in Preview mode and then publish. This guide follows Google’s Tag Manager documentation and works on any platform.
Based on official documentation. Not tested on a live store.
Before you start
0 of 4 ready
How Google Tag Manager works
Tag Manager has four building blocks. Tags are code that sends data to a system such as Google Analytics. Triggers listen for events such as page loads, clicks or form submissions and decide when a tag fires. Variables hold values that change, such as a page URL or a product name. The data layer holds structured data, such as order details, so tags can use it. You edit all of this in a workspace, and nothing reaches visitors until you publish.
Step 1: Create an account and a web container
Go to tagmanager.google.com, open the Accounts tab and select Create Account. Under Account Setup, enter an account name and country. Under Container Setup, use your site’s top level URL as the container name, choose Web as the container type, then click Create and accept the Terms of Service.
Expected result: You see the workspace of a new web container, with a container ID that starts with GTM.
Step 2: Install the container code on every page
On the Workspace tab, click your container ID to open the Install Google Tag Manager dialog. Paste the first code block as high in the <head> of the page as you can, and the second block immediately after the opening <body> tag. Add both to your theme or template so they load on every page, including the cart and checkout pages you control. On platforms such as WordPress, Shopify or Wix, an integration may do this for you.
Then enter your website’s URL in the dialog and click Test.
Expected result: The test finds the container on your site, and both code blocks load on every page.
Step 3: Add the Google tag for Google Analytics 4
Go to Tags and click New. Under Tag Configuration, choose Google Tag and enter your Measurement ID in the Tag ID field. In Triggering, choose an Initialization trigger for all pages, so the Google tag loads before your other tags. Name the tag, for example Google tag, and click Save.
Expected result: A Google tag with your G- ID and an initialization trigger is saved in the workspace. It is not live yet.
Step 4: Fire a tag only on the order confirmation page
Go to Triggers and create a trigger of the Page View type that fires on Some Page Views, with a condition that the page URL contains your confirmation page address. This is the trigger Google uses as its own example. Attach it to any tag that should run only after a purchase, such as a conversion tag from an ad platform.
For GA4 purchase events with order value and products, your store also has to send that data to the data layer. Our GA4 ecommerce tracking guide covers the events.
Expected result: The trigger is saved and only matches pages whose URL contains your confirmation page address.
Step 5: Test everything in Preview mode
On the Workspace tab, click Preview. Tag Assistant opens in a new tab. Enter your store’s URL and click Connect. Your site opens in a new window and shows Connected in the bottom right. Go back to the Tag Assistant tab and click Continue. Click through a few pages and, if you can, a test order, and check which tags fired on each page and what triggered them.
If pages break during preview, uncheck Include debug signal in the URL and connect again. To let a colleague check, use More Actions and Share in Tag Assistant and send them the preview URL.
Expected result: The Google tag fires on every page, and the confirmation page tag fires only on the confirmation page.
Step 6: Submit and publish a version
Click Submit at the top right, keep Publish and Create Version selected, enter a Version Name and Version Description, and click Publish. Google recommends descriptive names, so write what changed, such as Google tag and order confirmation trigger, first launch. Every version is a snapshot you can return to later.
Expected result: Your changes are live for every visitor, and the version appears on the Versions screen as published.
End the preview when you are done
Preview mode only appears in the browser where you started it, so visitors never see it. To end it, click the X in the upper left corner of the Tag Assistant debug interface, or click Stop debugging on the Tag Assistant activation page. Use Preview again before every future publish, especially before a big sale, when a broken tag costs the most data.
Common mistakes and how to fix them
The changes are still in the workspace. Preview never makes anything live.
Click Submit and publish a version, then check the Versions screen for the published entry.
The debug signal added to the URL conflicts with your site or a redirect.
Start Preview again and uncheck Include debug signal in the URL before you click Connect.
The container code is missing from some templates, for example a separate checkout or landing page template.
Make sure both code blocks are in every template your store uses, then retest those pages in Preview.
The tag uses a trigger for all page views instead of a trigger with a condition.
Use a Page View trigger on Some Page Views with a condition on the confirmation page URL.
The Google tag may run twice: once from code on the page and once from Tag Manager.
Keep one source. Google recommends managing Google tag settings in Tag Manager rather than in on page code.
Key takeaways
One web container per website is enough, named after the site’s top level URL.
Put the first code block high in the head and the second right after the opening body tag, on every page.
Load the Google tag with an initialization trigger so it runs before other tags.
Use a Some Page Views trigger with a URL condition for tags that belong only on the confirmation page.
Preview shows what would fire. Only Submit and Publish make changes live.
FAQ
Do I need a separate Tag Manager container for every page?
What is the difference between Preview and Publish in Google Tag Manager?
Can I add Google Tag Manager without editing my store's code?
How do I stop Preview mode?
Get practical store fixes in your inbox
Join the KonvertiQ newsletter for short, data-backed tips on checkout, trust and conversion. No spam, unsubscribe anytime.
We use your email only to send the newsletter. See our Privacy Policy.