Configurações

Abandono de Carrinho

Configurar o abandono de carrinho para uma loja virtual na VTEX com Google Tag Manager

Para utilizar esse tutorial é necessário que você possua uma loja virtual na VTEX e também que ela possua instalado o Google Tag Manager. 


Primeiramente realize a validação de propriedade de domínio de sua página para que seja possível gerar o script base de nossa ferramenta. 


Uma vez validada a propriedade do domínio, disponibilizaremos o script de pós-clique para download. 




No Google Tag Manager, crie uma nova TAG para a inclusão deste código baixado. 


Selecione o tipo de Tag "HTML personalizado" .



Inclua as tags de Script: <script> </script>  e após inclua o código baixado no sistema dentre essas tags. 




Caso utilize a plataforma Dinamize Mail, o script que irá inserir será maior, conforme exemplo abaixo.





Dê um nome para sua TAG (para sua identificação futura), e selecione a opção de acionamento "Exibição de Todas as páginas".





Salve sua Tag. 



Agora, realize a criação de seu fluxo de automação de Abandono de Carrinho.



Após configurar seu email de abandono de carrinho, salve sua automação e clique em Ação > Instruções. 




Nessas instruções você deve verificar a parte inicial disponibilizada, que será como seu site está cadastrado conosco e a hash (código) de sua automação. 





Com essa informação é necessário adicione uma nova tag no Google Tag manager e deve ser acionado na chamada cart-to-orderform


<script>
//acionadorcart-to-orderform
var cart_data_ar = $("body").data("cart_data_ar");
if (typeof cart_data_ar === "undefined"){
$("body").data("cart_data_ar",[]);
}
cart_data_ar = $("body").data("cart_data_ar");


$("tr.product-item").each(function(){

//cliente
var cmp1 = "";
var cmp2 = "";
cmp1 = $(".email").text().trim();
cmp2 = $("#client-first-name").val().trim();


//produto
var id = $(this).attr("data-sku");
var amount = $(this).find(".quantity span").text();
var image = "http:" + $(this).find(".product-image img").attr("src").replace('-65-54/','-180-180/');
var link = $(this).find(".product-image a").attr("href");
var name = $(this).find(".product-image img").attr("alt");
var unitary_value = $(this).find(".new-product-price").text();

var cart_data = [{"amount":amount,"id":id,"image":image,"link":link,"name":name,"description":name,"unitary_value":unitary_value}];
console.log(cart_data);

if(cmp1!=""){
 //é necessário gerar essa linha a partir da automação no Dinamize Automation ou Dinamize Mail
_dAutomationGtmAddTimer("meudominio.com.br", "minhahash",


{"cmp1":cmp1, "cmp2":cmp2, "cart_data":cart_data});

}else{
cart_data_ar.push(cart_data);
$("body").data("cart_data_ar",cart_data_ar);
}


});

</script>


O acionador precisa ser configurado conforme print abaixo.



________________________


Adicione uma nova Tag para ser acionado quando os contatos que não estão logados. Nesse exemplo de código devem ser chamados nas páginas de checkout/#/payment e no checkout/#/profile


Substitua o seudominio.com.br pelo domínio do seu site.


<script>

//chamar no checkout/#/payment e no checkout/#/profile

  console.log("aqui");

  if(location.href=="https://www.seudominio.com.br/checkout/#/email"){

  jQuery("#btn-client-pre-email").click(function(){

        console.log("clicou");

var cmp1 =  jQuery(".email").text().trim();

if(cmp1!=""){

   var cart_data_ar = $("body").data("cart_data_ar");

   if (typeof cart_data_ar !== "undefined"){

 for (var i in cart_data_ar) {

 cart_data = cart_data_ar[i];


         //é necessário gerar essa linha a partir da automação no Dinamize Automation ou Dinamize Mail

 _dAutomationGtmAddTimer("meudominio.com.br", "minhahash",


                                {"cmp1":cmp1, "cart_data":cart_data});

 }

   }

cart_data_ar=[];

     jQuery("body").data("cart_data_ar",[]);

}

  

  

  });

   

}


 </script>



O acionador precisa ser configurado conforme print abaixo.



________ 


A última parte do script da instrução é a funcionalidade que deverá ser chamada quanto o cliente finaliza a compra com sucesso no seu site, desta forma, ele não receberá o email de abandono de carrinho. 





Adicione uma nova tag com o script da segunda parte da instrução e adicione o acionador na página onde há a confirmação da compra efetuada pelo cliente.