All Collections
Build My Storefront
Advanced Site Customization
Block Third-Party Tracking with your Cookie Consent Popup
Block Third-Party Tracking with your Cookie Consent Popup

Use custom code to block Third-Party Tracking (ie. Google Analytics) via Cookie Consent Popup

Updated over a week ago

If you would like to block third-party tracking tools like Google Analytics until the end-user opts in, you can achieve this using Javascript in the Code Snippets and HTML in the Code Editor.

This advanced tutorial is for Web Developers or users who are familiar with the programming languages mentioned above. We provide this information for educational purposes. It presents a general approach and a suggested solution to block a third-party tool like Google Analytics. If you aren't proficient with those programming languages, please do not try this and hire a Web Developer for Advance Custom Changes instead.

For this example, you will likely want to use a similar approach to what is shown below. This particular example works with cookieconsent.min.js - "Open Source Edition", which allows you to create your cookies consent pop-up.*

Don't forget to make a backup of your site before you begin editing your code.

  1. Copy the code outputs from cookieconsent.min.js. Please note there are two codes to insert.

  2. Add the first code (HTML) to the Head Code Snippet using Code Snippets.

  3. Insert the second code (JavaScript) into the theme.liquid file - before the </body> tag, using the Code Editor.

Warning

Placing the code in a different position will potentially break your site - in appearance and/or functionality.

With the help of your web developer, you can create code similar to this, depending on your tracking opt-in needs - please insert it in your Head Code Snippet.

<script>

// Set your Google Analytics Tracking ID
var gaCode = 'UA-XXXXXX-X';

// Enables the Cookies on the next session
window['ga-disable-' + gaCode] = true;
if (getCookie('cookieconsent_status') === "allow") {
window['ga-disable-' + gaCode] = false;
}

// Cookie lookup
function getCookie(name) {
var re = new RegExp(name + "=([^;]+)");
var value = re.exec(document.cookie);
return (value != null) ? unescape(value[1]) : null;
}

<script>

In the first part, you need to enter your Google Analytics Tracking ID. The script will do the heavy-lifting by detecting if "cookieconsent_status" is enabled, before allowing Google Analytics.

Notes:

  • Cookies and third-party tools are useful tools to track and gather data about user behavior and targeting across the web. Reducing your tracking abilities will no doubt affect the accuracy of your tacking based data. This code will block Google Analytics and other tracking pixels that you have in place until the end-user consents. If the tracking pixels are disabled, successful conversions are not going to be tracked. We will not be able to help troubleshoot this or provide solutions - blocked means there is no tracking at this level.

  • *The scope of our support doesn't cover this type of web development. We provide this article for educational purposes. You may want to implement and maintain this with the help of your web developer. If you don't have a developer in-house, you can hire one of our recommended freelance developers. Please be advised that the recommendations in this guide are subject to change based on common third-party tracking services, like Google Analytics, and the cookie consent code used here, as it is third party code.

  • Please be advised that future code pushes on our platform could overwrite or break your customizations; if this happens, we may not be able to provide an immediate solution for you.

  • If you wish to see this built natively into the Uscreen platform in the future, please submit your feedback as a feature request.

Did this answer your question?