Varify® Snippet - Intégration
En bref
Intégrer le snippet Varify.io® dans ton site web ou tes systèmes de boutique peut se faire rapidement. Il est préférable d'inclure le snippet JavaScript dans la balise <head> de ta page web pour éviter le page flickering. Si nécessaire, tu peux aussi utiliser un gestionnaire de balises pour l'intégration.
Si tu ne peux pas intégrer immédiatement le snippet, tu peux essayer notre extension Google Chrome .
Implémentation du snippet
Intégration dans la zone du site web (recommandé)
Si tu souhaites intégrer le snippet Varify.io dans ton site web, il est important de le placer le plus haut possible dans la page - idéalement dans la zone <head>. Cela garantit que le snippet est chargé correctement et sans délais.
Tu as deux options pour intégrer le snippet : synchrone et asynchrone. Les deux ont leurs propres avantages et inconvénients.
En fonction des exigences et de la structure spécifiques de ton site web, tu décides quelle méthode d'implémentation est la meilleure pour toi.
Comment intégrer le script Varify.io de manière synchrone
| Avantage | Inconvénient |
|---|---|
| Garantit que le script est chargé avant que la page web ne s'affiche. | Peut augmenter le temps de chargement de la page web en cas de problèmes de chargement du script. |
| Pas de scintillement de la page | Si le script ne se charge pas, l'ensemble de la page web risque de ne pas s'afficher. |
<!-- Varify.io® code for YOUR ACCOUNT-->
<script>
window.varify = window.varify || {};
window.varify.iid = YOUR ACCOUNT ID;
</script>
<script src="https://app.varify.io/varify.js"></script>
Important : à la ligne 4, remplace « YOUR ACCOUNT ID » par l'ID de compte de ton tableau de bord.
Comment intégrer le script Varify.io de manière asynchrone
| Avantage | Inconvénient |
|---|---|
| N'affecte pas le temps de chargement de la page web, car la page web est chargée en parallèle. | Il est possible que d'autres scripts soient exécutés en premier, ce qui peut provoquer des effets secondaires étranges. |
| La page web continue de se charger même en cas de problèmes lors du chargement du script. | Un scintillement de la page peut se produire |
<!-- Varify.io® code for YOUR ACCOUNT-->
<script>
window.varify = window.varify || {};
window.varify.iid = YOUR ACCOUNT ID;
</script>
<script async src="https://app.varify.io/varify.js"></script>
Important : à la ligne 4, remplace « YOUR ACCOUNT ID » par l'ID de compte de ton tableau de bord.
Intégration via le Tag Manager
L'intégration du snippet JS via Google Tag Manager est un moyen rapide d'intégrer Varify.io® sur ton site web. Cependant, cette option comporte également le risque qu'un effet de scintillement soit visible pendant la diffusion d'une variation.
Crée simplement une balise HTML personnalisée dans ton Tag Manager et insère le snippet de code JavaScript. Comme déclencheur, sélectionne l'option permettant de déclencher la balise sur toutes les pages le plus tôt possible. Une option serait par exemple « Initialisation - Toutes les pages ». Notez qu'il peut y avoir d'autres options selon la configuration de ton site web.
Assure-toi de remplacer « xxx » après « window.varify.iid = » dans la capture d'écran par ton ID de compte.
Lors de l'intégration du script Varify via GTM ou de son intégration directe dans le <body>, désactive le paramètre "Start Tracking on Activation Event" sous Advanced Setup. Cela garantira le bon fonctionnement de ton tracking Varify.
Teste Varify.io via l'extension Chrome
Tu peux télécharger l'extension Google Chrome pour tester Varify.io. L'extension intègre le snippet Varify.io sur ton site web exclusivement pour toi, dans ton navigateur. Cela signifie que toi seul(e) modifies et visualises les variations dans ton navigateur.
Pour implémenter ton snippet personnalisé sur ton site web sans avoir à toucher au code, suis les étapes ci-dessous :
- Télécharge l'extension Chrome Varify®
- Active le plugin dans ton navigateur
- Copie ton extrait de code Varify® depuis ton dashboard (Get Snippet Here) et colle-le dans le champ « Your Snippet Code... » de l'extension -. C'est prêt !
Une explication plus détaillée de l'installation et de l'activation, ainsi que d'autres fonctions, se trouve ici : extension de navigateur Chrome Varify®
Éviter le flickering pendant le déroulement de l'expérience
Le flickering se produit lorsque la page est déjà visible avant que Varify n'ait entièrement appliqué la variante. La meilleure façon d'éviter cela est d'inclure le snippet dans le <head>.
Si cela n'est pas suffisant ou pas techniquement possible, tu peux également utiliser le script anti-scintillement. Tu trouveras les instructions correspondantes dans la documentation : Anti-flicker script