Como implementar tag de comércio eletrônico na Xtech via GTM (dataLayer)

Esse é o tipico post que veio direto do nosso “Shit happens”, por isso serei breve para ajudar vocês também de maneira rápida e prática.

Nesse post já ensinei a como configurar tudo dentro do google tag manager hoje iremos aprender a como disponibilizar os dados dentro da sua loja Xtech para dentro do Google tag manager, beleza?

Dentro do seu painel de administrador na xtech vá até: Layout > Editor de temas > Ações > Editar HTML > Sublayout > order_placed.html dentro do layout insira o seguinte script.

<script>
    var dataLayer = window.dataLayer || [];
    dataLayer.push({
        'event': 'orderPlaced',
        'transactionId': {{order.id}},
        'transactionTotal': {{order.total}},
        'transactionTax': {{order.tax}},
        'transactionShipping': {{order.shipping}},
        'transactionProducts': [

            {% for product in order.contents %}
                {
                    'sku': '{{product.sku}}',
                    'name': '{{product.name}}',
                    'price': {{product.price }},
                    'quantity': {{ product.quantity }},
                    'category': '{{ get_product_category(product.id)|e('html') }}'

                },
            {% endfor %}

        ]
    })
</script>

Aonde insiro a tag dentro do código?

Bem, não existe um lugar em especifico para a inserção da tag, para dar uma padronizada vou indicar que a mesma seja adicionada no final do arquivo, beleza?

Tentei mastigar ao máximo a implementação da tag de comércio eletrônico na Xtech por isso deixei o código fonte, gostaria de deixar um agradecimento em especial para o Ricardo Oliveira CTO da Xtech que me ajudou na implementação da tag.