Versions Compared

Old Version 7

changes.mady.by.user Siamak Haschemi (Deactivated)

Saved on

compared with

New Version 8

changes.mady.by.user Walter Meng

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Info

Summary of steps

  1. Create a Google sGTM container on tagmanager.google.com and check the option “Manually provision tagging server”.

  2. Copy the Container Config String

    1. Example: aWQ9R1ABLVdISjlGWkMmZW52PTEmYXV0aD1VUzlrbVhlUWxtcElyVzhENEJBeGxn

  3. Copy the Web Container Id (Attention: This is not the ID of the server-side container)

    1. Example: GTM-WHJ8FZC

  4. In order to improve tracking quality by running sGTM on your own domain, choose a sub-domain of your main domain. The sub-domain should be random (use this website to generate a random string: Random.org)

    1. Example: c3y1mavw4g.yoursite.com

  5. Write a ticket to taglify.io Service Center with the following information:

    • Container Config String

    • Web Container Id

    • Your Sub-Domain (c3y1mavw4g.yoursite.com in our example)

  6. Set an A record with you registrar to the IP provided by taglify.io Service Center

    1. Hostname: c3y1mavw4g.yoursite.com

    2. Type: A

    3. TTL: 60

    4. Data: ${IP_PROVIDED_BY_TAGLIFY}

  7. To load the gtm-javascript code via your sgtm-container you have to make the following changes to the script on your page.

    1. Replace ${TAGGING_URL} with your tagging url. e.g. c3y1mavw4g.yoursite.com

    2. Replace ${CONTAINERGTM_JS_ID_FILENAME} and ${NOSCRIPT_HTML_FILENAME} with with the container-js-id values you got from taglify.io . e.g. y16rm8ykxy.js and sldfke274jf.html

    3. Replace ${WEBCONTAINER_ID} with your Web Container Id.

  8. If you want to use the preview mode in Google Tag Manager:

    1. Set the tagging domain (c3y1mavw4g.yoursite.com in our example) in the container settings.

Code Block
languagejs
<!-- 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://${TAGGING_URL}/${CONTAINERGTM_JS_IDFILENAME}?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','${WEBCONTAINER_ID}');</script>
<!-- End Google Tag Manager -->

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://${TAGGING_URL}/${NOSCRIPT_HTML_FILENAME}?id=${WEBCONTAINER_ID}"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

How to setup a sGTM tagging container with taglify.io

...

  • Replace ${TAGGING_URL} with your tagging url. e.g. c3y1mavw4g.yoursite.com

  • Replace ${CONTAINERGTM_JS_ID} with the container-js-id FILENAME} and ${NOSCRIPT_HTML_FILENAME} with with the values you got from taglify.io . e.g. y16rm8ykxy.js and sldfke274jf.html

  • Replace ${WEBCONTAINER_ID} with your Web Container Id.

Code Block
languagejs
<!-- 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://${TAGGING_URL}/${CONTAINERGTM_JS_IDFILENAME}?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','${WEBCONTAINER_ID}');</script>
<!-- End Google Tag Manager -->

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://${TAGGING_URL}/${NOSCRIPT_HTML_FILENAME}?id=${WEBCONTAINER_ID}"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

A fully working example might look like this:

Code Block
languagejs
<!-- 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://c3y1mavw4gxemuncivn.yoursitekickz.com/y16rm8ykxyhj40t6q2ic.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-AAA9FZC1234567');</script>
<!-- End Google Tag Manager -->
Next, add this code immediately after the opening <body> element on every page of your website. Replace GTM-XXXXXX with your container ID:


<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://xemuncivn.kickz.com/infbpm1mfc.html?id=GTM-1234567"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

6. In order to use the preview mode in your Google Tag Manager account, you have to configure it in the Container Settings. Open the admin panel of your container. Click on Container Settings. Click on Add URL under Server container Urls. Enter the tagging url. If you are not using a first-party setup, enter the tagging url you received from taglify.io .

...