Neste guia, você encontrará todas as informações necessárias para integrar seu site com Connectif, desde entender quais tipos de sincronização são mais comuns e descobrir qual se adapta melhor às suas necessidades técnicas e de negócios, até aprender como verificar se a conexão entre o eCommerce e Connectif está funcionando corretamente.
Como fazer uma integração personalizada do seu eCommerce com Connectif?
O tipo de integração com Connectif que você fará dependerá das suas necessidades e do tipo de página da web, bem como dos recursos técnicos disponíveis, então conhecer todas as formas e etapas de implementação ajudará você a ter uma visão completa e escolher a melhor para o seu eCommerce.
1. Escolha e implementação da integração adequada
A maneira mais simples de sincronizar o eCommerce com Connectif é através de um dos módulos já existentes para as diferentes plataformas, atualmente disponíveis para:
Se você estiver usando algum dos CMS acima, não é necessário continuar com este artigo. Basta instalar o módulo na loja e ativá-lo seguindo as etapas indicadas na documentação correspondente.
O que fazer se a loja não estiver na lista acima?
Se a sua loja online não utilizar nenhum dos CMS acima, você precisará implementar uma integração personalizada.A seguir estão quatro formas possíveis de fazer isso, o que pode ser integrado em cada caso e os passos para concluir a sincronização.
Para realizar esse tipo de integrações, você precisará de um especialista com conhecimentos de programação. Pode ser necessário combinar os métodos de integração personalizada para enviar todos os tipos de eventos.
| Tipo de evento | Renderizado no servidor | Renderizado no cliente | Integração via JavaScript | Integração via API |
|---|---|---|---|---|
| Informações do contato | ||||
| Atividade do contato | ||||
| Catálogo de produtos | ||||
| Compras | ||||
| Cupons |
1.1. Integrando através de tags HTML renderizadas no servidor
Por que escolher este método?
Integrar através de tags HTML renderizadas no servidor é, provavelmente, o método mais ágil para enviar informações para Connectif de forma personalizada. Consiste em gerar e exibir essas tags nas páginas correspondentes de forma que os dados que elas contêm sejam enviados automaticamente para Connectif.
O que pode ser integrado?
Utilizando este método, é possível integrar todas as tags HTML, bem como sincronizar o catálogo de produtos.
O que deve ser considerado?
Para que a integração com tags HTML funcione corretamente, é necessário que ocorram mudanças de página e de URL quando um contato navega pelo site. Portanto, essa forma de integração será recomendada para sites que não sejam Single Page Application (SPA) e que tenham a possibilidade de renderizar o HTML no servidor.
Aprenda como integrar usando tags HTML renderizadas no servidor neste artigo.
1.2.Integrando através de tags HTML renderizadas no cliente
Por que escolher este método?
Integrar usando tags HTML renderizadas no cliente é a opção que mais se ajusta se usar o Google Tag Manager e dataLayer, ou se quiser enviar informações para o Connectif usando tags HTML sem renderização no servidor.
O que pode ser integrado?
Usando este método, é possível integrar todas as tags HTML, mas não é possível sincronizar o catálogo de produtos. Existem duas opções para integrar o catálogo:
- Gerando a tag HTML "cn_product_visited" no servidor.
- Desativando a verificação automática de produtos e sincronizando-os via API.
O que deve ser considerado?
Da mesma forma que ocorre com as tags HTML renderizadas no servidor, este método não funcionará corretamente se não houver mudança de página e de URL quando um contato navega pelo site. Portanto, esta forma de integração é adequada para sites que não são Single Page Application (SPA).
Aprenda como integrar tags HTML renderizadas no cliente neste link.
1.3. Integrando através do envio de eventos JavaScript
Por que escolher este método?
Integrar através de eventos JavaScript é a forma mais avançada e que permite mais controle sobre quando enviar os eventos que rastreiam as informações do contato. Especialmente indicado para Single Page Applications (SPA) que precisam controlar quando ocorre uma mudança de página para enviar o evento “page-visit”.
O que pode ser integrado?
Usando este método, é possível integrar todos os eventos JavaScript, mas não é possível sincronizar o catálogo de produtos. Existem duas opções para integrar o catálogo:
- Gerando a tag HTML "cn_product_visited" no servidor.
- Desativando a verificação automática de produtos e sincronizando-os via API.
O que deve ser considerado?
Também é possível enviar notificações personalizadas usando este método, através da criação de uma notificação personalizada para receber dados no Connectif.
Aprenda como integrar através do envio de eventos JavaScript neste link.
1.4. Integrando através da API do Connectif
Por que escolher este método?
Integrar através da API é o método que permite controle total sobre os dados enviados, possibilitando, por exemplo, enviar uma compra uma vez que tenha sido verificada no backend, ou sincronizar alterações nos produtos no momento em que são atualizados na loja.
Este é o único método que permite enviar o evento de compra no momento em que é confirmado, sem a necessidade de esperar o contato visitar a página novamente.
O que pode ser integrado?
Usando este método, é possível integrar Contatos, Produtos, Compras e Cupons. Os demais eventos devem ser enviados por qualquer um dos outros métodos apresentados:
- Renderizando tags HTML no servidor.
- Renderizando tags HTML no cliente.
- Configurando o envio de eventos JavaScript.
O que deve ser considerado?
É importante notar que a API tem um limite de 100 solicitações por minuto (limite de taxa), então se houver uma sincronização com um envio em massa de dados, é recomendável revisar a API do Connectif.
Aprenda como integrar através da API neste link.
2. Ajuste da configuração no Connectif
Uma vez que você esteja enviando informações para o Connectif a partir da sua loja online, você precisará revisar o estado da configuração da integração web e a configuração de comércio eletrônico:
-
Revisar a configuração da integração web no Connectif.
Aqui são configurados os domínios autorizados para enviar informações para a conta do Connectif e o comportamento do script do Connectif em relação à sua inicialização. -
Revisar a configuração da integração de comércio eletrônico no Connectif.
Aqui são configuradas a sincronização e verificação de produtos, dependendo do método escolhido para enviar essas informações ao Connectif. -
Autenticar o domínio de e-mail. Aqui é validado o domínio ou domínios a partir dos quais os e-mails dos fluxos de trabalho serão enviados. Sem esta etapa, os e-mails não podem ser enviados.
3. Verificação da sincronização
Uma vez que a integração esteja feita e antes de ser lançada em produção, é necessário verificar se todos os eventos estão sendo enviados corretamente. Para verificar a sincronização, você precisará simular a interação de um contato no site e confirmar se toda a atividade é registrada no Connectif.
Aprenda como verificar se sua integração está pronta neste link.
Parabéns!
Você chegou ao final da lição.
Perguntas frequentes
Tem dúvidas sobre algum dos processos? Aqui você encontrará informações úteis:
1. O que fazer se seu carrinho é atualizado por AJAX?
Nesse caso, você precisará configurar o evento AJAX do carrinho, para indicar as alterações no carrinho de compras sem a necessidade de recarregar a página.
Aprenda como configurar o envio de carrinho por AJAX neste link.
2. Como os sistemas de cache afetam sua integração personalizada?
O Connectif é uma ferramenta de personalização e, como tal, busca melhorar a experiência do contato que navega pelo seu site, adaptando o conteúdo que é mostrado e, ao mesmo tempo, coletando informações para aumentar o conhecimento que você tem sobre seus clientes.
Por esse motivo, é muito importante controlar quais partes da página são armazenadas, de modo que a personalização ainda seja permitida. Nesse sentido, existem dois tipos de cache, dependendo de onde na página é feito o cache e quando é atualizado:
- Cache de página
São sistemas que retornam o mesmo conteúdo para todos os visitantes, baseando-se apenas na URL que estão visitando. Seu uso é desencorajado, pois não é compatível com a personalização permitida pelo Connectif.
Por exemplo, se houver um cache de página na página inicial, embora um contato registrado visite páginas de produto e suas visitas e carrinhos sejam registrados, quando ele voltar à página inicial, essas informações de contato e seu carrinho não serão enviados para essa página, portanto, essa visita criará um novo contato anônimo. Ou, ainda, informações de outro contato com outro carrinho podem ser armazenadas em cache e misturadas.
- Cache de blocos
São sistemas que permitem armazenar em cache certas partes da página, de modo que outros blocos de HTML sejam sempre gerados ao visitar a página. Esse tipo de cache é compatível com o Connectif, já que as partes estáticas podem ser armazenadas em cache, enquanto as partes que o Connectif utiliza para personalizar e coletar informações não estarão e continuarão funcionando corretamente.
Por exemplo, se houver vários blocos HTML em cache na página inicial, quando um contato estiver navegando pelo site e adicionando produtos ao carrinho e voltar para a página principal, o bloco HTML onde as tags "cn_client_info" e "cn_cart" são renderizadas não estarão em cache e, portanto, as informações do contato serão enviadas corretamente.
3. Como enviar eventos personalizados?
Para enviar eventos personalizados, você precisará criar uma integração para receber dados no Connectif e criar a notificação via JavaScript.
Aprenda como criar um evento personalizado no Connectif neste link.
4. Quais navegadores suportam o script do Connectif?
A compatibilidade do JavaScript do Connectif com diferentes navegadores é baseada na quota de mercado deles.
O Connectif distingue, através da lista de navegadores, aqueles que têm mais de 2% de participação no mercado para dar suporte. Essas informações são obtidas de https://caniuse.com/usage-table.
Para garantir amplo suporte e, ao mesmo tempo, otimizar o tamanho do JavaScript e seu carregamento no navegador dos contatos, o Connectif usa Babel para garantir compatibilidade.
Navegadores como o Internet Explorer, que têm menos de 1,5% de uso globalmente, atualmente não são suportados.
Ainda tem dúvidas não resolvidas?
Lembre-se de que você tem à sua disposição nossos especialistas em Connectif. Para contatá-los, basta abrir um ticket de Suporte clicando no botão azul "Ajuda" no seu painel.
Continue aprendendo!
Para aproveitar todo o potencial de sua conta no Connectif, recomendamos continuar com os seguintes artigos:
-
Onboarding, para adquirir habilidades com nossa interface.
-
Workflows iniciais, para implementar suas primeiras estratégias na conta.
-
Integrações com sistemas externos, para se integrar com Facebook, formulários e webhooks do seu site.
-
Documentação da API do Connectif, para encontrar todas as chamadas de API disponíveis.