Guia para integrar com VTEX IO

Se sua loja virtual está desenvolvida em VTEX IO, você poderá sincronizá-la com sua conta Connectif em poucos minutos e começar a coletar dados de interação dos seus contatos na página web.

Neste artigo, você aprenderá como integrar sua loja VTEX IO com a Connectif

 
Tempo de implementação: 20 min.
Dificuldade: Baixa.
Quando usar: Ao abrir sua conta na Connectif.

 

Passo 1. Download do aplicativo

  1. Acesse o seguinte link: Connectif na VTEX App Store.
  2. Clique no botão Obter App na parte superior direita.

VTEX_IO_Integracao_-_2-min.png

  1. Faça login na VTEX IO.

VTEX_IO_Integracao_-_3.png

  1. Confirme o pedido seguindo as instruções da VTEX.
  2. Clique em Finalizar compra.

VTEX_IO_Integracao_-_4.png

 

Passo 2. Instalação do módulo

  1. Clique no botão Ir para a página de instalação.

VTEX_IO_Integracao_-_5.png

  1. Na próxima tela, revise as permissões necessárias do módulo Connectif e clique em Instalar.

VTEX_IO_Integracao_-_6.png

 

Passo 3. Ativação do App VTEX

a. Requisitos prévios

(Nesta seção serão explicados os passos para criar uma Chave de aplicativo, necessária para realizar a ativação do VTEX App Connectif.)

  1. Em sua conta VTEX, vá para "Configurações da conta > Configurações da conta > Funções do usuário" e clique em Nova função.

VTEX_IO_Integracion_-_17.png

  1. Atribua as seguintes permissões à função: 
    • Product Catalog > Content, Admin, Marketing, Configuration, Commercial, Miscellaneous, Reports, Marketplace, Collection.
    • Product License Manager > Services Access Control > Get account by identifier.
    • Product Checkout > CheckoutResources.
    • Product OMS > OMS Acccess > Change order workflow status , Notify payment, Notify invoice, View order, Notify refund, Order feed subscription, View store sales stats, List Orders.
    • Product Master Data > Generic resources, Application, Comment, Customized Search, Form, Import.
    • Product Dynamic Storage > Dynamic storage generic resources > Read only documents, Master Data administrator, Full access to all documents.
    • Product Dynamic Storage > Data entity > List data entity, Create data entity, Edit schema, View data entity details, Publish index.

VTEX_IO_Integracion_-_16.png

  1. Acesse "Configurações da conta > Configurações da conta > Chaves de aplicativo" e clique em  Adicionar.

VTEX_IO_Integracion_-_18.png

  1. No painel de criação da nova Chave de aplicativo, clique em  Adicionar funções.

VTEX_IO_Integracion_-_19.png

  1. Atribua o novo papel configurado para Connectif.

VTEX_IO_Integracion_-_20.png

  1. Clique em Salvar.

VTEX_IO_Integracion_-_21.png

 

b. Ativação do aplicativo 

(Nesta seção serão indicados os dados identificativos da conta para ativar na VTEX IO o aplicativo da Connectif.)

  1. Acesse sua conta da Connectif e, nas configurações da Loja, em "Integrações > Plataformas de e-commerce", clique em  Editar sobre VTEX.

Integración con VTEX IO - 0-min.png

  1. Copie o ID do Cliente e a Chave Secreta.

Integración con VTEX IO - 1-min.png

  1. Vá para sua conta da VTEX IO e entre em "Apps instalados > Connectif > Configuração".
  2. Preencha os campos com as seguintes informações:
  • Client ID: adicione o valor do Identificador do Cliente de sua conta da Connectif, disponível em "Configurações da Loja > Plataformas de e-commerce > VTEX".
  • Private key: adicione o valor da Chave Secreta de sua conta da Connectif, disponível em "Configurações da Loja > Plataformas de e-commerce > VTEX".
  • VTEX Key e VTEX Token: adicione os valores correspondentes obtidos em Application Keys para o papel da Connectif.

VTEX_IO_Integracion_-_7.png

  1. (Opcional) Selecione os canais de venda com os quais deseja que a Connectif sincronize as compras. Por padrão, todas as compras serão registradas.
  2. Clique em Ativar para salvar as alterações.

 

c. Verificação da integração

(Nesta seção, será revisada a configuração da URL da loja no Connectif.) 

  1. Acesse sua conta no Connectif.
  2. Nas configurações da loja, vá para "Integrações > Plataformas de e-commerce" e, na VTEX IO, clique em  Editar.
  3. Verifique se o Domínio da Loja corresponde a um domínio público e acessível do seu site.

Integración con VTEX IO - 5-min.png

  1. Nas configurações da loja, vá para "Canais > Notificações Web Push".
  2. Modifique a URL do ServiceWorker para corresponder a um domínio público e acessível da sua loja.

Integración con VTEX IO - 2-min.png

 

Passo 4. Configuração do Connectif na página de Checkout

(Nesta seção, descreve-se como configurar o rastreamento da web na VTEX IO.)

 

VTEX IO possui uma seção de Checkout separada do restante da loja VTEX. Para que o Connectif possa fazer o rastreamento da web e exibir conteúdos durante o processo de confirmação do pedido, é necessário adicionar manualmente um trecho de código do backoffice à seção de checkout.

  1. Acesse as configurações de sua loja VTEX, em "Apps instalados > Connectif", e copie o trecho de código de Checkout código personalizado.

VTEX_IO_Integracion_-_13.png

  1. Acesse "Configuração da loja > Checkout" e clique em  (Editar).

VTEX_IO_Integracion_-_14.png

  1. Vá para a aba Código e modifique o arquivo checkout6-custom.js, adicionando o código copiado:

VTEX_IO_Integracion_-_15.png

 

 

Sucesso!
A integração do Connectif com a VTEX IO está completa.

  

Você pode verificar se integrou corretamente o Connectif com a VTEX IO neste artigo.

 


Perguntas Frequentes

1. Como recuperar carrinhos abandonados com a URL de Recuperação de Carrinho

(Esta seção explica como a URL de Recuperação de Carrinho funciona para recuperar os itens associados a um carrinho específico).

Através da integração com VTEX IO, é enviada ao Connectif uma URL de Recuperação de Carrinho, ou seja, um link para recuperar os itens relacionados a esse carrinho, que pode ser utilizado em fluxos de trabalho e conteúdos.

Para obter a URL de recuperação de carrinho por meio de um fluxo de trabalho, é necessário utilizar os nós "Obter último carrinho" e "Ao abandonar carrinho", mapeando-a posteriormente nas variáveis do conteúdo a ser exibido ou enviado.

  • Saiba como essa URL funciona em diferentes CMS e como utilizá-la neste artigo

 

 


Continue aprendendo!

Para aproveitar todo o potencial de sua conta no Connectif, recomendamos continuar com os seguintes artigos:

Esse artigo foi útil?
Usuários que acharam isso útil: 0 de 0