Topics

Google Tag Manager

In This Guide

Brightspot's Google Tag Manager integration allows you to quickly update tags on your site. After adding a code snippet to your Brightspot site, you are able to deploy analytics and measurement tag configurations from a web-based user interface.

Accessing Google Tag Manager code snippet

Tip
This procedure is also described in Google Tag Manager documentation.

To access Google Tag Manager code snippet:

  1. Login to your Google Tag Manager account at tagmanager.google.com. You see a list of available containers.
  2. Under the Container Name list, select the container from which you want to add the script. Google Tag Manager’s container dashboard appears.
  3. Under the Admin tab, click Install Google Tag Manager on the right. A page displaying JavaScript snippets appears.
  4. Copy the first JavaScript code snippet.

See the following generalized code snippet as an example of what to copy:

<!-- 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-1234567');</script>
<!-- End Google Tag Manager -->

Adding Google Tag Manager snippet to Brightspot site

The following procedure describes how to add a Google Tag Manager script to your site's <head> elements.

To add Google Tag Manager snippet to Brightspot site:

  1. Click menu > Admin > Sites & Settings.
  2. In the Sites widget, select the site to which you want to add a Google Tag Manager container snippet.
  3. Under the Front-End tab, expand the Advanced cluster.
  4. Under Custom Scripts and Styles, click add_circle_outline to add a custom head script.
  5. Enter an internal name for the custom head snippet.
  6. Under Request Matcher, configure the filters for deploying Google Tag Manager. (The default settings are optimized for most web sites.)
    Tip
    The default Request Matcher settings will apply to every page. To proceed with these settings applying to all pages on your site, refrain from making changes to this section.
    Google Tag Manager Screenshot1.png
  7. Under Elements, click add_circle_outline and select Script Element.
  8. Enter an internal name for the script element.
  9. Under Type, select Inline.
  10. In theBody field, paste the JavaScript container snippet you copied from Google Tag Manager.
  11. Delete the <script> and </script> tags. These tags are automatically included by Brightspot.
    Google Tag Manager Screenshot2.png
  12. Click Save.

Verifying that the Google Tag Manager snippet is included on Brightspot site

Tip
Clear your cache before testing if Google Tag Manager is working on your site. This may be done at the browser level or by adding any query parameter to the end of the URL path.

To verify that the Google Tag Manager snippet is included on Brightspot site:

  1. On one of the pages of your site for which you have configured Google Tag Manager, right-click the page and click View Source. 
  2. Using the Find function (CMD-F on Mac; CTRL-F on PC), search for gtm and verify that the Google Tag Manager code is included on the page.

Validating that Google Tag Manager code is making a call to Google Tag Manager

Note
The following procedure assumes you are using Google Chrome.

To validate that Google Tag Manager code is making a call to Google Tag Manager:

  1. On one of the pages of your site which includes the Google Tag Manager code, right-click the page and click Inspect.
  2. On the Google Developer Toolbar, click the Network tab.
  3. Refresh the page.
  4. In the Filter search bar, type gtm.
  5. Verify that the script appears, that the call was made to Google Tag Manager, and verify the ID of the container that was called.

Google Tag Manager resources

Google Tag Manager includes a number of public resources that are available to users, including demonstrations and conceptual guides. See the list below:

In This Guide