Comment personnaliser le contenu sur site avec l’API d’appartenance à un groupe de Klaviyo

Objectif de cet article

Apprenez à utiliser la méthode getGroupMembership de l’objet JavaScript klaviyo, qui peut être utilisée pour mettre en œuvre la personnalisation sur votre site web. Pour cela, chargez l’objet klaviyo et transmettez un tableau de listes ou de segments à vérifier, ce qui renverra un résultat que vous pourrez exploiter pour la personnalisation sur site.

Avant de commencer

Lorsque vous ajoutez le tracking sur site de Klaviyo à votre site, seule l’activité de navigation de « navigateurs connus » fait l’objet d’un tracking (c’est-à-dire, les navigateurs qui ont visité, se sont engagés et ont été identifiés ou ont généré des cookies). Le tracking sur site de Klaviyo ne concerne pas les navigateurs anonymes. Klaviyo identifie les visiteurs d’un site de 3 manières principales pour le tracking sur site :

• Si quelqu’un a cliqué sur un e-mail de Klaviyo pour accéder à votre site web
• Si quelqu’un s’est abonné par le biais d’un formulaire Klaviyo
• Si quelqu’un s’est connecté à votre site et que vous avez installé un système de tracking

Installer Klaviyo.js et charger l’objet Klaviyo

Si ce n’est pas déjà fait, vous devez commencer par installer Klaviyo.js. Klaviyo.js, également connu sous le nom de JavaScript « Activité sur le site » de Klaviyo, prend automatiquement en charge l’objet klaviyo. Si vous avez activé une intégration dans votre compte Klaviyo ou installé Klaviyo.js manuellement, vous pourrez lancer l’objet klaviyo pour qu’il écoute les appels pertinents.

Nous vous recommandons d’installer manuellement l’extrait ci-dessous sur votre site (en plus de l’installation de Klaviyo.js mentionnée ci-dessus) pour utiliser l’objet klaviyo dès le chargement de la page. L’objet klaviyo ne doit être chargé qu’une seule fois par page.

Pour charger l’objet klaviyo :

Pour utiliser la méthode getGroupMembership de l’objet JavaScript klaviyo pour la personnalisation sur site :

1. Dans votre code, sélectionnez la liste ou les identifiants de segment pour lesquels vous souhaitez vérifier l’appartenance. Il ne peut y avoir que 50 listes ou segments.
2. Identifiez les utilisateurs sur votre site via un formulaire Klaviyo ou d’autres moyens.
3. Effectuez un appel au format suivant, avec un tableau des identifiants de liste ou de segment dont vous souhaitez vérifier l’appartenance :

klaviyo.getGroupMembership(['listID1', 'listID2', 'listID3'])

Vous obtenez alors un tableau des identifiants de liste/segment auxquels l’utilisateur identifié appartient, étant donné que ces identifiants se trouvaient dans le tableau d’entrée. Si un tableau vide est renvoyé, cela signifie que vous avez transmis trop d’identifiants ou que l’utilisateur n’appartient à aucune des listes ou aucun des segments que vous avez fournis.

Vous pouvez utiliser les données renvoyées relatives à l’appartenance à une liste ou un segment pour personnaliser votre site avec des produits, du contenu et d’autres éléments pertinents basés sur les segments de clients de Klaviyo.

Exemple de code

Voici un exemple montrant comment appeler l’API getGroupMembership avec plusieurs identifiants de segment.

const customerSegments = await klaviyo.getGroupMembership([
  VIPSegmentID,
 UnEngagedSegmentID,
 DogLoversSegmentID,
]);

Impact sur les performances du site

L’API d’appartenance à un groupe a un impact minimal sur les performances de votre site. Le fichier Javascript (c’est-à-dire web_personalization.js) que Klaviyo charge sur votre site atteint seulement 1,2 Ko environ, et la demande groupée pour ce fichier ne bloque pas le fil principal. Cela n’a donc pas d’impact sur l’utilisation des pages.

Les données chargées pour personnaliser un site en fonction du profil client sont mises en cache dans le navigateur après la première demande, de sorte que les demandes supplémentaires ne nécessitent pas d’appels à l’API en backend.

Conclusion

Vous pouvez désormais utiliser l’objet JavaScript klaviyo avec des outils de personnalisation web et pour personnaliser le contenu sur site en fonction de l’appartenance à un segment ou à une liste.

Ressources complémentaires

Présentation de l’objet klaviyo

Modèle de données de Klaviyo

Glossaire des termes courants relatifs aux API