Submit a request

Adding Google Tag Manager

Adding Google Tag Manager

Welcome to our Placester Hacks series! Placester Hacks are Placester-approved tricks and workarounds that allow you to accomplish some customizations that may not seem possible with the current toolsets included in Placester’s products. Keep in mind that these hacks are generally more advanced than standard setup instructions. We recommend only using them if you’re familiar with HTML and website editing. 

This article will show you how to add Google Tag Manager to your site.

Google Tag Manager is a tag management system created by Google to manage JavaScript and HTML tags used for tracking and analytics on websites.

Please note that adding a Google Tag Manager code requires access to one of our upgraded features. If you’re currently not subscribed to one of our higher subscriptions but are interested in learning more, please visit our packages and pricing page.

Getting started

To begin, you will need to set up a Google Analytics account to your track your Placester site’s general traffic. A comprehensive guide to this can be found here.  

Once you have created your Google Analytics account, you will be able to start a Google Tag Manager account as well by clicking into the “All Website Data” panel shown below.

Screen_Shot_2017-12-18_at_3.28.59_PM.png

This will then pull up the Google Analytics Suite pop-up window. From here, click on the Tag Manager icon (the third icon to the left), and then click on “Get Started”.

Screen_Shot_2017-12-18_at_3.30.47_PM.png

You should then see the following screen, where you will be provided the code that you will need to paste into the back end of your Placester site. Please note that you will only need to copy the code provided in the top window. You will not need the second code Google provides here to connect Google Tag Manager to your site.

Screen_Shot_2017-12-18_at_3.31.55_PM.png

Adding your code to Placester header

Next, navigate to the back end of your Placester site and open the Custom CSS & JS panel by clicking edit site, then Custom CSS & JS.

Screen_Shot_2017-12-18_at_3.36.51_PM.png

Screen_Shot_2017-12-18_at_5.39.42_PM.png

Once you have opened the panel, you will notice two windows, “Custom CSS” and “Custom Javascript”. For the Google Tag Manager code, we will only be working within the “Custom Javascript” window. First, you will need to make sure that the Javascript (JS) section is set to “Head”. This setting is controlled by clicking on the gear icon next to the word “Javascript”.

Screen_Shot_2017-12-18_at_5.40.54_PM.png

Now that you have set the Javascript location to Head, you will need to type in “</script>” and then paste the Google Tag Manager code that you copied earlier.

To check that you have done this correctly, you can go back into your Google Tag Manager Dashboard and select the Preview button in the top right.

Screen_Shot_2017-12-18_at_5.41.45_PM.png

This will put your browser in a special debugging state. Next, visit your live site and you should see a Google Tag Manager dashboard on the lower half of the screen showing which tags are firing and what information is being tracked by analytics. This will confirm that you have added your Google Tag Manager to Placester correctly!

Screen_Shot_2017-12-18_at_5.46.17_PM.png

For Google Chrome users, an alternative way to check if Google Tag Manager has been successfully added is by downloading the Google Tag Manager Assistant extension.

Now that you have added Tag Manager, it’s time to create some tags. At first, it will show “There are no tags in this container.” Check out this link on how to create tags in Google Tag Manager.  

 

Need More Help?

If you have additional questions about adding Google Tag Manager to your site, let our support team know at [email protected]       ****(that is hyperlinked to mailto:[email protected]).

Powered by Zendesk