Connectez Shopify à OneSignal via l’intégration Vendo pour les notifications push web, les tags clients, les événements commerce et le ciblage comportemental.
OneSignal s’est associé à Vendo pour créer une intégration Shopify transparente. Vendo déploie le SDK OneSignal sur votre boutique Shopify en un clic — aucune modification manuelle du code du thème n’est requise. Il synchronise les tags clients, les événements de navigation côté client et les événements commerciaux côté serveur vers OneSignal pour vous permettre de créer des segments et de déclencher des campagnes push à partir de comportements réels et de l’historique d’achat.Pour la documentation de Vendo, consultez Vendo OneSignal Destination.
Connectez-vous à onesignal.com et créez ou sélectionnez une application. Choisissez Web comme plateforme et sélectionnez Custom Code comme type d’intégration.
Vous devez sélectionner Custom Code. L’option Typical Site n’expose pas les paramètres de chemin du service worker, donc le SDK essaiera de charger /OneSignalSDKWorker.js depuis la racine de votre boutique — Shopify bloque cela et les abonnements push échoueront silencieusement. Si vous avez déjà créé l’application avec Typical Site, passez à Custom Code dans Settings > Platforms > Web, ou supprimez et recréez l’application.
2
Configurer les paramètres push web
Dans votre application OneSignal, accédez à Settings > Push & In-App > Web Settings ou suivez le guide de configuration du push web.Configuration du site
Site Name : Le nom de votre boutique, utilisé comme titre de notification par défaut.
Site URL : L’URL accessible publiquement de votre boutique Shopify (par ex. https://yourstore.com).
N’utilisez pas https://your-site.myshopify.com/ si les clients accèdent à votre site via un domaine personnalisé comme https://your-site.com/.
Default Icon URL : Téléversez une image PNG, JPG ou GIF non animé carrée de 256×256 qui apparaît dans les notifications et les invites. Si elle n’est pas définie, une icône de cloche est utilisée par défaut. Voir Icônes de notification.
3
Configurer le chemin du service worker
Shopify n’autorise pas la diffusion de fichiers depuis la racine du site, vous devez donc indiquer à OneSignal où Vendo sert le fichier service worker.Dans OneSignal, accédez à Settings > Push & In-App > Web Settings, faites défiler jusqu’à Advanced Push Settings, activez Customize service worker paths and filenames, puis configurez :
Paramètre
Valeur
Path to service worker files
/apps/vendo/
Main service worker filename
OneSignalSDKWorker.js
Updater service worker filename
OneSignalSDKWorker.js
Service worker registration scope
/apps/vendo/
Configuration du service worker pour les boutiques Shopify utilisant Vendo.
Vendo sert automatiquement le fichier OneSignalSDKWorker.js requis à https://yourstore.myshopify.com/apps/vendo/OneSignalSDKWorker.js — aucun téléversement manuel de fichier n’est nécessaire.
La page OneSignal > Push Settings de l’application Vendo affiche ces valeurs exactes avec un bouton de copie en un clic, vous n’avez donc pas besoin de les ressaisir.L’Updater Filename et le Main Service Worker Filename sont le même fichier. OneSignal v16+ utilise un seul service worker pour les deux usages.
4
Copier vos identifiants
Dans OneSignal, accédez à Settings > Keys & IDs et copiez votre App ID et votre REST API Key. Vous les saisirez dans Vendo.
Installez l’application Vendo depuis le Shopify App Store.
2
Ajouter l'intégration OneSignal
Dans Vendo, accédez à Destinations > OneSignal.
Ajouter l'intégration OneSignal dans Vendo.
3
Saisir vos identifiants OneSignal
Saisissez votre App ID et votre REST API Key OneSignal de la section précédente, puis cliquez sur Save.
4
Activer le bloc de thème Vendo
Le bloc de thème Vendo charge le SDK OneSignal sur votre boutique. Sans lui, l’invite push n’apparaîtra pas et le suivi côté client ne fonctionnera pas.
Dans votre administration Shopify, accédez à Online Store > Themes > Customize.
Cliquez sur App embeds (icône de pièce de puzzle dans la barre latérale gauche).
Activez Vendo.
Cliquez sur Save.
Le bloc de thème gère l’initialisation du SDK, l’enregistrement du service worker, l’affichage de l’invite push, l’identification des utilisateurs (abonnement push, connexion, inscription à la newsletter) et la synchronisation des tags pour les utilisateurs identifiés.
5
Sélectionner les événements à synchroniser
Dans l’application Vendo sous OneSignal > Events, activez les événements côté client et côté serveur que vous souhaitez envoyer à OneSignal. Consultez Suivi ci-dessous pour la liste complète des événements.
6
Configurer les invites push
L’affichage de chaque invite sur votre boutique — et le moment de son affichage — est contrôlé depuis l’application Vendo, pas depuis le tableau de bord OneSignal. Dans l’application Vendo, ouvrez OneSignal > Push Settings. Vous verrez quatre sections, chacune avec son propre bouton bascule :
Section
Fonction
Subscription Bell
Icône de cloche flottante sur laquelle les visiteurs peuvent cliquer pour s’abonner à tout moment
Push Slide Prompt
Bannière coulissante à votre marque demandant la permission push
Native Browser Prompt
Déclenche directement la boîte de dialogue de permission intégrée du navigateur
Pour les invites Push Slide et Native, vous définissez également des déclencheurs — le nombre de pages vues et le nombre de secondes à attendre avant que l’invite ne se déclenche. Des valeurs par défaut raisonnables sont pré-remplies.Les quatre invites sont désactivées par défaut — activez uniquement celles que vous souhaitez. Enregistrez une seule fois en bas de la page ; les modifications prennent effet au prochain chargement de la boutique, sans redéploiement du thème.
Le texte des boutons d’invite, le texte du message d’action, les icônes et les options avancées comme les tests A/B et la localisation sont configurés dans le tableau de bord OneSignal. Depuis les Push Settings de Vendo, cliquez sur Open OneSignal Dashboard pour accéder directement à la page Permission Prompt Setup. Si une invite est configurée dans le tableau de bord OneSignal mais que son bouton bascule Vendo est désactivé, elle ne s’affichera pas — le bouton bascule de Vendo est la source de vérité pour la visibilité.
7
Synchronisation des données historiques (optionnel)
Vendo peut remplir rétroactivement les clients existants et l’historique des commandes récentes vers OneSignal. Cela se produit automatiquement en arrière-plan après avoir enregistré vos identifiants.
Options de synchronisation des données historiques dans Vendo.
Vendo utilise une approche réservée aux utilisateurs identifiés — les visiteurs anonymes ne sont pas suivis dans OneSignal. Les utilisateurs doivent être identifiés via l’une des quatre méthodes avant que les événements soient envoyés. Cela évite les doublons d’utilisateurs et garantit des données propres et exploitables.
Méthode
Comment ça fonctionne
Identifiant utilisé
Abonnement push web
Le visiteur clique sur « Autoriser » dans l’invite push. OneSignal crée automatiquement un utilisateur et Vendo capture l’ID OneSignal.
OneSignal ID
Inscription à la newsletter
Le visiteur soumet un formulaire de newsletter ou d’e-mail. Vendo capture l’e-mail et appelle OneSignal.login(email).
Email
Connexion client
Le client se connecte à son compte Shopify. Vendo le détecte et appelle OneSignal.login() avec l’identifiant configuré.
Shopify Customer ID ou Email
Commande complétée
Le client finalise un achat. Vendo stocke l’identifiant et appelle OneSignal.login().
Shopify Customer ID ou Email
Si vous avez une application mobile ou des connexions tierces, sélectionnez l’identifiant (Shopify Customer ID vs. Email) qui correspond à vos autres outils pour que les profils utilisateurs restent cohérents entre les plateformes. Configurez ceci dans l’application Vendo sous Settings > Customer Identifier.
Si un abonné push (identifié par l’ID OneSignal) se connecte ensuite ou finalise un achat, Vendo appelle OneSignal.login() avec son Shopify Customer ID ou son e-mail. OneSignal associe l’abonnement push à l’utilisateur identifié — aucun doublon d’utilisateur n’est créé. Tous les abonnements push passés sont conservés, et les événements côté serveur (commandes, exécutions) atteignent le bon profil utilisateur.
Vendo synchronise les propriétés des clients sous forme de tags dans OneSignal pour la segmentation. Toutes les valeurs sont stockées sous forme de chaînes (format natif d’OneSignal).
Vendo capture les paramètres UTM et les identifiants de clic au moment du paiement et les synchronise sous forme de tags. Les valeurs last-touch sont écrasées à chaque paiement ; les valeurs first-touch (initial_utm_*) ne sont écrites qu’une seule fois.
Vendo peut synchroniser l’appartenance aux segments Shopify sous forme de tags au format shopify_segment_{segment_id} avec la valeur "true". Consultez la référence Events & Properties de Vendo pour plus de détails sur l’exécution de la synchronisation.
Vendo suit les événements personnalisés côté client sur votre boutique via le Shopify Web Pixel et les envoie à OneSignal. Ces événements ne sont envoyés qu’après identification de l’utilisateur.
Événement
Description
page_viewed
Le client visite une page (boutique, caisse ou statut de commande)
product_viewed
Le client consulte une page de détails produit
collection_viewed
Le client consulte une page de collection de produits
search_submitted
Le client effectue une recherche sur la boutique
product_added_to_cart
Un produit est ajouté au panier
product_removed_from_cart
Un produit est retiré du panier
cart_viewed
Le client consulte la page du panier
checkout_started
Le client commence le paiement
checkout_contact_info_submitted
Étape de coordonnées soumise
checkout_address_info_submitted
Étape d’adresse soumise
checkout_shipping_info_submitted
Mode de livraison sélectionné
payment_info_submitted
Détails de paiement soumis
checkout_completed
Paiement finalisé avec succès
alert_displayed
Alerte ou avertissement affiché lors du paiement
ui_extension_errored
Erreur d’exécution d’une extension d’interface de paiement
all_custom_events
Événements clients Shopify personnalisés
Configuration des événements côté client dans Vendo.
Les événements commerciaux Shopify sont exportés et transmis à OneSignal via le pipeline Vendo. Ils utilisent toujours le Shopify Customer ID comme external_id.
Événement
Description
order_received
Une nouvelle commande est créée
order_fulfilled
La commande est exécutée/expédiée
order_delivered
La commande est livrée
order_refunded
La commande est entièrement remboursée
order_partially_refunded
La commande est partiellement remboursée
cart_abandoned
Le paiement est abandonné
Configuration des événements côté serveur dans Vendo.
Créez un Journey déclenché par l’événement cart_abandoned. Attendez 1 heure après l’abandon, puis envoyez une notification push avec le lien de récupération en utilisant la propriété checkout_url.
Créez des Journeys pour order_fulfilled et order_delivered pour envoyer des notifications push immédiates avec les informations de suivi lorsque les commandes sont expédiées et livrées.
Visitez https://yourstore.myshopify.com/apps/vendo/OneSignalSDKWorker.js dans votre navigateur. Vous devriez voir du code JavaScript. Si vous obtenez une erreur 404, vérifiez que l’application Vendo est installée et que le bloc de thème est activé.Vous pouvez également ouvrir les DevTools du navigateur (F12), aller dans Application > Service Workers et confirmer que OneSignalSDKWorker.js est enregistré avec un scope /apps/vendo/.
2
Tester l'invite push
Ouvrez votre boutique dans une fenêtre de navigation privée/incognito. Vous devriez voir l’invite de permission de notification OneSignal. Cliquez sur Autoriser pour vous abonner.
3
Envoyer une notification de test
Dans le tableau de bord OneSignal, accédez à Messages > New Push. Envoyez une notification de test à votre abonné et vérifiez qu’elle apparaît.
4
Vérifier les données utilisateur dans OneSignal
Accédez à Audience > All Users et confirmez que votre utilisateur de test apparaît. Vérifiez que les tags utilisateur (e-mail, nom, etc.) se synchronisent pour les utilisateurs identifiés.
5
Déclencher un événement de test
Parcourez un produit ou effectuez un paiement test sur votre boutique. Confirmez que l’événement apparaît dans l’activité de l’utilisateur dans le tableau de bord OneSignal.
Le service worker doit se trouver à /apps/vendo/OneSignalSDKWorker.js. Si vous voyez une erreur 404 au chemin racine (/OneSignalSDKWorker.js), le chemin du service worker n’est pas configuré dans OneSignal — suivez l’étape de configuration du service worker. Si le 404 est au chemin /apps/vendo/, vérifiez que l’application Vendo est installée et que le bloc de thème est activé.
« Typical Site » a été sélectionné pendant la configuration OneSignal
Vendo requiert le type d’intégration Custom Code. Typical Site n’expose pas les paramètres de chemin du service worker, donc le SDK essaiera de charger /OneSignalSDKWorker.js depuis la racine de votre boutique — Shopify bloque cela et les abonnements push échoueront silencieusement.Solution : dans le tableau de bord OneSignal, changez le type d’intégration de l’application vers Custom Code sous Settings > Platforms > Web, ou supprimez l’application et recréez-la en utilisant Custom Code dès le départ.
Vérifiez que le bloc de thème Vendo est activé dans App embeds.
Dans l’application Vendo sous OneSignal > Push Settings, confirmez qu’au moins un bouton bascule d’invite (Subscription Bell, Push Slide Prompt ou Native Browser Prompt) est activé — les quatre sont désactivés par défaut.
Vérifiez le délai de déclenchement — une Push Slide configurée sur plusieurs pages vues ne se déclenchera pas au premier chargement de page.
Vérifiez que votre navigateur autorise les notifications (cliquez sur l’icône de cadenas dans la barre d’adresse).
Essayez une fenêtre de navigation privée/incognito au cas où l’invite aurait été précédemment refusée.
Les tags ne se synchronisent que pour les utilisateurs identifiés — les visiteurs anonymes ne sont pas suivis. Assurez-vous que l’utilisateur a été identifié via un abonnement push, une connexion, une inscription à la newsletter ou un paiement. Les premières synchronisations de tags peuvent prendre plusieurs heures.
Vérifiez que les événements sont activés dans l’application Vendo sous OneSignal > Events. Les événements côté client nécessitent que le Shopify Web Pixel soit actif et que l’utilisateur soit identifié. Les événements côté serveur nécessitent que la REST API Key soit configurée.
Les notifications affichent « Delivered » mais n’apparaissent pas
L’intégration fonctionne — le problème vient de vos paramètres de notification du navigateur ou du système d’exploitation. Vérifiez les paramètres de notification de votre système d’exploitation pour votre navigateur, assurez-vous que le mode Ne pas déranger / Concentration est désactivé, et vérifiez les permissions de notification au niveau du navigateur.
Puis-je changer l’identifiant client après la configuration ?
Oui. Mettez à jour le paramètre dans l’application Vendo sous Settings > Customer Identifier. Changer l’identifiant peut créer des profils utilisateur séparés si les utilisateurs existants ont déjà été identifiés avec la méthode précédente.
L’intégration Vendo prend-elle en charge les applications mobiles ?
L’intégration Vendo se concentre sur les boutiques Shopify et le push web. Si vous avez également une application mobile, assurez-vous que l’identifiant que vous sélectionnez dans Vendo correspond à celui que vous utilisez dans votre application mobile pour que les profils utilisateurs restent cohérents.
Que se passe-t-il si un visiteur n’est jamais identifié ?
Les événements des visiteurs non identifiés ne sont pas envoyés à OneSignal. Une fois que le visiteur s’identifie (en s’abonnant au push, en se connectant, en s’inscrivant à une newsletter ou en finalisant un achat), Vendo commence à envoyer des événements. Cette approche réservée aux utilisateurs identifiés évite les doublons et garantit des données propres.
Pourquoi Vendo utilise-t-il une approche réservée aux utilisateurs identifiés ?
Le suivi des visiteurs anonymes crée des utilisateurs OneSignal en double qui ne peuvent jamais être correctement fusionnés, entraînant des comptages d’utilisateurs gonflés et des données fragmentées. L’approche réservée aux utilisateurs identifiés garantit que chaque utilisateur OneSignal est réel et exploitable.