Suivi Shopify
Table des matières
En bref
Connecte Shopify directement à Varify et analyse tes expériences directement avec les données de conversion et de revenus de Shopify. L'intégration ne fonctionne que conjointement avec l'utilisation de GA4, car le nombre de visiteurs est importé depuis GA4.
Comment utiliser les données de suivi Shopify ?
Étape 1 : Activer l'importation de données Shopify
Va dans "Tracking Setup" et clique sur l'onglet "Advanced Setup". Active ici le paramètre "Use Shopify Data".
Étape 2 : Créer un pixel personnalisé avec le code de suivi Varify
Clique sur "Settings" dans ton Shopify Store et ouvre "Customer events". Clique ensuite sur "Add custom pixel" et nomme le pixel : "varify-checkout". Ensuite, insère le code suivant :
analytics.subscribe('varify', async (event) => {
const {varify_experimentId, varify_variationId, teamId, storageType, timestamp} = event.customData;
const validVariationId = varify_variationId !== undefined ? varify_variationId : null;
const existingDataRaw = await browser.localStorage.getItem('varify-data');
const existingData = existingDataRaw ? JSON.parse(existingDataRaw) : {};
if (!existingData.data) {
existingData.data = [];
}
const experimentEntry = {
[varify_experimentId]: validVariationId,
timestamp: timestamp || new Date().toISOString()
};
existingData.data = existingData.data.filter(
entry => !entry.hasOwnProperty(varify_experimentId)
);
existingData.data.push(experimentEntry);
existingData.teamId = teamId;
existingData.storageType = storageType;
existingData.data = existingData.data.filter(
entry => Object.keys(entry).length > 0
);
await browser.localStorage.setItem('varify-data', JSON.stringify(existingData));
});
analytics.subscribe('checkout_started', async (event) => {
const existingDataRaw = await browser.localStorage.getItem('varify-data');
const existingData = existingDataRaw ? JSON.parse(existingDataRaw) : {};
if (!existingData.data || existingData.data.length === 0) {
return;
}
const thresholdDate = new Date();
thresholdDate.setDate(thresholdDate.getDate() - 28);
existingData.data = existingData.data.filter(entry => {
if (!entry.timestamp) {
return true;
}
const entryDate = new Date(entry.timestamp);
return entryDate >= thresholdDate;
});
await browser.localStorage.setItem('varify-data', JSON.stringify(existingData));
});
analytics.subscribe('checkout_completed', async (event) => {
const {data: {checkout: {order: {id: orderId} = {}, subtotalPrice: {amount: orderRevenue} = {}} = {}}} = event;
const localVariationData = await browser.localStorage.getItem('varify-data');
const parsedData = JSON.parse(localVariationData);
const storedAccountId = parsedData.teamId;
const storageType = parsedData.storageType;
const experiments = parsedData.data.map(entry => {
return Object.entries(entry)[0]
});
try {
await fetch('https://ecommerce.varify.io/store_data', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
experiments,
orderId,
orderRevenue,
accountId: storedAccountId,
storageType: storageType,
}),
});
} catch (error) {
console.error('Error sending data', error);
}
});
Une fois que tu as ajouté le code, clique sur enregistrer. Vérifie en outre que tes permissions sont correctement définies, sinon le script ne sera pas exécuté s'il manque une permission d'utilisateur. Clique ensuite sur "Connect". L'intégration est maintenant installée avec succès.
Étape 3 : Ajoute des objectifs Shopify à ton expérience
Assure-toi que ta configuration de suivi est configurée et que tu as sélectionné GA4 comme fournisseur de suivi et que le point "Test Evaluation" est réglé sur "In Varify and GA4". Si c'est le cas, un "Results Link" apparaît désormais en haut à droite de l'expérience lancée pour les expériences "nouvellement créées".
En cliquant sur le lien "Results", le rapport de résultats correspondant à l'expérience s'ouvre. En cliquant sur "Add Shopify Goal", tu peux maintenant ajouter soit "Conversions" soit "Revenue" comme objectif. Les visiteurs du goal sont repris de GA4. La valeur de conversion et la valeur de revenu proviennent directement de Shopify.
Important : les données GA4 ne sont mises à jour qu'après environ 24 heures. Les données de Shopify sont mises à jour en temps réel.