Guide complet pour intégrer votre site web avec Connectif

Dans ce guide, vous trouverez toutes les informations nécessaires pour intégrer votre site web à Connectif, depuis les types de synchronisation les plus courants pour savoir lequel convient le mieux à vos besoins techniques et à votre entreprise, jusqu'à apprendre à vérifier que la connexion entre l'eCommerce et Connectif fonctionne correctement. 

 

Comment effectuer une intégration sur mesure entre votre eCommerce et Connectif ?

Le type d'intégration avec Connectif que vous choisirez dépendra de vos besoins et du type de site web, ainsi que des ressources techniques disponibles. Connaître toutes les options et les étapes de mise en œuvre vous permettra d'avoir une vision globale et de choisir celle qui convient le mieux à votre eCommerce.

 

1. Choix et mise en œuvre de l'intégration adaptée

La manière la plus simple de synchroniser l'eCommerce avec Connectif est d'utiliser l'un des modules existants pour les différentes plateformes, actuellement disponibles pour :

  

Si vous utilisez l'un des CMS mentionnés ci-dessus, il n'est pas nécessaire de continuer cet article. Il suffit d'installer le module sur votre boutique et de l'activer en suivant les étapes indiquées dans la documentation correspondante.

Que faire si votre boutique ne figure pas dans la liste ci-dessus ?

Si votre boutique en ligne n'utilise aucun des CMS mentionnés, vous devrez mettre en œuvre une intégration sur mesure. Vous trouverez ci-dessous quatre manières possibles de le faire, les éléments que vous pouvez intégrer dans chaque cas et les étapes pour compléter la synchronisation.

  

Pour effectuer ce type d'intégration, vous aurez besoin d'un expert avec des connaissances en programmation. Il est possible que vous deviez combiner plusieurs méthodes d'intégration sur mesure pour envoyer tous les types d'événements.

Type d'événement Rendu côté serveur Rendu côté client Intégration via JavaScript Intégration via API
Informations de contact        
Activité de contact        
Catalogue de produits        
Achats        
Coupons        

1.1. Intégration via des balises HTML rendues côté serveur

Pourquoi choisir cette méthode ?

L'intégration via des balises HTML rendues côté serveur est probablement la méthode la plus rapide pour envoyer des informations à Connectif de manière personnalisée. Elle consiste à générer et afficher ces balises sur les pages concernées afin que les données qu'elles contiennent soient automatiquement envoyées à Connectif. 

Qu’est-ce qui peut être intégré ?

Avec cette méthode, il est possible d'intégrer toutes les balises HTML, ainsi que de synchroniser le catalogue de produits.

À quoi faut-il faire attention ?

Pour que l'intégration via des balises HTML fonctionne correctement, il est nécessaire que des changements de page et d'URL se produisent lorsque le contact navigue sur le site web. Par conséquent, cette méthode d'intégration est recommandée pour les sites qui ne sont pas des Single Page Applications (SPA) et qui permettent le rendu HTML côté serveur.

 

Apprenez à intégrer via des balises HTML rendues côté serveur dans cet article.

1.2. Intégration via des balises HTML rendues côté client

Pourquoi choisir cette méthode ?

L'intégration via des balises HTML rendues côté client est la meilleure option si vous utilisez Google Tag Manager et dataLayer, ou si vous souhaitez envoyer des informations à Connectif via des balises HTML sans faire de rendu côté serveur.

Qu’est-ce qui peut être intégré ?

Avec cette méthode, il est possible d'intégrer toutes les balises HTML, mais il n'est pas possible de synchroniser le catalogue de produits. Deux options s'offrent à vous pour intégrer le catalogue :

  • Générer la balise HTML "cn_product_visited" côté serveur.
  • Désactiver la vérification automatique des produits et les synchroniser via l'API.

À quoi faut-il faire attention ?

Comme pour les balises HTML rendues côté serveur, cette méthode ne fonctionnera pas correctement si aucun changement de page ou d'URL ne se produit lorsque le contact navigue sur le site web. Par conséquent, cette méthode d'intégration convient aux sites qui ne sont pas des Single Page Applications (SPA).

 

Apprenez à intégrer des balises HTML rendues côté client dans cet article.

1.3. Intégration via l'envoi d'événements JavaScript

Pourquoi choisir cette méthode ?

L'intégration via des événements JavaScript est la méthode la plus avancée et offre un contrôle accru sur le moment où les événements qui suivent les informations des contacts sont envoyés. Elle est particulièrement recommandée pour les Single Page Applications (SPA) qui doivent contrôler quand un changement de page a lieu pour envoyer l'événement “page-visit”.

Qu’est-ce qui peut être intégré ?

Avec cette méthode, il est possible d'intégrer tous les événements JavaScript, mais il n'est pas possible de synchroniser le catalogue de produits. Deux options sont disponibles pour intégrer le catalogue :

  • Générer la balise HTML "cn_product_visited" côté serveur.
  • Désactiver la vérification automatique des produits et les synchroniser via l'API.

À quoi faut-il faire attention ?

Vous pouvez également envoyer des notifications personnalisées en utilisant cette méthode, via la création d’une notification personnalisée pour recevoir des données dans Connectif.

 

Apprenez à intégrer via l'envoi d'événements JavaScript dans cet article.

1.4. Intégration via l'API de Connectif

Pourquoi choisir cette méthode ?

L'intégration via API est la méthode qui offre un contrôle total sur les données envoyées, permettant par exemple d'envoyer un achat une fois qu'il a été vérifié en backend, ou de synchroniser les modifications des produits au moment où elles sont mises à jour dans la boutique.

C'est le seul moyen d'envoyer l'événement d'achat au moment où il est confirmé, sans attendre que le contact visite à nouveau la page.

Qu’est-ce qui peut être intégré ?

Avec cette méthode, il est possible d'intégrer les Contacts, Produits, Achats et Coupons. Les autres événements devront être envoyés par l'une des autres méthodes proposées :

  • Rendre les balises HTML côté serveur.
  • Rendre les balises HTML côté client.
  • Configurer l'envoi d'événements JavaScript.

À quoi faut-il faire attention ?

Il est important de noter que l'API a une limite de 100 requêtes par minute (rate limit), il est donc recommandé de consulter l'API de Connectif en cas de synchronisation impliquant un envoi massif de données.

 

Apprenez à intégrer via l'API dans cet article.

2. Réglage des paramètres dans Connectif

Une fois que vous envoyez des informations à Connectif depuis votre boutique en ligne, vous devrez vérifier l'état de la configuration de l'intégration web et des paramètres de commerce électronique :

3. Vérification de la synchronisation

Une fois l'intégration réalisée et avant de passer en production, il est nécessaire de vérifier que tous les événements sont correctement envoyés. Pour effectuer une vérification de la synchronisation, vous devrez simuler l'interaction d'un contact sur le site et confirmer que toutes les activités sont collectées dans Connectif.

 

Apprenez comment vérifier que votre intégration est prête dans cet article.

 

 

Félicitations !
Vous êtes arrivé à la fin de la leçon.

 


Questions fréquentes

Vous avez des doutes sur certains processus ? Vous trouverez ici des informations utiles :

1. Que faire si votre panier est mis à jour via AJAX ?

Dans ce cas, vous devrez configurer l'événement AJAX du panier pour indiquer les modifications dans le panier sans recharger la page. 

 

Apprenez comment configurer l'envoi du panier via AJAX dans cet article.

2. Comment le cache impacte-t-il votre intégration sur mesure ?

Connectif est un outil de personnalisation et, en tant que tel, il vise à améliorer l'expérience des contacts naviguant sur votre site, en adaptant le contenu qui leur est affiché tout en collectant des informations pour enrichir vos connaissances sur vos clients.

Pour cette raison, il est très important de contrôler quelles parties de la page sont mises en cache afin de maintenir cette personnalisation. Il existe deux types de cache, selon la partie de la page concernée et le moment où elle est actualisée :

  • Cache de page

Ce sont les systèmes qui renvoient le même contenu à tous les visiteurs en fonction uniquement de l'URL visitée. Il est déconseillé d'utiliser ce type de cache car il n'est pas compatible avec la personnalisation offerte par Connectif.

 

Par exemple, si une page d'accueil est mise en cache, bien qu'un contact enregistré visite des pages produit et que ses visites et paniers soient enregistrés, lorsqu'il retourne sur la page d'accueil, cette page ne transmettra pas les informations du contact ni de son panier, ce qui créera un nouveau contact anonyme. Il pourrait même y avoir un mélange d'informations provenant d'autres contacts avec d'autres paniers.

  • Cache de blocs

Ce sont les systèmes qui permettent de mettre en cache certaines parties de la page, tout en générant d'autres blocs HTML chaque fois que la page est visitée. Ce type de cache est compatible avec Connectif, car les parties statiques peuvent être mises en cache tandis que les parties utilisées par Connectif pour personnaliser et collecter des informations ne le sont pas et peuvent continuer à fonctionner correctement.

 

Par exemple, si plusieurs blocs HTML sont mis en cache sur la page d'accueil, lorsqu'un contact navigue sur le site en ajoutant des produits à son panier et revient sur la page principale, le bloc HTML où sont rendues les balises "cn_client_info" et "cn_cart" ne sera pas mis en cache et transmettra correctement les informations du contact.

3. Comment envoyer des événements personnalisés ?

Pour envoyer des événements personnalisés, vous devrez créer une intégration pour recevoir des données dans Connectif et générer la notification via JavaScript.

 

Apprenez à créer un événement personnalisé dans Connectif dans cet article.

4. Quels navigateurs prennent en charge le script de Connectif ?

La compatibilité du script JavaScript de Connectif avec les différents navigateurs dépend de leur part de marché.

Connectif identifie, via browser list, les navigateurs ayant plus de 2 % de part de marché pour assurer leur compatibilité. Ces informations sont obtenues à partir de https://caniuse.com/usage-table.

Pour garantir une large compatibilité tout en optimisant la taille du JavaScript et son chargement dans le navigateur des contacts, Connectif utilise Babel.

 

Les navigateurs comme Internet Explorer, qui ont moins de 1,5 % d'utilisation au niveau mondial, ne sont actuellement pas pris en charge.

 

  

Vous avez encore des questions ?
Rappelez-vous que vous avez à votre disposition nos spécialistes Connectif. Pour les contacter, il vous suffit d’ouvrir un ticket auprès du support en cliquant sur le bouton bleu « Aide » de votre tableau de bord.


Continuez d'apprendre !

Pour exploiter tout le potentiel de votre compte Connectif, nous vous recommandons de consulter les articles suivants :

Cet article vous a-t-il été utile ?
Utilisateurs qui ont trouvé cela utile : 0 sur 0