Comment utiliser le panier sur le côté sur PageFly ?
Wide Hello!
On va voir dans cet article comment faire pour ouvrir le panier sur le côté sur PageFly lorsqu'un client ajoute une offre WideBundle à son panier.
Avant de commencer, vous devez savoir qu'il est nécessaire d'avoir un panier sur le côté, que ce soit par votre thème ou grâce à une application.
WideBundle ne créera pas un panier sur le côté lui-même.
C'est parti !
Si vous préférez avoir les explications en vidéo vous pouvez la regarder juste ici 👇
La première étape consiste à ajouter différents éléments sur PageFly qui sont nécessaires au bon fonctionnement du panier sur le côté. WideBundle a besoin de se synchroniser avec les éléments suivant: Le sélecteur de variantes, le bouton quantité, le bouton ajout-au-panier.
Une fois qu'ils sont ajoutés, WideBundle se chargera de les détecter et de les cacher automatiquement pour ne pas qu'ils apparaissent en double avec WideBundle !
Ouvrez votre page sur PageFly sur laquelle vous faites apparaître WideBundle
Cliquez sur la gauche sur l'icône Shopify "Ajouter un élément Shopify"
Cliquez sur le bloc "Product Variants" pour le sélecteur de variantes, puis glissez le deuxième module juste au-dessus de WideBundle
Cliquez sur le bloc "Product Add To Cart" pour le bouton ajout-au-panier, puis glissez le premier module juste au-dessus de WideBundle
Cliquez sur le bloc "Product Quantity" pour le sélecteur de quantité, puis glissez le premier module sous le sélecteur de variantes (au dessus du bouton ajout-au-panier)
Maintenant il va falloir configurer le bouton ajout-au-panier de PageFly pour ouvrir le panier sur le côté.
On va ensuite s'assurer que le bouton ajout-au-panier ouvre bien le panier sur le côté sans WideBundle.
Cliquez sur le module du bouton ajout-au-panier que vous avez ajouté
Mettez l'action "Rester sur la même page" après le clic sur le bouton ajout-au-panier
Sauvegardez et Publiez votre page.
On va maintenant s'assurer que le panier sur le côté s'ouvre bien sans WideBundle avant de continuer.
Ouvrez l'application WideBundle
Désactivez l'affichage de WideBundle pour quelques minutes (afin de tester l'ouverture du panier sur le côté sans WideBundle)
Rendez-vous sur votre boutique et ouvrez la page produit sur laquelle vous avez ajouter le sélecteur de variante, le bouton ajout-au-panier ainsi que le sélecteur de quantité
Essayez d'ajouter le produit au panier et voyez si le panier sur le côté s'ouvre bien comme configuré
💡 Si le panier sur le côté ne s'ouvre pas en ayant bien fait toutes les étapes précédentes, contactez PageFly pour avoir de l'assistance, il doit y avoir un problème qui n'est pas lié à WideBundle.
Retournez sur l'application WideBundle
Activez de nouveau WideBundle
Cliquez sur Paramètres dans le menu du haut
Dans la section sur la gauche, cliquez sur Bouton ajout-au-panier
Changez la redirection du bouton ajout-au-panier et mettez "Rediriger sur le panier sur le côté"
Et voilà !
Vous pouvez à nouveau tester mais il ne devrait pas y avoir de problème
On va voir dans cet article comment faire pour ouvrir le panier sur le côté sur PageFly lorsqu'un client ajoute une offre WideBundle à son panier.
Avant de commencer, vous devez savoir qu'il est nécessaire d'avoir un panier sur le côté, que ce soit par votre thème ou grâce à une application.
WideBundle ne créera pas un panier sur le côté lui-même.
C'est parti !
Si vous préférez avoir les explications en vidéo vous pouvez la regarder juste ici 👇
1) Ajoutez le sélecteur de variantes, le bouton ajout-au-panier et le sélecteur de quantité
La première étape consiste à ajouter différents éléments sur PageFly qui sont nécessaires au bon fonctionnement du panier sur le côté. WideBundle a besoin de se synchroniser avec les éléments suivant: Le sélecteur de variantes, le bouton quantité, le bouton ajout-au-panier.
Une fois qu'ils sont ajoutés, WideBundle se chargera de les détecter et de les cacher automatiquement pour ne pas qu'ils apparaissent en double avec WideBundle !
Ouvrez votre page sur PageFly sur laquelle vous faites apparaître WideBundle
Cliquez sur la gauche sur l'icône Shopify "Ajouter un élément Shopify"
Cliquez sur le bloc "Product Variants" pour le sélecteur de variantes, puis glissez le deuxième module juste au-dessus de WideBundle
Cliquez sur le bloc "Product Add To Cart" pour le bouton ajout-au-panier, puis glissez le premier module juste au-dessus de WideBundle
Cliquez sur le bloc "Product Quantity" pour le sélecteur de quantité, puis glissez le premier module sous le sélecteur de variantes (au dessus du bouton ajout-au-panier)
2) Configurez votre bouton ajout-au-panier pour ouvrir le panier sur le côté
Maintenant il va falloir configurer le bouton ajout-au-panier de PageFly pour ouvrir le panier sur le côté.
On va ensuite s'assurer que le bouton ajout-au-panier ouvre bien le panier sur le côté sans WideBundle.
Cliquez sur le module du bouton ajout-au-panier que vous avez ajouté
Mettez l'action "Rester sur la même page" après le clic sur le bouton ajout-au-panier
Sauvegardez et Publiez votre page.
3) Testez l'ouverture du panier sur le côté sans WideBundle
On va maintenant s'assurer que le panier sur le côté s'ouvre bien sans WideBundle avant de continuer.
Ouvrez l'application WideBundle
Désactivez l'affichage de WideBundle pour quelques minutes (afin de tester l'ouverture du panier sur le côté sans WideBundle)
Rendez-vous sur votre boutique et ouvrez la page produit sur laquelle vous avez ajouter le sélecteur de variante, le bouton ajout-au-panier ainsi que le sélecteur de quantité
Essayez d'ajouter le produit au panier et voyez si le panier sur le côté s'ouvre bien comme configuré
💡 Si le panier sur le côté ne s'ouvre pas en ayant bien fait toutes les étapes précédentes, contactez PageFly pour avoir de l'assistance, il doit y avoir un problème qui n'est pas lié à WideBundle.
4) Configurez WideBundle pour ouvrir le panier sur le côté
Retournez sur l'application WideBundle
Activez de nouveau WideBundle
Cliquez sur Paramètres dans le menu du haut
Dans la section sur la gauche, cliquez sur Bouton ajout-au-panier
Changez la redirection du bouton ajout-au-panier et mettez "Rediriger sur le panier sur le côté"
Et voilà !
Vous pouvez à nouveau tester mais il ne devrait pas y avoir de problème
Mis à jour le : 30/04/2023
Merci !