Load Google Tag Manager Synchronously

问题

I have searched Google Tag Manager (GTM) documentation and did not find anything addressing this issue. I'm working with an affiliate network who wants their tracking pixel to be loaded synchronously to ensure that it fires before the content of the page loads. This only applies to our order confirmation page. We've implemented GTM so we can launch and fix tags in 5 minutes versus 2 weeks.

GTM is installed at the top of our order confirmation page and loads tags asynchronously so I know that the affiliate networks' tags are loading very quickly but the networks are still concerned that some data may be lost. GTM doesn't have any options or documentation that would indicate that it is possible to load the script synchronously but I notice the j.async=true name-value pair in their code.

If I change that part of the code to j.async=false, will the code load synchronously or will I just break it?

Here's the full code for reference.

<!-- Google Tag Manager -->
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXXX"
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','myNewName','GTM-XXXX');</script>
<!-- End Google Tag Manager -->

回答1:

The article on Cardinal Path is great for learning how to setup synchronous tags.

However, as for the concern about ensuring there is no lost data, I would like to highlight Mickael's comment at the bottom of that article. Since the dataLayer.push might not be complete before the gtm.dom event occurs, you should include a custom event in the dataLayer.push so you are not relying on gtm.dom to fire your tags.

Here is an example tag with a custom event specific to page load.

Tag Name: pageLoad

Tag Type: Custom HTML Tag

HTML:

<script type="text/javascript">
var tid = setInterval( function () {
    if ( document.readyState !== 'complete' ) return;
    clearInterval( tid );       
    dataLayer.push({ "event": "pageLoaded" });
}, 100 );
</script>

Add the following Firing Rule.

Rule Name: All pages

Condition: {{url}} matches RegEx .*

Then, on the affiliate tags you want fired, all you have to do is include this custom event (i.e. pageLoaded) as a condition on the firing rule. In this example, the condition would be: {{event}} equals pageLoaded

回答2:

We had a similar requirement with regards to defining a page type and then operating a rule/macro based on that input.

The suggestion I found was to have a rule in GTM to determine pageload/rule load etc.

I found it in this article, http://www.cardinalpath.com/controlling-tag-firing-order-with-google-tag-manager/

Hopefully that will help solve it - in theory you should be able to, have something that will trigger the GTM code before the page load.

来源：https://stackoverflow.com/questions/16552560/load-google-tag-manager-synchronously

标签

tracking

google-tag-manager