Comment personnaliser une page de panier WooCommerce sans casser la validation de commande 

La première fois que j'ai ouvert la page du panier sur une boutique WooCommerce que je gérais, j'ai supposé que quelque chose s'était cassé. Toutes les autres pages portaient la marque du client. Le panier était un simple tableau avec un bouton gris.

Rien ne s'était cassé. Le panier WooCommerce par défaut est vraiment un simple tableau sans ventes croisées ni signaux de confiance, et sur un téléphone, le bouton de validation de commande se trouve sous la ligne de flottaison.

J'ai passé 15 ans à personnaliser des thèmes et des mises en page WordPress, et le panier est la page que les propriétaires négligent. La façon dont vous personnalisez votre page de panier WooCommerce dépend de votre thème, alors commencez par là.

Vérifiez quelle voie de page de panier votre thème utilise

Il existe trois façons de modifier une page de panier WooCommerce, et votre thème décide lesquelles des deux vous sont ouvertes, alors vérifiez cela avant de toucher quoi que ce soit.

Ouvrez Apparence dans votre tableau de bord WordPress. Si vous voyez Éditeur, vous êtes sur un thème basé sur des blocs. Si vous voyez Personnaliser à la place, vous êtes sur un thème classique.

Cet élément de menu est la première chose que je vérifie sur n'importe quel site que je reprends, car la moitié des instructions sur ce sujet supposent la mauvaise réponse.

Thème de blocs : Modifier le modèle de panier dans l'éditeur de site

Allez dans Apparence » Éditeur, puis Modèles » WooCommerce. Ouvrez Page : Panier. Cela vous place dans le modèle de page de panier lui-même, pas dans une page unique.

Le bloc Élément de panier WooCommerce est la pièce qui fait le travail dans ce modèle. C'est un wrapper contenant les produits du panier, les totaux de la commande, le champ du coupon, les options d'expédition et le bouton de validation de commande.

Ouvrez la Vue Liste et vous pouvez sélectionner n'importe laquelle de ces parties et la modifier seule. Lorsque le panier est vide, le bloc passe à sa vue Panier vide avec un message et des suggestions de produits.

Vous pouvez modifier la mise en page du modèle, ses couleurs et tous les blocs que vous ajoutez autour du panier. Ce que vous ne pouvez pas modifier facilement, c'est l'apparence des champs et des boutons du panier. Ceux-ci suivent les paramètres de votre thème, pas un panneau dédié.

Thème classique : Modifier la page avec le shortcode du panier

Sur un thème classique, allez dans Pages » Toutes les pages et ouvrez la page assignée à votre panier. À l'intérieur, vous trouverez une seule ligne de contenu, le shortcode [woocommerce_cart].

Ce shortcode est l'intégralité du panier. WooCommerce le remplace par le tableau du panier lorsque la page se charge, et votre thème décide de l'apparence de ce tableau.

Vous pouvez ajouter du contenu au-dessus et en dessous librement. À l'intérieur, vous ne pouvez presque rien changer. Laissez le shortcode où il est, sauf si vous le remplacez par un bloc panier d'un constructeur, ce qui est la troisième voie.

N'importe quel thème : Créer la page du panier dans un constructeur visuel

La troisième voie fonctionne sur les deux types de thèmes, car le constructeur prend complètement le contrôle de la page. Vous concevez un modèle de page panier, vous y placez le bloc panier du constructeur, et vous y dirigez WooCommerce.

Chaque constructeur avec lequel j'ai travaillé au fil des ans, y compris Beaver Builder, Elementor et Divi, vous donne un contrôle réel sur la mise en page et retire le pouvoir à votre thème.

C'est la voie que le reste de ce guide explore, en utilisant SeedProd.

Trois voies pour la page du panier, comparées

Les trois voies sont des choses qu'un propriétaire de boutique non technique peut faire sans ouvrir un fichier de modèle. Ce qui les différencie, c'est la mesure dans laquelle vous êtes autorisé à retoucher le panier lui-même.

Voie	Fonctionne sur	Ce que vous pouvez changer	Ce qu'il ne fera pas	Coût
Éditeur de site	Thèmes de blocs uniquement	Mise en page du modèle, couleurs et tous les blocs que vous ajoutez autour du panier	Retoucher les champs et boutons du panier au-delà des paramètres de votre thème	Gratuit avec WooCommerce
Classique	Thèmes classiques uniquement	Tout ce qui se trouve au-dessus et en dessous du shortcode [woocommerce_cart]	Changer le tableau du panier lui-même, que votre thème contrôle	Gratuit avec WooCommerce
SeedProd	N'importe quel thème, bloc ou classique	Couleurs du panier, polices, boutons, champs, bordures, plus tout autre bloc sur la page	Fonctionne sur les plans gratuits, Basic, Plus ou Pro, car le bloc Panier est réservé à Elite	SeedProd Elite, 599 $ par an

Je recommande la voie du constructeur, car c'est la seule qui vous permet de retoucher les boutons, les champs et les totaux du panier plutôt que de les hériter. Sur une boutique où le panier est la page la moins personnalisée que vous possédez, c'est tout le travail.

Si votre thème rend déjà bien le tableau du panier, l'Éditeur de site fait le reste gratuitement. Ajouter un badge de confiance et une grille de produits autour du panier ne nécessite pas de plugin payant.

SeedProd peut également créer un thème WooCommerce complet avec le plan Elite, couvrant la page boutique, les archives de produits, les pages de produits uniques, le panier et la commande. Prenez donc cette voie si le panier n'est pas la seule page que vous souhaitez modifier.

Payer pour un plugin afin de modifier une seule page est une objection légitime. C'est pourquoi la voie gratuite de l'Éditeur de site est la première dans le tableau. Si le panier est la seule page que vous toucherez jamais, les calculs ne favorisent pas Elite.

Un modèle personnalisé ne casse pas la commande, car la commande est une page WooCommerce distincte avec son propre modèle. Le passage de l'une à l'autre est la seule chose qui peut casser, et l'étape 4 explique comment prouver que ce n'est pas le cas.

Quand vous êtes mieux sans page de panier

Votre boutique n'a peut-être pas du tout besoin d'une page de panier, et il existe trois façons courantes de la réduire ou de la supprimer.

• Un panier latéral : un panneau qui glisse sur la page produit lorsqu'une personne ajoute un article, afin qu'elle ne quitte jamais la page qu'elle était en train de consulter.
• Ignorer le panier : le bouton Ajouter au panier envoie l'acheteur directement à la caisse, supprimant une étape du parcours.
• Fusionner le panier et la caisse : une seule page contient la revue du panier et le formulaire de paiement, de sorte que l'acheteur voit le total et les champs ensemble.

Aucune de ces options n'est un comportement de base de WooCommerce. Un panier latéral provient généralement de votre thème ou d'un plugin dédié, et ignorer le panier nécessite également un plugin.

L'appel dépend de la taille du panier, donc si les acheteurs achètent un article à la fois, la page du panier est un obstacle et la supprimer est la bonne décision.

Conservez la page du panier si les paniers contiennent généralement plusieurs produits, ou si vous proposez un seuil de livraison gratuite. Les deux nécessitent un écran où l'acheteur peut voir le total en cours et décider d'ajouter plus d'articles.

Une page de panier personnalisée récupère les ventes que la mise en page par défaut perd

Une page de panier personnalisée permet de récupérer des ventes car celle par défaut les fait perdre sur des détails que vous pouvez vérifier vous-même. Ouvrez votre page de panier dans un onglet et votre page d'accueil dans un autre, puis comparez les deux.

Le panier par défaut n'a pas de logo, pas de signal de confiance et rien pour suggérer un deuxième produit. Sur un téléphone, le bouton de paiement se trouve généralement en dessous de la ligne de flottaison.

Le panier est la page que j'ai toujours trouvée intacte lorsque je reprends une boutique, car les propriétaires stylisent la page d'accueil et les pages produits, puis manquent d'énergie.

Environ 70 % des paniers d'achat en ligne sont abandonnés, selon le Baymard Institute, ce qui représente une moyenne de 70,22 % sur 50 études distinctes. L'abandon de panier d'achat a de nombreuses causes, et la page du panier est la partie que vous contrôlez.

Chacune des solutions ci-dessous comble une de ces lacunes. Voici donc quelques façons d'optimiser votre panier WooCommerce pour les conversions :

• Offrez la livraison gratuite ou montrez à quel point les clients sont proches de s'en qualifier
• Appliquez des remises automatiques ou affichez clairement les champs de code de réduction
• Rendez les totaux du panier faciles à lire et à comprendre
• Ajoutez des signaux de confiance tels que des témoignages, des avis ou des badges de sécurité
• Mettez à jour le total instantanément lorsque quelqu'un modifie une quantité, sans rechargement de page et sans bouton de mise à jour séparé

Comment personnaliser la page de panier WooCommerce

La méthode qui fonctionne sur n'importe quel thème consiste à construire la page du panier dans un constructeur visuel, puis à y pointer WooCommerce. Beaucoup de gens se tournent plutôt vers un plugin de panier d'achat, ce qui est une décision raisonnable si tout ce que vous voulez est de retoucher le tableau existant.

SeedProd est un constructeur de sites web WordPress par glisser-déposer avec des blocs WooCommerce intégrés, y compris le bloc Panier utilisé dans cette construction. Vous modifiez donc visuellement et observez la page du panier changer pendant que vous travaillez.

Au cours des 15 dernières années, j'ai travaillé sur la plupart des constructeurs de sites web visuels du marché. C'est celui que j'utilise sur nos propres sites. Voici cette méthode, étape par étape.

Étape 1. Installer et activer SeedProd

La première étape consiste à télécharger une copie du plugin de page de destination WordPress SeedProd.

Installez et activez ensuite le plugin sur votre site web WordPress. Pour obtenir de l'aide à cette étape, consultez ce guide détaillé sur l'installation d'un plugin WordPress.

J'utilise le plan Elite ici, car c'est là que résident les blocs WooCommerce. Rien dans les étapes ci-dessous ne change avec un plan différent. Vous ne trouverez tout simplement pas le bloc Panier.

Après avoir activé SeedProd sur votre site WordPress, allez dans SeedProd » Paramètres et entrez votre clé de licence produit.

Étape 2. Créez un nouveau modèle de page de panier WooCommerce

Après avoir activé votre clé de licence, allez dans SeedProd » Pages et cliquez sur le bouton « Ajouter une nouvelle page de destination » pour créer votre page de panier.

À partir de là, vous pouvez choisir un modèle de page de panier à utiliser comme structure pour votre conception.

SeedProd fournit plus de 300 modèles adaptatifs pour mobile dans les plans Pro et Elite, couvrant la plupart des secteurs d'activité. Lorsque vous en trouvez un qui vous plaît, placez votre curseur dessus et cliquez sur l'icône « Coche » pour le lancer.

Pour une page de panier, je commence toujours par le Modèle vierge, car une page de panier a besoin de deux colonnes et de très peu d'autre chose. Un modèle marketing vous donne simplement des sections à supprimer.

Après avoir choisi votre modèle, une fenêtre contextuelle s'ouvre. Ajoutez un nom et une URL pour votre page. Cliquez ensuite sur le bouton « Enregistrer et commencer à modifier la page » pour ouvrir le modèle dans l'éditeur visuel de SeedProd.

Étape 3. Personnaliser la mise en page et la conception de la page de panier

Concevez d'abord la vue téléphone, puis celle de bureau, car une mise en page de panier qui fonctionne sur un téléphone fonctionne presque toujours sur un écran large. Utilisez le sélecteur d'appareils de l'éditeur pour basculer entre les deux.

Vérifiez vos propres analyses pour la répartition bureau et mobile plutôt que de faire des suppositions, puis concevez pour celui qui est le plus performant.

La mise en page qui fait le plus de travail sur une page de panier est une barre latérale de contenu. Le panier va dans la colonne large, les témoignages et les évaluations par étoiles dans la colonne étroite. La preuve sociale reste alors à l'écran pendant que l'acheteur lit le total.

L'éditeur de site web par glisser-déposer de SeedProd a une disposition distincte à 2 colonnes qui le rend facile à utiliser :

1. À gauche se trouvent les blocs et les sections pour personnaliser votre conception
2. À droite se trouve un aperçu en direct de votre page

Ajouter du contenu à votre page de panier est aussi simple que de faire glisser un bloc de la gauche vers votre aperçu à droite.

Ajouter un logo

Le logo est le signal de confiance le moins cher sur une page de panier et le plus rapide à ajouter, car un acheteur qui arrive sur un panier non marqué s'arrête pour vérifier qu'il est toujours sur votre site.

Vous avez d'abord besoin d'une section pour contenir les éléments de votre page. Choisissez une disposition de section, telle que la section standard.

Ensuite, choisissez le bloc « Image » et faites-le glisser sur votre nouvelle section à droite.

Cliquer sur le bloc image ouvre le panneau des paramètres de contenu. Téléchargez un logo depuis votre ordinateur ou votre médiathèque WordPress. À partir de là, vous pouvez ajouter un lien vers votre page d'accueil, redimensionner votre logo et modifier l'alignement.

Ajouter un panier WooCommerce

Ajoutez maintenant votre panier d'achat WooCommerce au design. Ajoutez une nouvelle section et choisissez la disposition de barre latérale de contenu.

La colonne large contient le panier. La colonne étroite est l'endroit où va la preuve sociale.

Pour ajouter votre panier WooCommerce à la page, faites défiler vers le bas jusqu'à la section des blocs WooCommerce et faites glisser le bloc « Panier » sur votre nouvelle section.

Cliquez sur l'icône des paramètres du panier et l'onglet Styles se divise en cinq groupes, chacun contrôlant une partie différente du panier :

• En-têtes : la couleur du texte, l'arrière-plan et la police de la ligne d'en-tête du panier
• Boutons : le style du bouton (Plat, 2D, Vintage, Fantôme ou Lien), la couleur et le rayon des coins
• Champs : les couleurs d'arrière-plan, de texte et de bordure des entrées de code de coupon et de quantité
• Alertes : les couleurs de surlignage pour les messages d'information, d'erreur et de succès
• Panier : la bordure, l'arrière-plan, la couleur du texte et les polices du conteneur

J'ai changé les couleurs des boutons pour correspondre à la marque et au logo du magasin.

Le bouton de paiement est le seul bouton sur cette page que vous voulez que quelqu'un appuie. Faites-en la chose la plus évidente à l'écran.

Ajouter des avis et des témoignages

Cette deuxième colonne est là où je mets les témoignages clients et les évaluations par étoiles, car la preuve sociale peut pousser un acheteur qui est sur le point de finaliser sa commande à le faire.

Pour ajouter des témoignages à votre page de panier WooCommerce, trouvez le bloc Témoignages sous la rubrique des blocs « Avancé ». Faites-le glisser dans votre colonne étroite à droite.

Comme pour tous les blocs SeedProd, cliquer dessus affiche les paramètres de personnalisation du contenu. Vous pouvez ajouter une photo personnalisée et le nom du client, et modifier l'alignement. Plusieurs avis peuvent être présentés dans un carrousel de témoignages.

Pour rendre vos avis encore plus convaincants, faites glisser le bloc Évaluation par étoiles et placez-le sous votre carrousel de témoignages.

Gardez les évaluations au même niveau que les totaux du panier plutôt qu'en dessous, car l'acheteur lit alors le prix et la réassurance en un coup d'œil.

Ajouter de la rareté et de l'urgence

L'urgence fonctionne sur une page de panier car l'acheteur a déjà décidé qu'il voulait l'article.

La façon la plus simple d'ajouter de la rareté à votre page de panier WooCommerce est d'utiliser un minuteur de rareté ou une horloge de compte à rebours. SeedProd a cette option intégrée, et c'est aussi l'une des voies les plus rapides vers un clic sur paiement WooCommerce.

Sélectionnez le bloc « Compte à rebours » dans la section des blocs « Avancé ». Faites-le glisser en haut de votre panier. Sélectionnez ensuite l'option « Minuteur visiteur » afin que le minuteur se rafraîchisse pour chaque visiteur.

Ensuite, dans l'onglet des paramètres avancés, vous pouvez personnaliser les couleurs pour qu'elles correspondent au reste de votre panier.

Ajoutez maintenant un titre indiquant aux gens combien de temps dure l'offre. Faites glisser le bloc « Titre » et entrez votre texte.

Ventes croisées de produits WooCommerce

Le panier est le meilleur endroit sur votre boutique pour suggérer un deuxième produit, car l'acheteur s'est déjà engagé à acheter quelque chose et la demande est minime.

SeedProd propose plusieurs grilles de produits qui affichent les produits sur n'importe quelle page.

Rendez-vous dans la section des blocs « WooCommerce » et choisissez parmi :

• Produits récents
• Produits en promotion
• Produits les plus vendus
• Produits en vedette
• Produits les mieux notés

Par exemple, faites glisser le bloc « Produits en promotion ». Ajoutez-le juste en dessous de votre panier WooCommerce.

Ces grilles sont statiques, donc tout le monde voit les mêmes produits. WooCommerce a également ses propres ventes croisées, que vous définissez par produit et qui n'apparaissent que lorsque ce produit est dans le panier.

Utilisez une grille statique lorsque votre catalogue est petit et que la plupart des articles conviennent à la plupart des acheteurs. Utilisez les ventes croisées de WooCommerce, ou le bloc Upsells de SeedProd, lorsque la bonne suggestion dépend de ce qui est déjà dans le panier.

Ajout d'un champ de coupon et d'un calculateur d'expédition

Les totaux du panier et un calculateur d'expédition sont les deux éléments que les acheteurs recherchent avant de s'engager, et tous deux font partie du bloc Panier plutôt que des blocs séparés que vous faites glisser.

Le code de coupon et les champs de quantité sont le groupe « Champs » dans l'onglet Styles, c'est donc là que vous les restylez. Vous changez leur apparence, pas leur présence.

Leur présence dépend de WooCommerce, alors activez le calculateur d'expédition sous WooCommerce » Paramètres » Expédition, et créez vos codes de coupon sous Marketing » Coupons.

Un acheteur qui ne peut pas voir le coût d'expédition suppose le pire, donc l'afficher dans le panier élimine cette supposition avant la page de paiement.

Conception de la page de panier vide

Une page de panier vide est une impasse sur la plupart des boutiques, car elle indique que le panier est vide et s'arrête là, ce qui gâche la visite de quelqu'un qui faisait des achats il y a une minute.

Le propre bloc de panier de WooCommerce gère cela sur un thème de bloc. Lorsque le panier ne contient rien, le bloc passe à sa vue de panier vide avec un message et des suggestions de produits.

Sur une page de constructeur, vous concevez cet état vous-même, car les blocs que vous placez autour du panier sont du contenu de page ordinaire et continuent de s'afficher, que le panier contienne des articles ou non.

Remplissez la colonne étroite avec une grille de produits récents et un lien de retour vers votre boutique, et un panier vide offre toujours une direction.

Videz votre propre panier et chargez la page avant de publier. C'est l'état que vous ne verrez jamais par accident. Un acheteur y arrive après avoir vidé le panier ou après l'expiration de sa session.

Garder la page de panier rapide et accessible

Une page de panier implique plus de travail qu'une page de destination. Elle exécute des requêtes WooCommerce et recalcule les totaux. Sur de nombreuses boutiques, elle charge également un script de paiement avant que quiconque ne l'ait demandé.

Vous contrôlez deux de ces éléments, alors réduisez le poids du constructeur lui-même et arrêtez le chargement des scripts non critiques sur cette page.

Lorsque j'ai mesuré la même page de destination construite dans trois constructeurs avec GTmetrix, SeedProd a pris 556 ms et 16 requêtes. Elementor a pris 1 882 ms et 32 requêtes.

Query Monitor a montré le même schéma côté serveur, où SeedProd a utilisé 4,3 Mo de mémoire et 34 requêtes de base de données contre 13,0 Mo et 86 pour Divi.

C'étaient des pages de destination, pas des pages de panier. Une page de panier ajoute son propre travail WooCommerce, alors lisez les chiffres comme la part du constructeur dans le poids et rien de plus.

Un panier est un formulaire, alors vérifiez qu'il fonctionne sans souris. Parcourez les champs de quantité, le champ coupon et le bouton de paiement dans l'ordre. Vérifiez ensuite que le bouton et les totaux ont un contraste suffisant pour être lus sur un téléphone en extérieur.

Étape 4. Publier et définir votre page de panier WooCommerce

Lorsque votre page de panier est prête, cliquez sur la flèche déroulante à côté du bouton vert Enregistrer et sélectionnez Publier.

La publication ne change rien pour le moment. WooCommerce continue de servir l'ancienne page de panier jusqu'à ce que vous lui disiez le contraire.

Le changement se fait dans les paramètres du plugin WooCommerce, alors accédez à WooCommerce » Paramètres et cliquez sur l'onglet Avancé.

Ensuite, à côté de l'en-tête « Page du panier », sélectionnez la nouvelle page de panier que vous avez créée avec SeedProd. N'oubliez pas de cliquer sur le bouton Enregistrer les modifications en bas de l'écran.

Cet écran change entre les versions de WooCommerce, donc si la disposition de votre boutique diffère, WooCommerce le documente dans son propre guide des paramètres.

Désormais, lorsque les clients cliquent sur le lien « Voir le panier » sur votre site Web, ils verront votre nouvelle page de panier WooCommerce personnalisée.

Il est utile de confirmer que le changement a bien eu lieu avant de passer à autre chose.

Vérifiez que la nouvelle page de panier est bien servie

La publication de la page ne prouve pas que les acheteurs l'obtiennent. Testez-la comme le ferait un acheteur, en cinq étapes.

J'effectue toujours cela dans une fenêtre privée, car en étant connecté en tant qu'administrateur, vous pouvez regarder une version différente ou mise en cache de la page que celle qu'un acheteur obtient.

1. Ouvrez votre boutique dans une fenêtre de navigation privée afin de ne pas être connecté en tant qu'administrateur.
2. Ajoutez un produit au panier, puis cliquez sur « Voir le panier ».
3. Vérifiez que l'URL dans la barre d'adresse correspond à la page que vous avez créée, et non à l'ancienne page du panier.
4. Modifiez une quantité et confirmez que le total est mis à jour.
5. Cliquez pour passer à la caisse et arrêtez-vous avant de payer.

Cela vous indique que la page fonctionne. La question de savoir si elle a généré des revenus est une question distincte, et le panier est l'une des rares pages où vous pouvez voir la réponse.

Configurez le suivi des conversions WooCommerce afin de pouvoir comparer la part des paniers qui atteignent la caisse avant et après la modification, puis donnez-lui un mois de données avant de juger.

Si le lien « Voir le panier » lui-même se comporte mal, c'est un défaut différent, et ce guide sur comment réparer le lien « Voir le panier » de WooCommerce qui ne fonctionne pas le couvre.

Dépannage d'une page de panier WooCommerce personnalisée

Trois problèmes surviennent dans ce travail, et ils donnent tous l'impression que la page du panier est cassée.

Ce que vous voyez	Ce qui en est la cause	Comment le réparer
La page du panier s'affiche comme vide, même avec des articles dans le panier	La page ne contient ni le bloc Panier WooCommerce ni le shortcode [woocommerce_cart]	Ouvrez la page et ajoutez l'un des deux. Sur un modèle SeedProd, cela signifie le bloc Panier du groupe de blocs WooCommerce.
Votre modèle personnalisé ne s'applique pas	WooCommerce pointe toujours vers l'ancienne page du panier, ou le modèle de panier du thème actif prend le dessus	Vérifiez le paramètre Page du panier sous WooCommerce » Paramètres » Avancé, puis confirmez quel thème est actif et si un constructeur contrôle cette page.
Le paramètre de la page du panier s'est réinitialisé de lui-même	La page vers laquelle il pointait a été mise à la corbeille, dupliquée ou remplacée, de sorte que WooCommerce a perdu la référence	Réglez-la à nouveau et laissez la page d'origine publiée. WooCommerce stocke ce paramètre sous forme d'ID de page, pas d'URL.

Une page de panier WooCommerce doit contenir soit le bloc Panier, soit le shortcode [woocommerce_cart], et elle doit être la page sélectionnée sous WooCommerce » Paramètres » Avancé. Les trois défauts reviennent à l'un de ces deux.

Vérifiez ces deux éléments avant de changer quoi que ce soit d'autre, car sur les boutiques que j'ai gérées, l'un d'eux était la cause presque à chaque fois.

FAQ sur la personnalisation de la page de panier WooCommerce

Comment ajouter des champs personnalisés à la page panier WooCommerce ?

Pas avec le bloc Panier seul. Il stylise les champs existants du panier, les champs de code de coupon et de quantité, plutôt que d'en ajouter de nouveaux.

Si vous avez besoin de collecter quelque chose de plus, ajoutez-le plutôt comme champ de paiement. WooCommerce transmet les champs de paiement à la commande. Un formulaire que vous placez à côté du panier est du contenu de page, et il ne voyage pas avec la commande.

La personnalisation de la page panier affectera-t-elle mon processus de paiement ?

Non. La caisse est une page WooCommerce distincte avec son propre modèle, donc la refonte de la page du panier ne la touche pas.

La seule chose qui peut casser est le passage de l'une à l'autre. Si votre page de panier perd son bouton « Passer à la caisse », les acheteurs ne peuvent pas passer. Il en va de même si vous pointez WooCommerce vers une page sans panier.

Testez le chemin complet dans une fenêtre privée après avoir publié.

Puis-je personnaliser la page de panier WooCommerce gratuitement ?

Partiellement. Sur un thème bloc, vous pouvez modifier le modèle du Panier dans l'éditeur de site WordPress sans frais, ce qui couvre la mise en page, les couleurs et tous les blocs que vous ajoutez autour du panier.

La méthode SeedProd de ce guide nécessite le plan Elite, car c'est le plan sur lequel repose le bloc Panier WooCommerce. Les plans Gratuit, Basic, Plus et Pro ne l'incluent pas.

Une page panier WooCommerce personnalisée fonctionne-t-elle correctement sur mobile ?

Oui, si vous vérifiez l'ordre d'empilement, car une mise en page de panier à deux colonnes se réduit à une seule colonne sur un téléphone et la colonne empilée en second se retrouve en bas d'un long défilement.

Prévisualisez la page à la largeur d'un téléphone avant de publier. Placez le panier et son bouton de paiement au-dessus des témoignages. Le bouton dont un acheteur a besoin ne doit pas se trouver sous la preuve sociale.

Vous avez maintenant une page panier qui correspond au reste de votre boutique, et un moyen de savoir si quelque chose a changé.

Avec SeedProd, vous le construisez visuellement, sans écrire une ligne de code. Les blocs WooCommerce utilisés dans ce tutoriel, y compris le Panier, sont sur le plan Elite, qui couvre également la page boutique, les archives de produits, les pages de produits uniques et le paiement.

L'autre page que la plupart des boutiques laissent par défaut sur le thème est la page boutique WooCommerce.

Merci de votre lecture ! Nous serions ravis d'entendre vos réflexions, alors n'hésitez pas à rejoindre la conversation sur YouTube, X et Facebook pour plus de conseils et de contenu utiles pour développer votre entreprise.