Google Tag Manager - How To Add a Script to Your Site

OVERVIEW

Some 3rd party tools and plugins may require you to add a small snippet of script to your site to embed their tool or application to your site (eg. chat applications, pop-up modules etc.) and Google Tag Manager(GTM) makes this very easy to implement without even needing to involve Web Ninja's support team!

PREREQUISITES

If you already have access to a GTM account that's connected to your site - you can skip this step.
Otherwise if you don't already have a Google Tag Manager account connected to your site, you can simply sign up for a new account by going to Tag Manager's Home Page here.

Once you've completed the setup of your account, you'll be provided with a Tag Manager ID that looks like:
GTM-1111111

Send this through to Webninja's Support team and request to have Google Tag Manager activated on your site.

HOW TO ADD A CUSTOM SCRIPT TO THE SITE

Once you have a GTM account connected to your site, you can add the new script to your site by going to your GTM dashboard and following these steps.
(NOTE: over time Google may change their interface slightly - but the overall process will remain the same)

1. Click on "New Tag":
   
   
   
2. Enter a name for the new tag that makes it easy for you to identify (eg. "XYZ Chat" or "ABC Popup Module")
   - then click on the "Tag Configuration" section of the page:
   
   
   
3. Scroll down to the "Custom" heading and select the option for Custom HTML:
   
   NOTE: you can also filter the tag types by clicking on the search at the top right
   
   
4. Paste the custom script you were given into the HTML field:
   
   NOTE: you can ignore the advanced settings unless you want to play around with adding more finite rules - but it may produce unexpected results
   
   
5. Google requires you to add a trigger for every tag, scroll down to the Triggers section and click on it:
   
   
   
6. From the list of triggers, select the one that most closely matches your requirements.
   Eg. if you're wanting to add a chat widget to the site, you might want it appearing on all pages across the site.
   
   
   There are options for adding tags to just specific pages on your site - that's beyond the scope of this quick guide - you can review Google's own documentation and guides for more advanced setup of your GTM tags.
   
   
7. Review the custom HTML Tag you've created, then click on Save (top right) once you're sure it's how you want it:
   
   
8. On your dashboard in GTM - click on Tags in the left-hand menu and you'll see your recently created tag show in a list of tags you've created:
   
   
9. Once you're ready to make the changes live on the site, you have to publish them by clicking on the blue Submit button at the top right of the dashboard.
   IMPORTANT: this is a critical step and has caused a lot of confusion for some people - it may look like your tag is live after you created it, but until you submit it to be published to your site - it won't work on your site
   
   
   
10. Enter a Version Name (eg. "My Chat Widget - 1st Install") and a description if you feel like it.
    Then click on the Publish button at the top right:
    

Google will take a moment and notify you once the changes have been published.

You can then go to your site and reload the page and you should see the widget you were embedding show up on the site.

WHY USE GOOGLE TAG MANAGER ANYWAY?

Why not just drop the script directly into a text field somewhere on the site editor?

Web Ninja takes the security of your site very seriously, especially as a number of payment gateways we integrate with have strict PCI Compliance rules we have to adhere to (regardless if you use any of these payment gateways or not). These rules limit the kind of scripts we can let run on your site, as some could be misused to get customer info.

But the good part is Google Tag Manager (GTM) lets you add those third-party scripts without worrying about them messing with your site as it's like putting them in a protective bubble within Google Tag Manager's own system on your site.

And if, by any chance, there's a glitch because of these scripts through GTM, you can easily stop or remove them using GTM's dashboard. No need to stress – your site's data and code stay safe and sound; and you remain in control as you don't even need Web Ninja's support team to remove them for you!