Google Tag Manager WHMCS Integration

In this tutorial you'll learn how to integrate Google Tag Manager with your WHMCS Template.

Open the following file:

templates/your_template/includes/functions.tpl (some templates will use the file hook-head.tpl instead).

Add your copy of the head code provided within your Google Tag Manager account to the bottom of this file:

<!-- Google Tag Manager -->
{literal}
<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-example');</script>
{/literal}
<!-- End Google Tag Manager -->

In order for the code to work within WHMCS, you need to add {literal} before <script> and {/literal} after </script> as shown in our example above. This stops the Javascript conflicting with WHMCS.

Open the following file:

templates/your_template/footer.tpl.

Add your copy of the body code provided within your Google Tag Manager account to the bottom of this file above </body>:

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

Having problems?

If Google Tag Manager is not working or you have any questions free to leave a comment below and we'll be happy to help.

Comments

If you have any questions please leave a comment below or contact our support.