Manual de Integração Via Gadget. Passo a passo para realizar a integração entre websites e a plataforma Virtual Target.

Transcrição

1 Manual de Integração Via Gadget Passo a passo para realizar a integração entre websites e a plataforma Virtual Target.

2 Manual de Integração Via Gadget 1. Introdução 1.1. O que é? Virtual Target Gadgets são pequenos componentes da plataforma Virtual Target que podem ser adicionados a qualquer website acrescentando novas funcionalidades de forma simples e rápida. Também pode ser considerado uma alternativa para modelos de integração através de webservice que requer um pouco mais de esforço e envolvimento de desenvolvedores experientes Compatibilidade Os gadgets são componentes escritos em HTML e Javascript, oferecendo compatibilidade com os browsers mais utilizados no mercado, tais como Mozilla Firefox e Internet Explorer Método de requisição O método de requisição ao gadget permite o tratamento do resultado da requisição de maneira assíncrona, tornando o processamento das informações transparente para o usuário final. Este formato é bastante funcional porque é possível validar as informações antes de salvá-las em seu sistema local. Em um processo de opt-in, por exemplo, teoricamente não é preciso se preocupar com a validação da sintaxe do , uma vez que esta é feita pelo próprio gadget. 2. Gadgets 2.1. Opt-in 1. Incluir no código fonte HTML de seu formulário a biblioteca Javascript com o comando abaixo: <script type= text/javascript src= language= javascript ></script> 2. Definir os atributos abaixo:

3 <script type= text/javascript language= javascript > // Informa o ID do formulário que deverá ser submetido VTG.FormId = formnewsletter ; // Esta chave é gerada na plataforma Virtual Target e é individual para cada formulário VTG.Key = I7ul1Zn88c7i2gwcw0R5/LlaUnipBXPEWvkUIHQLNId1TepaIwOzuCQQfMsK pm1edmilhjxrwstpfxgueaurtgwzsrdihfp068pmin9uhdgd7prtnkepemm6fsmfhobk 5XfgThmEKfcGhIx4yJ1JzkTb2r9VlRnjXMPCIctZYHQ= ; // Caso seja necessário imprimir um eventual erro na tela, descomentar a linha abaixo: // VTG.Debug = true; // Caso seja necessário incluir o contato em mais de 1 lista ou em uma lista diferente da lista // configurada na chave, descomentar a linha abaixo e colocar os ids das listas em que o contato será incluído. Os ids devem estar entre aspas e separados por vírgula. // VTG.ListId = Array( 1, 2, 3 ); // Nome da função de callback (caso a função não exista, irá gerar um erro de javascript) // O nome da função deve estar sem aspas VTG.Callback = FuncaoCallback; function FuncaoCallback(codigo, mensagem) { if (parseint(codigo) == 1) { // Código a ser executado caso o contato seja salvo com sucesso // Ex: submit do formulário para um script local else { // Código a ser executado caso ocorra algum erro </script> 3. Definir os códigos dos campos adicionais na plataforma Virtual Target. Os códigos são apelidos que fazem a ligação de cada campo do cadastro de um contato, na plataforma, com aplicações externas. Na figura exemplar abaixo, podemos verificar que os seguintes códigos estão configurados: NOME, , CELULAR, NASCIMENTO, TIPO, EMPRESA, CIDADE.

4 4. Definir os campos do formulário que deverão ser enviados à plataforma Virtual Target. O único campo obrigatório é o campo . Deve ser adicionado um novo atributo vtid a cada um dos campos, e este deverá ter o mesmo nome da tag do campo adicional configurado na plataforma Virtual Target: <form name= formnews id= formnewsletter action=? method= post > <label>seu nome:</label> <input type= text name= nome id= nome vtid= NOME maxlength= 20 /> <br/> <label> </label> <input type= text name= id= vtid= maxlength= 20 /> <br/> <label>tipo de cadastro:</label> <input type= radio name= tipocliente id= tipocliente vtid= TIPO value= F />Pessoa Física <input type= radio name= tipocliente id= tipocliente vtid= TIPO value= J />Pessoa Jurídica <br/> <label>nome da empresa:</label> <input type= text name= razaosocial id= razaosocial vtid= EMPRESA maxlength= 20 /> <br/> <input type= button value= Confirmar onclick= javascript:vtg.vtg_submit(null); > </form>

5 5. Note que no exemplo acima não foi utilizado um botão de tipo submit e sim de tipo button que faz a chamada ao gadget com o comando javascript:vtg.vtg_submit();. A tabela abaixo descreve os possíveis códigos de retorno passados à função de callback Opt-out 1.Incluir no código fonte HTML de seu formulário a biblioteca Javascript com o comando abaixo: <script type= text/javascript src= language= javascript ></script> 2.Definir os atributos abaixo 3. Definir os campos do formulário que deverão conter os motivos que levaram o usuário final a realizar o opt-out: <script type= text/javascript language= javascript > /* INÍCIO DA CONFIGURAÇÃO DE PARÂMETROS COMUNS PARA INTEGRAÇÃO */ VTG.SubmitType = ajax ; // Esta chave é gerada na plataforma Virtual Target e é individual para cada formulário VTG.Key = I7ul1Zn88c7i2gwcw0R5/LlaUnipBXPEWvkUIHQLNId1TepaIwOzuCQQ fmskpm1edmilhjxrwstpfxgueaurtgwzsrdihfp068pmin9uhdgd7prtnkepemm6f SmFHoBK5XfgThmEKfcGhIx4yJ1JzkTb2r9VlRnjXMPCIctZYHQ= ; // Caso seja necessário imprimir um eventual erro na tela, descomentar a linha abaixo: // VTG.Debug = true;

6 /* FIM DA CONFIGURAÇÃO DE PARÂMETROS COMUNS */] /* Existem duas opções para opt-out: - Enviar código do envio, código do contato e motivos de opt-out - Enviar somente o do contato Se for passado as 4 informações, irá prevalecer a primeira, que utiliza código do envio, código do contato e motivos. Será ignorado o . Para enviar somente o , o código do envio, código do contato e motivos devem estar comentados */ /* Parâmetros do método 1: enviar código do envio, código do contato e motivos */ // Esse parâmetro define qual o envio originou esta ação de opt-out VTG.EnvioId = 234; // Esse parâmetro define qual o contato será adicionado ao black list VTG.ContatoId = ; // Esse parâmetro define os nomes dos objetos de formulário que conterão os motivos que levaram o usuário final a realizar o opt-out VTG.FormMotivosName = Array( motivo1, motivo2, motivo3, motivo4, motivo5 ); /* FIM dos parâmetros do método 1 */ /* Parâmetros do método 2: enviar somente . Comentar os parâmetros acima */ // Se utilizar esse parâmetro, deverá ser comentado os 3 parâmetros acima (EnvioId, ContatoId // e FormMotivosName) // VTG. = @dominio.com ; /* FIM dos parâmetros do método 2 */ /* INÍCIO DOS PARÂMETROS ESPECÍFICOS PARA INTEGRAÇÃO VIA AJAX */ // Nome da função de callback (caso a função não exista, irá gerar um erro de javascript) // O nome da função deve estar sem aspas VTG.Callback = FuncaoCallback;

7 function FuncaoCallback(codigo, mensagem) { if (parseint(codigo) == 1) { // Código a ser executado caso o contato seja salvo com sucesso // Ex: submit do formulário para um script local else { // Código a ser executado caso ocorra algum erro </script> 3. Definir os campos do formulário que deverão conter os motivos que levaram o usuário final a realizar o opt-out: <form name= formoptout id= formoptout action=? method= post > <label>a freqüência dos envios é muito alta</label> <input type= checkbox name= motivo1 id= motivo1 value= Freqüencia /> <br /> <label>o conteúdo não me interessa:</label> <input type= checkbox name= motivo2 id= motivo2 value= Conteúdo /> <br /> <input type= button value= Confirmar onclick= javascript:vtg.vtg_submit(); /> </form> 4. Note que no exemplo acima não foi utilizado um botão de tipo submit e sim de tipo button que faz a chamada ao gadget com o comando javascript:vtg.vtg_submit();. A tabela abaixo descreve os possíveis códigos de retorno passados à função de callback

8 Os parâmetros VTG.EnvioId e VTG.ContatoId devem ser enviados no com a utilização de campos dinâmicos. Veja um exemplo abaixo de como deve ser configurado o link, no HTML do , de direcionamento para a página de opt-out: <ahref= target= _blank >Acesse este link para cancelar o recebimento de futuros comunicados</a> Caso precise recuperar estes parâmetros da URL diretamente através do Javascript utilize o código abaixo: <script type= text/javascript language= javascript > // Leitura da URL var url = parent.document.url; // Extrai valor numérico do parâmetro contatoid if(url.match(/contatoid=(\d+)/)){ var contatoid = parseint(regexp.$1); // Extrai valor numérico do parâmetro envioid if(url.match(/envioid=(\d+)/)){ var envioid = parseint(regexp.$1); </script> O parâmetro VTG.FormMotivosName é opcional e permite uma visão mais ampla dos resultados de sua campanha, uma vez que nos relatórios de opt-out constarão os motivos mais comuns que levam seus destinatários ao desinteresse pela comunicação.

9 Rua Bandeira Paulista, º andar São Paulo SP Brasil Fale com a gente contato@virtualtarget.com.br Descubra tudo sobre a Experian Virtual Target virtualtarget.com.br Acompanhe-nos no Facebook facebook.com/experianvirtualtarget Siga-nos no Twitter twitter.com/virtualtarget Experian Marketing Services A Experian Marketing Services oferece ao mercado um portfólio de soluções completas para entendimento, prospecção, rentabilização e fidelização de clientes. Entre elas, as melhores práticas e ferramentas tecnológicas para marketing direto, marketing analítico e marketing digital.