Google Tag Manager dataLayer unrecognized by Tag Manager

Question

Please Help. I'm trying to use the GTM dataLayer to track purchases on my sales confirmation page. I've added the dataLayer and it is above the GTM container snippet, but the datalayer is completely unrecognized by Google Tag Manager. It's like it doesn't exist on the page. why? You can see here in the source code that everything is properly formatted: view-source:http://www.maverickhelicopter.com/survey.aspx yet the GTM preview tool does not even recognize the existence of the datalayer. screenshot of GTM preview tool

In your page code you do a push to the - at this point uninitialized - dataLayer (this gives you a "survey.aspx:35 Uncaught TypeError: Cannot read property 'push' of undefined" error in the browser console). Then you try to initialize the dataLayer. Try and swap the two, and see if it starts working. — Eike Pierstorff

Matus Matus · Accepted Answer · 2017-07-17T13:49:25

The problem is you are calling dataLayer.push() function before GTM code snippet which defines dataLayer. As seen on your page:

You have to move dataLayer.push either after you define dataLayer OR after GTM code snippet you have in the body. It really depends when do you want to fire your "reservationPushed" event. If you include your push function in the head for example:

dataLayer = [{
    'page': {
        'type': 'confirmation',
        'environment': 'production'
    }
}];

dataLayer.push({
    'ecommerce': {
        'purchase': {
            'actionField': {
                'id': '0',
                'affiliation': '0',
                'revenue': '0'
            },
            'products': [{
                'name': '0',
                'id': '{{tourID}}',
                'price': '0',
                'category': 'None',
                'variant': 'None',
                'quantity': parseInt(document.getElementById("ctl00_ContentPlaceHolder1_hfGTMSEATS").value)
            }]
        }
    },
    'event': 'reservationPushed'
});

The "reservationPushed" event will be fired before Page View.

Alternatively you can move your whole push function below GTM code snippet to fire the event after Page View. Just don't make a mistake of moving your dataLayer variable also, this is on the correct place as per Developer Guide: https://developers.google.com/tag-manager/devguide

So besically one of your options is to structure your code as such:

<html>
...
<script>
dataLayer = [{
'page': {
  ...
}
}];
</script>
...

<!-- Google Tag Manager -->
...
<!-- End Google Tag Manger -->
<script>
dataLayer.push({
'ecomerce': {
...
}
</script>
...
</html>

Google Tag Manager dataLayer unrecognized by Tag Manager

1 Answers