If you try and add the Google Tag Manager script code directly into your header.tpl or head.tpl files, unfortunately, your front end styles will break.

To overcome this, wrap your GTM code in a literal:

{literal}
<!-- script code here -->
{/literal}

e.g:

{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-XXXXXXX');</script>
{/literal}