Learn business growth with Google Analytics 4 Forums Google Analytics 4 Disabling Google Tag Manager on localhost to prevent tag firing Reply To: Disabling Google Tag Manager on localhost to prevent tag firing

  • Quinn

    Member
    13 February 2023 at 4:21 am

    Of course, there are practical solutions to avoid firing events to your GA from non-production environments – or when debugging. Indeed, you can also stop GA from recording those events. Let’s go through the process.

    Generally, to start firing events to GA4 from GTM, you need a GA4 configuration tag, which requires a measurement ID. But hey, no one said you have to put just the measurement ID, right? You can set it to a CJS:

    Sample screenshot

    Just refer to it in your config tag, like this:

    Sample screenshot

    This way, whenever you’re working in your lower environment, your local host, or previewing the container on production, your tags and triggers will still fire, but these events will go to a different GA4 property.

    And before you ask, it’s actually a good habit to collect your events from lower environments, too – just don’t mix them with your production data. There may come times when you’ll need to review some test data.

    Moving on to the second part, GA4 does have data filters. While they’re not as robust as the old filtering system in GA UA, you’ll find the developer traffic filter useful. You’ll just need to add a custom parameter to every developer event that you want visible in the debug view, but not in the reports.

    Given GA4’s current limitations and susceptibility to occasional hiccups, it’s generally better to resolve this on the GTM end and reserve GA’s filters for situations that GTM can’t handle.

    Remember that GTM has built-in variables you can use, although most of them are turned off by default. When you type {{ and start typing the variable name in your CJS, this will come up:

    Sample screenshot

    Click on the option you want, and it’ll autofill for you. But do remember to interpret it as whatever the variable returns. They’re mostly strings, but you can also return a function and execute it like {{cjs that returns a function}}(param1, param2). Here’s an example:

    Sample screenshot

    Easy, right? The only thing is, debugging these built-in variables in the console can be a little tricky, so I usually just fetch the hostname from the global object, like this: window.location.hostname.