Streaming live at 10am (PST)

Google Tag Manager


#1

Hi. I'm having a small issue inserting the Google Tag Manager code. I've inserted it through an embed, right after the opening body, but it looks like it's getting wrapped in a div element, which tag manager does not want. Is there any way of inserting without a div? Here's the notes on GTM:


How to insert code GTM (Google Tag Manager) after the tag < body >?
Google Tag Manager Interference with Google Analytics
#2

I have an idea. You can use jQuery code to add it right after the body tag wink

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>   
<script>
var html_code = '<div>' + 
      '<p>Some text here</p>' + 
      '</div>';
    $(document).ready(function() {
     $('body').prepend(html_code);
    });
</script>

It is very important for you to remember, that jquery does understand new line as something separate. So if you want to add multiple line text it has to be inside quotation mark ' ' and with addition sign + between.


#3

Awesome, I'll give that a try and will post how it worked. Thank you @bartekkustra


#4

Hi @bartekkustra. Looks like my first post got pretty messed up. I'm getting an error [object Object] showing up on the very top of the test site I'm trying to inject this to.
I've put in escapes for all the single quotes and the closing script. I've been looking at this and can't figure out where it's failing. Any help is really appreciated.

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

var html_code = '<!-- Google Tag Manager -->' +

'<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-P12345" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>' +

'<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=\'//www.googletagmanager.com/gtm.js?id=\'+i+dl;f.parentNode.insertBefore(j,f);' +

'})(window,document,\'script\',\'dataLayer\',\'GTM-P12345\');<\/script>' +

'<!-- End Google Tag Manager -->';

$(document).ready(function() {
$('body').prepend(html_code);
 });

#5

Clean up the code, (line by line), paste CLEAN code here using CODE tag. I can't help if its so messed up wink


#6

Sorry, that was ugly. I'm a bit challenged lately.

Thanks


#7

Could you please post the clean code without those backslashes before every quotation mark? That will be easier for me to prepare it for you wink


#8

Here's the code without any of my changes.

<!-- Google Tag Manager -->
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-P12345"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<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=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-P12345');</script>
<!-- End Google Tag Manager -->

Thanks again for taking a look.


#9
var html_code = "<!-- Google Tag Manager -->" + 
"<noscript><iframe src='//www.googletagmanager.com/ns.html?id=GTM-P12345' height='0' width='0' style='display:none;visibility:hidden'></iframe></noscript>" + 
"<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= '//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-P12345');</script>" + 
"<!-- End Google Tag Manager -->";

#10

Thanks. Quick question. When I paste the code into my editor, it looks like that last closing script, just before the End Google Tag Manager, is ending the script that starts just before the var statement. That /script needs to be included with the code. I haven't tried it on the site yet.

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>   
**<script>**
var html_code = "<!-- Google Tag Manager -->" + 
....
(window,document,'script','dataLayer','GTM-P12345');**</script>"** +
"<!-- End Google Tag Manager -->";
$(document).ready(function() {
 $('body').prepend(html_code);
});
</script>

#11

This should work. I also haven't tested it. You could also try to alert(html_code); to test if it looks good up there before you start to prepend it into body wink

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>
var html_code = "<!-- Google Tag Manager -->" + 
"<noscript><iframe src='//www.googletagmanager.com/ns.html?id=GTM-P12345' height='0' width='0' style='display:none;visibility:hidden'></iframe></noscript>" + 
"<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= '//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-P12345');</script>" + 
"<!-- End Google Tag Manager -->";
$(document).ready(function() {
 $('body').prepend(html_code);
});

#12

Hi @bartekkustra. Well it looks like I need to learn more javascript. It's still not doing the prepend into the body so I thought I'd strip it down and try a basic version. I copied the original example you posted to me with just a couple div's and the "Some text here" and that one didn't prepend into the body either.

I've done a ton of searching (stackoverflow etc) and looked at lots of other code and just can't see any errors.

Any other ideas I could try?


#13



#14

Thank you. I did get that to work to smile


#15

Here's what I'm seeing when I run the full code:

" + ""; $(document).ready(function() { $('body').prepend(html_code); });

It is in the head tag:


#17

I can't get this to work? Has anyone been able to figure this out? The last closing script tag doesn't work. I cant figure out how to attach this google tag manager...

Here is my site. https://preview.webflow.com/preview/insurance-nation?preview=b95c1a7106a57a4d100026bfb367c80f


#20