1. Help Center
  2. Integrate your Store
  3. Integration by module or app
  4. VTEX IO

Guide to Integrating with VTEX IO

Created
Updated
Follow

If your ecommerce platform is based on VTEX IO, you can sync it with your Connectif account in just a few minutes and start gathering data about your contacts’ interactions on the site.

In this article you’ll learn how to integrate your VTEX IO store with Connectif. 

 
Implementation time: 20 min.
Difficulty: Low.
When to use it: When you open your Connectif account.

 

Step 1. Download the application

  1. Access the following link: Connectif in VTEX App Store.
  2. Click the Get App button at the top right.

VTEX_IO_Integracion_-_1.png

  1. Log in to VTEX IO.

VTEX_IO_Integracion_-_2.png

  1. Confirm the order by following the VTEX instructions.
  2. Click Complete purchase.

VTEX_IO_Integracion_-_3.png

 

Step 2. Module installation

  1. Click the Go to installation page button.

VTEX_IO_Integracion_-_4.png

  1. On the next screen, review the required permissions of the Connectif module and click Install.

VTEX_IO_Integracion_-_5.png

 

Step 3. VTEX App Activation

a. Prerequisites

(This section explains how to create an Application Key, which you’ll need to activate the Connectif VTEX App).

  1. In your VTEX account, go to "Account Settings > Account Settings > User Roles" and click New Role.

VTEX_IO_Integracion_-_6.png

  1. Assign the following permissions to the role: 
    • 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_-_7.png

  1. Go to "Account settings > Account settings > Application keys" y and click  Add.

VTEX_IO_Integracion_-_8.png

  1. In the new Application Key creation panel, click  Add roles.

VTEX_IO_Integracion_-_9.png

  1. Assign the new role configured for Connectif.

VTEX_IO_Integracion_-_10.png

  1. Click Save.

VTEX_IO_Integracion_-_11.png

 

b. Activating the application 

(Here you will enter your account identification data to activate the Connectif app in VTEX IO).

  1. Log in to your Connectif account and, under "Integrations > ERPs and CRMs > VTEX", click  Edit.

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

  1. Copy the Client ID and Secret Key.

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

  1. Go to your VTEX IO account and go to "Installed Apps > Connectif > Settings".
  2. Fill in the fields with the following information:
  • Client ID: add the Client Identifier value of your Connectif account, available in "Store Settings > E-commerce Platforms > VTEX".
  • Private key: add the Secret Key value of your Connectif account, available in "Store settings > E-commerce platforms > VTEX".
  • VTEX Key and VTEX Token: add the corresponding values obtained in Application Keys for the Connectif role.

VTEX_IO_Integracion_-_14.png

  1. (Optional) Select the sales channels with which you want Connectif to synchronize purchases. All purchases will be logged by default.
  2. Click OK to save your changes.

 

c. Verifying the integration

(In this section we’ll review the configuration of the store URL in Connectif). 

  1. Access your Connectif account.
  2. In the integrations page, click  Edit.
  3. Check that the Shop Domain corresponds to a domain of your website that is public and accessible.

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

  1. In the Store Settings, “Channels > Web Push Notifications”, modify the ServiceWorker URL to match a public and accessible domain of your store.

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

 

Step 4. Configuring Connectif in the Checkout page

(This section describes how to set up web tracking in VTEX IO).

 

VTEX IO has a separate Checkout section from the rest of the VTEX store. In order for Connectif to perform web tracking and display content during the order confirmation process, you need to manually add a code snippet from the backoffice to the checkout section.

  1. Go to your VTEX store settings, in "Installed Apps > Connectif", and copy the Checkout custom code snippet.

VTEX_IO_Integracion_-_17.png

  1. Go to "Store Settings > Checkout" and click  (Edit).

VTEX_IO_Integracion_-_18.png

  1. Go to the Code tab and modify the checkout6-custom.jsfile, adding the copied code:

VTEX_IO_Integracion_-_19.png

 

 

Success!
The Connectif integration with VTEX IO is now ready.

  

You can check that you’ve completed your Connectif integration with VTEX IO correctly in this article.

 

Frequently Asked Questions

1. What information does Connectif collect through this integration?

a. Information collected from Contact Sheets

In the integrations with VTEX IO, through the tag cn_client_info, certain information about Contact Sheets is transferred by default:

  • _name 
  • _surname 
  • email

Additionally, through the daily bulk synchronization, these fields are updated:

  • email
  • _birthdate
  • _name
  • _surname
  • _mobilePhone
  • _newsletterSubscriptionStatus

b. Information collected from Products

In the integrations with VTEX IO, through the tag cn_product_visited and the daily catalog synchronization, certain product information is collected by default:

  • productDetailUrl
  • name
  • brand
  • productId
  • imageUrl
  • unitPrice
  • unitPriceOriginal
  • availability
  • categories
  • unitPriceWithoutVAT (only with daily bulk synchronization, not through the tag)
  • publishedAt (only with daily bulk synchronization, not through the tag)
  • inStockUnits (only with daily bulk synchronization, not through the tag)

c. Information collected from Purchases

In the integrations with VTEX IO, through the tag cn_purchase and the API synchronization, certain purchase information is collected by default:

  • cartId
  • purchaseDate
  • purchaseId
  • totalPrice
  • totalQuantity

 

2. How to recover abandoned carts with the Cart Recovery URL

(This section explains how the Cart Recovery URL works to obtain the items associated with a specific cart).

Through the integration with VTEX IO, a Cart Recovery URL is sent to Connectif, meaning a link to retrieve the items related to that cart which can be used in workflows and content.

To obtain the cart recovery URL through a workflow, it must be done using the "Get last cart" and "On cart abandonment" nodes, and then mapped in the variables of the content to display or send.

  • Learn how this URL works in the different CMSs and how to use it in this article. 

 

 

Keep learning!

To make the most of your Connectif account, we recommend continuing with the following articles: