Créer une expérience multi-pages
Table des matières
En bref
Si tu veux effectuer des modifications simultanées sur plusieurs pages au sein d'une expérience, tu as besoin d'une expérience multi-pages. Dans Varify.io, il y a deux possibilités pour créer une telle expérience :
- La méthode simple: Créez plusieurs expériences séparées et reliez-les entre elles.
- La méthode avancéeUtilise une seule expérience et contrôle les variantes à l'aide de JavaScript. Pour cela, des connaissances approfondies de JavaScript sont toutefois nécessaires.
Les deux approches te permettent de réaliser des expériences multi-pages efficaces, en fonction de ton savoir-faire technique et de tes besoins.
1ère possibilité : créer plusieurs expériences (débutants + avancés)
La méthode la plus simple pour créer une expérience multi-pages consiste à créer plusieurs expériences et à les relier ensuite entre elles. Pour chaque page, tu peux déposer les modifications souhaitées dans une expérience séparée. Une fois que toutes les expériences ont été créées, la connexion se fait en ajoutant un JavaScript dans l'Audience Targeting. Les expériences sont ainsi efficacement coordonnées entre elles et peuvent être testées sur plusieurs pages.
Voici comment mettre en place une expérience multi-pages de manière optimale :
1. créer une expérience par page
Crée une expérience séparée pour chaque page web sur laquelle un changement doit avoir lieu.
2. définir l'expérience primaire
Déterminez quelle est l'expérience primaire. Dans l'expérience primaire, les visiteurs deviennent des participants au test. L'expérience primaire est celle qui se trouve sur la page que les participants au test voient en premier.
3. insérer le code lors du ciblage de l'audience
Ajoute dans toutes les expériences qui font partie de l'expérience multi-page, mais pas l'expérience primaire sont, le code suivant est inséré dans le ciblage d'audience.
const EXPERIMENT_ID = 13013; // Change this to the experiment ID you're interested in
const STORAGE_KEY_PREFIX = 'varify-experiment-';
const specificStorageKey = STORAGE_KEY_PREFIX + EXPERIMENT_ID;
const targetVariationId = 17347; // The specific variation ID to check for
// Retrieve the value for specificStorageKey
const storedValue = localStorage.getItem(specificStorageKey);
if (storedValue) {
// Parse the stored JSON string
const storedData = JSON.parse(storedValue);
// Check if the current user has the specific variation ID
if (storedData.variationId === targetVariationId) {
console.log('User has the specific variation ID');
return true;
} else {
console.log('User does not have the specific variation ID');
return false;
}
} else {
console.log('No data found for this experiment ID');
return false;
}
4. adapter Experiment_ID
Remplace Experiment_ID dans le code avec l'ID de l'expérience primaire.
5. Adapter targetVariationId
Passeport targetVariationId dans le code à l'ID de la variante de l'expérience primaire.
6. adapter la répartition du trafic
Pour toutes les expériences, à l'exception de l'expérience primaire, définissez la répartition du trafic sur 100 % de la variante.
2e possibilité : création d'une expérience et utilisation de JavaScript (avancés)
Il est possible de créer une expérience multi-pages sans créer plusieurs expériences. Mais cela nécessite des connaissances avancées en JavaScript est nécessaire, car la logique pour la mise en jeu des variantes est contrôlée par ton code. Tu trouveras ci-dessous des instructions étape par étape :
Pour créer une expérience multi-pages avec une seule expérience, procédez comme suit
1. créer une nouvelle expérience
2. ajoute ton JavaScript à la variante, qui sera exécuté en fonction de la page appelée
exemple :
if (window.location.href.includes('/produktseite')) {
// Änderungen für die Produktseite
document.querySelector('.produkt-titel').innerText = 'Neue Variante';
} else if (window.location.href.includes('/checkout')) {
// Änderungen für die Checkout-Seite
document.querySelector('.checkout-banner').style.display = 'none';
}
3. enregistre la variante
4. pour le ciblage de pages, ajoute à l'expérience toutes les pages/types de pages sur lesquelles la variante doit être diffusée