Integración con VTEX IO

Si tu eCommerce está desarrollado en VTEX IO, podrás sincronizarlo con tu cuenta de Connectif en unos minutos y comenzar a recopilar datos de interacción de tus contactos en la página web.

En este artículo aprenderás cómo integrar tu tienda VTEX IO con Connectif

 
Tiempo de implementación: 20 min.
Dificultad: Baja.
¿Cuándo utilizarlo?: Al abrir tu cuenta en Connectif.

 

Paso 1. Descarga de la aplicación

  1. Accede al siguiente enlace: Connectif en VTEX App Store.
  2. Haz clic en el botón Obtener App en la parte superior derecha.

VTEX_IO_Integracion_-_2-min.png

  1. Haz login en VTEX IO.

VTEX_IO_Integracion_-_3.png

  1. Confirma el pedido siguiendo las instrucciones de VTEX.
  2. Haz clic en Finalizar compra.

VTEX_IO_Integracion_-_4.png

 

Paso 2. Instalación del módulo

  1. Pulsa el botón Ir a la página de instalación.

VTEX_IO_Integracion_-_5.png

  1. En la siguiente pantalla, revisa los permisos necesarios del módulo de Connectif y haz clic en Instalar.

VTEX_IO_Integracion_-_6.png

 

Paso 3. Activación de la App de VTEX

a. Requisitos previos

(En este apartado se van a explicar los pasos para crear una Clave de aplicación, necesaria para poder realizar la activación del VTEX App de Connectif.)

  1. En tu cuenta VTEX, dirígete a "Configuración de la cuenta > Configuración de la cuenta > Roles de usuario" y haz clic en Nuevo Rol.

VTEX_IO_Integracion_-_17.png

  1. Asigna los siguientes permisos al rol: 
    • Product Catalog > Content, Admin, Marketing, Configuration, Commercial, Miscellaneous, Reports, Marketplace, Collection.
    • Product License Manager > Services Access Control.
    • Product Checkout > CheckoutResources.
    • Product OMS > OMS Acccess.
    • Product Master Data > Generic resources, Application, Comment, Customized Search, Form, Import.
    • Product Dynamic Storage > Dynamic storage generic resources > Read only documents.
    • Product Dynamic Storage > Data entity > List, create, edit, remove, view, publish.

VTEX_IO_Integracion_-_16.png

  1. Accede a "Configuración de la cuenta > Configuración de la cuenta > Claves de aplicación" y haz clic en  Agregar.

VTEX_IO_Integracion_-_18.png

  1. En el panel de creación de la nueva Clave de aplicación, haz clic en  Agregar roles.

VTEX_IO_Integracion_-_19.png

  1. Asigna el nuevo rol configurado para Connectif.

VTEX_IO_Integracion_-_20.png

  1. Haz clic en Guardar.

VTEX_IO_Integracion_-_21.png

 

b. Activación de la aplicación 

(En este apartado se van a indicar los datos identificativos de la cuenta para activar en VTEX IO la aplicación de Connectif.)

  1. Accede a tu cuenta de Connectif y, en "Integraciones > ERPs y CRMs > VTEX", haz clic en  Editar.

VTEX_IO_Integracion_-_1.png

  1. Copia el ID de Cliente y la Clave Secreta.

VTEX_IO_Integracion_-_8-min.png

  1. Dirígete a tu cuenta de VTEX IO y entra en "Apps instaladas > Connectif > Configuración".
  2. Rellena el VTEX Key con tu ID de Cliente, y VTEX token con tu Clave Secreta.

VTEX_IO_Integracion_-_7.png

  1. (Opcional) Selecciona los canales de venta con los que te interese que Connectif sincronice las compras. Por defecto se registrarán todas las compras.
  2. Haz clic en Activar para guardar los cambios.

 

c. Verificación de la integración

(En este apartado se va a revisar la configuración de la URL de la tienda en Connectif.) 

  1. Dirígete a tu cuenta de Connectif.
  2. En "Integraciones > VTEX" haz clic en  Editar.
  3. Revisa que el Dominio de la Tienda se corresponde con un dominio público y accesible de tu web.

VTEX_IO_Integracion_-_11.png

  1. En "Integraciones > Web", haz clic en la pestaña Notificaciones Push.
  2. Verifica que la URL del ServiceWorker corresponde con un dominio público y accesible de tu tienda.

VTEX_IO_Integracion_-_12.png

 

Paso 4. Configuración de Connectif en la página de Checkout

(En este apartado se describe cómo configurar el seguimiento web en VTEX IO.)

 

VTEX IO tiene una sección de Checkout separada del resto de la tienda VTEX. Para que Connectif pueda hacer el seguimiento web y mostrar contenidos durante el proceso de confirmación del pedido, es necesario que se añada de forma manual un fragmento de código desde el backoffice a la sección de checkout.

  1. Accede a la configuración de tu tienda VTEX, en "Apps instaladas > Connectif", y copia el fragmento de código de Checkout código personalizado.

VTEX_IO_Integracion_-_13.png

  1. Accede a "Configuración de la tienda > Checkout" y haz clic en  (Editar).

VTEX_IO_Integracion_-_14.png

  1. Dirígete a la pestaña Código y modifica el fichero checkout6-custom.js, añadiendo el código copiado:

VTEX_IO_Integracion_-_15.png

 

 

¡Éxito!
La integración de Connectif con VTEX IO ya está lista.

  

Puedes revisar si has hecho correctamente tu integración de Connectif con VTEX IO en este artículo.

 


¡Sigue aprendiendo!

Para aprovechar todo el potencial de tu cuenta en Connectif, te recomendamos continuar con los siguientes artículos:

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 0 de 0