VTEX TRIGGER ABANDONED CART TEMPLATE DO . VTEX On-line Applications

Tamanho: px

Começar a partir da página:

Download "VTEX TRIGGER ABANDONED CART TEMPLATE DO E-MAIL. VTEX On-line Applications"

Margarida Belmonte Fialho
8 Há anos
Visualizações:

2014 VTEX On-line Applications VTEX TRIGGER ABANDONED CART TEMPLATE DO E-MAIL "A real vantagem

ser capaz de transformar rapidamente esse conhecimento em ação.

1 2014 VTEX On-line Applications VTEX TRIGGER ABANDONED CART TEMPLATE DO "A real vantagem competitiva de uma empresa consiste em ter informação sobre seus clientes que a concorrência não tem e ser capaz de transformar rapidamente esse conhecimento em ação. Ganha quem consegue estabelecer relacionamentos dominantes em seu mercado. Artigo de Don Peppers e Martha Rogers da Revista HSM Management de maio/jun

2 1. TEMPLATES: Acessar o Admin da Loja Acessar o Portal: Configurações Páginas de Vitrine(V2) Criar o template de Prateleira Criar o Template de Página Criar o Layout REQUISITOS: Montar o html com estrutura para ; O código deve conter a tag : A URL do Template do criado ficará da seguinte forma: Para minimizar as dúvidas na criação dos Templates, utilizar os códigos modelos (Anexo I e II); Os links devem conter as informações de utm na query string, com escapamento do "&": utm_source=vtexcem&utm_medium=abandono_carrinho&utm_campaign=abandono; Para exibir "Olá, Fulano", utilizar o código: [[Olá, {!Nome}!]]; Utilizar o seguinte código para exibir os produtos: Utilizar o seguinte código no botão para direcionar o Cliente direto para o carrinho com todos os produtos: ANEXOS: ANEXO I: TEMPLATE DE PRATELEIRA: ANEXO II: TEMPLATE DE PÁGINA: de fevereiro de

3 1. TEMPLATES: 1.1 Acessar o Admin da Loja 1.2 Acessar o Portal: Configurações Páginas de Vitrine(V2) 1.3 Criar o template de Prateleira ANEXO I Depois de salvar o Template de Prateleira será gerado seu Id, no exemplo acima o Id desse Template de Prateleira é: bc7ad1a2-9aa3-445e-b6fe-b7986cf1f44a. 6 de fevereiro de

4 1.4 Criar o Template de Página ANEXO II 1.5 Criar o Layout Obs.: Não precisa fazer nenhuma configuração na aba Configuração. 6 de fevereiro de

5 2. REQUISITOS: 2.1 Montar o html com estrutura para ; 2.2 O código deve conter a tag : <html xmlns=" HYPERLINK " xmlns:vtex=" xmlns:vtex.cmc=" 2.3 A URL do Template do criado ficará da seguinte forma: Para minimizar as dúvidas na criação dos Templates, utilizar os códigos modelos (Anexo I e II); 2.5 Os links devem conter as informações de utm na query string, com escapamento do "&": utm_source=vtexcem&utm_medium=abandono_carrinho&utm_campaign= Abandono; 2.6 Para exibir "Olá, Fulano", utilizar o código: [[Olá, {!Nome}!]]; 2.7 Utilizar o seguinte código para exibir os produtos: <vtex.cmc:productquerystringreferenceshelf layout="bc7ad1a2-9aa3-445e-b6fe-b7986cf1f44a" itemcount="100" columncount="3" showunavailable="true" istrackable="true" InternalCampaign="Carrinho abandonado" InternalPart="Prateleira destaque"/>. O campo "layout" deve conter o Id do Template de Prateleira que foi criado (item 1.3). 2.8 Utilizar o seguinte código no botão para direcionar o Cliente direto para o carrinho com todos os produtos: <a href=" VTEX&utm_ campaign=abandono > Obs.: os produtos são sempre exibidos na tela dentro de uma estrutura de UL + LI. 6 de fevereiro de

6 3. ANEXOS: 3.1 ANEXO I: TEMPLATE DE PRATELEIRA: #set($id = $product.id) #set($uri = $product.uri) #set($escapedname = $product.htmlescapedname) #set($evaluationrate = $product.evaluationrate) <table width="100%"> <tr> <td valign="top" width="150"><p align="left" style="margin-top:0;"><a href="$uri?utm_source=vtexcem&utm_medium=abandono_carrinho&utm_campaign=abandono">$product.getimagetag(2)</a></p></td> <td valign="middle" align="left" width="300"> <a href="$uri?utm_source=vtexcem&utm_medium=abandono_carrinho&utm_campaign=abandono" style="text-decoration:none;"> <strong><font size="3" color="#ba0046" face="arial, Helvetica, sans-serif" style="text-align:left;"> <p style="margin-left:30px;">$product.name</p> </font></strong> </a> <p style="margin-left:30px;"> #if ($product.hasbestprice) <font color="#333333" face="arial, Helvetica, sans-serif" size="2" style="text-align:left;" >De: <del>$product.listprice</del></font> <br /> #end <font color="#333333" face="arial, Helvetica, sans-serif" size="2" style="text-align:left;" >Por:</font> <font color="#333333" face="arial, Helvetica, sans-serif" size="2" style="text-align:left;"> <strong>$product.bestprice</strong> <font color="#333333" size="2" face="arial, Helvetica, sansserif"> #if ($product.numbersofinstallment > 1) ${product.numbersofinstallment}x de $product.installmentvalue #else à vista #end </font> </font> </p> <p style="margin-left:30px;"><a href="$uri?utm_source=vtexcem&utm_medium=abandono_carrinho&utm_campaign=abandono"><img src=" alt="comprar" width="177" height="36" border="0"/></a></p> </td> Obs1.: Para usar esse exemplo de código, basta alterar o endereço da imagem do botão comprar que está destacado em vermelho. Obs2.: Se desejar alterar o tamanho da imagem do produto, altere na tag product.getimagetag. 6 de fevereiro de

7 3.2 ANEXO II: TEMPLATE DE PÁGINA: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " <html xmlns=" xmlns:vtex=" xmlns:vtex.cmc=" <head> <title>aproveite a oportunidade e finalize sua compra!</title> <meta http- equiv="content-type" content="text/html; charset=iso " /> </head> <body> <table width="100%" height="100%" cellspacing="0" cellpadding="0" border="0" align="center"> <tr> <td><table width="697" cellpadding="0" cellspacing="0" border="0" href=" target="_blank" style="text-decoration:none" alt="compre AGORA" title="compre AGORA"><img src=" alt="dominioloja.com.br" width="697" height="131" border="0" style="display:block" /></a></td> <table width="697" cellpadding="0" cellspacing="0" border="0" href=" target="_blank"><img src=" width="228" height="23" border="0" /></a></td> href=" target="_blank"><img src=" width="203" height="23" border="0" /></a></td> href=" target="_blank"><img src=" width="151" height="23" border="0" /></a></td> href=" utm_campaign=abandono" target="_blank"><img src=" width="115" height="23" border="0" /></a></td> <table width="697" cellpadding="0" cellspacing="0" border="0" href=" target="_blank" style="text-decoration:none" alt="compre AGORA" title="compre AGORA"><img src=" alt="dominioloja.com.br" width="697" height="232" border="0" style="display:block" /></a></td> <table background=" width="697" cellpadding="0" cellspacing="0" border="0" align="center"> <tr> <td style="padding:20px 60px 20px 60px"><font face="verdana" size="3" color="#5f5f5f"><b>[[olá, {!Nome}!]],</b></font><font face="verdana" size="2" color="#5f5f5f"><b><br/> <br/> Confira os produtos escolhidos por você.</b></font></td> <table cellpadding="0" cellspacing="0" border="0" <td background=" layout="44c0752d-c4bd- 4c3e-b186-97e15cd3f52d" itemcount="100" columncount="100" showunavailable="true" istrackable="true" InternalCampaign="Carrinho abandonado" InternalPart="Prateleira destaque"/></td> <tr> href=" " target="_blank" style="text-decoration:none" alt="compre AGORA" title="compre AGORA"><img src=" alt="dominioloja.com.br" width="697" height="75" border="0" style="display:block" /></a></td> 6 de fevereiro de

8 <table width="697" cellpadding="0" cellspacing="0" border="0" href=" src=" alt="dominioloja.com.br" width="697" height="148" border="0" style="display:block" /></a></td> <table width="697" cellpadding="0" cellspacing="0" border="0" <td align="center"><p><font color="#666666" size="1" face="verdana, Arial, Helvetica, sans-serif"><strong>política DE PRIVACIDADE</strong></font></p> <p><font color="#666666" size="1" face="verdana, Arial, Helvetica, sansserif">nos comprometemos com a privacidade e a segurança dos clientes. Por isso, não divulgamos seus dados cadastrais para terceiros, exceto quando estas informações são necessárias para o processo de entrega, cobrança ou participação em promoções que o cliente tenha solicitado.</font></p> <br /> <br /></td> </td> </body> </html> 6 de fevereiro de

Documentos relacionados

1) Crie uma nova página chamada Exercício.html e deixe-a com o seguinte layout:

Exercícios: 1) Crie uma nova página chamada Exercício.html e deixe-a com o seguinte layout: a) O cabeçalho Sistema de Órgãos Colegiados deve ter tamanho 3 e ficar centralizado. b) Após o cabeçalho incluir