Comment créer une page de panier WooCommerce personnalisée (sans code)

La page de panier WooCommerce par défaut fonctionne, mais elle est basique et ne correspond souvent pas à votre style.

Lors de nos tests de divers constructeurs de pages, nous avons découvert que SeedProd rend étonnamment facile la création d'une page de panier personnalisée sans toucher une seule ligne de code.

Nous avons exploré les fonctionnalités WooCommerce de SeedProd et constaté que la personnalisation de la page de panier est plus simple et plus puissante que prévu. Ce qui nécessitait auparavant un développeur peut maintenant être fait en quelques clics grâce à leur interface glisser-déposer.

Dans ce guide, nous vous montrerons exactement comment créer une page de panier WooCommerce personnalisée sans aucun codage.

Pourquoi créer une page de panier WooCommerce personnalisée dans WordPress ?

WooCommerce est livré avec une page de panier intégrée. Il suffit d'installer et d'activer ce plugin, et votre boutique en ligne commencera à utiliser la page de panier par défaut automatiquement.

Lorsque vos visiteurs ont des articles dans leur panier, ils sont très proches de faire un achat. Cependant, des recherches montrent que près de sept clients sur dix abandonneront leur panier et ne reviendront jamais.

Dans cet esprit, votre page de panier doit faire tout son possible pour sécuriser la vente.

En remplaçant la conception par défaut par une page de panier personnalisée, vous pouvez souvent améliorer les taux de conversion de votre boutique en ligne.

Même la simple personnalisation de la page avec votre propre image de marque et un logo personnalisé peut améliorer l'expérience client et augmenter vos taux de conversion.

Dans cet esprit, nous allons vous montrer comment personnaliser votre page de panier WooCommerce sans code. Voici un aperçu rapide de tout ce que nous aborderons dans les sections suivantes :

• Comment créer une page de panier WooCommerce personnalisée dans WordPress (étape par étape)
• Tutoriel vidéo
• Conseil bonus : Comment améliorer davantage les conversions de la page de panier WooCommerce

Plongeons dans le vif du sujet !

Comment créer une page de panier WooCommerce personnalisée dans WordPress

Le moyen le plus simple de créer des pages personnalisées pour votre boutique WooCommerce est d'utiliser SeedProd.

C'est le meilleur constructeur de pages WordPress et il est livré avec plus de 300 modèles conçus par des professionnels. Ceux-ci incluent des modèles eCommerce pour créer des pages de vente et des pages de capture de prospects.

Mieux encore, SeedProd prend entièrement en charge WooCommerce et est même livré avec des blocs WooCommerce spéciaux qui vous permettent d'afficher vos produits les plus vendus, les articles les plus populaires, les dernières ventes, et plus encore.

Plusieurs de nos marques partenaires ont construit l'intégralité de leurs sites Web en utilisant le plugin et ont reçu d'excellents retours de leurs utilisateurs sur les nouvelles conceptions. Pour en savoir plus, consultez notre avis sur SeedProd.

Maintenant, la première chose à faire est d'installer et d'activer le plugin. Pour plus de détails, vous pouvez consulter notre guide étape par étape sur comment installer un plugin WordPress.

Après l'activation, naviguons vers SeedProd » Paramètres et saisissons votre clé de licence.

Vous pouvez trouver ces informations sous votre compte sur le site Web SeedProd. Après avoir entré la licence, cliquez sur le bouton « Vérifier la clé ».

Une fois que vous avez fait cela, vous voudrez aller dans SeedProd » Pages de destination et cliquer sur le bouton « Ajouter une nouvelle page de destination ».

Après cela, vous devez choisir un modèle de page de panier.

Les modèles de SeedProd sont organisés en différents types de campagnes, tels que les pages « Bientôt disponible » et les pages 404. Vous pouvez cliquer sur les onglets en haut de l'écran pour filtrer les modèles en fonction du type de campagne.

Lorsque vous trouvez un modèle que vous souhaitez utiliser, vous devrez le survoler et cliquer sur l'icône « Coche ».

Pour ce tutoriel, nous allons utiliser le « Modèle vierge » car il nous permet d'ajouter uniquement les sections que nous souhaitons.

Sur l'écran suivant, vous nommerez votre page de panier.

SeedProd créera automatiquement une URL basée sur le titre de la page, mais vous pouvez modifier cette URL comme vous le souhaitez.

Lorsque vous êtes satisfait des informations que vous avez saisies, cliquons sur le bouton « Enregistrer et commencer à modifier la page ».

Cela chargera le constructeur de pages SeedProd. C'est un éditeur simple par glisser-déposer qui affiche un aperçu en direct de votre page de panier personnalisée à droite et certains paramètres à gauche.

Pour commencer, nous allons ajouter une image en haut de la page. Nous vous recommandons d'utiliser une image qui ressemble à l'en-tête habituel de votre boutique, car cela maintiendra votre image de marque et sa cohérence.

Nous voulons que l'image d'en-tête remplisse toute la largeur de la page de panier, alors cliquons sur la première mise en page dans la boîte « Choisissez votre mise en page ».

Cela créera une mise en page pleine largeur.

Maintenant, sélectionnez le bloc « Image » dans le menu de gauche et faites-le glisser sur la mise en page.

Pour télécharger votre image, cliquez pour sélectionner le bloc « Image ».

Dans le menu de gauche, cliquons sur « Utiliser votre propre image » et sélectionnons une image de la médiathèque ou téléchargeons un nouveau fichier depuis votre ordinateur.

Les paramètres à gauche vous permettent de personnaliser davantage l'image. Par exemple, vous pouvez ajouter du texte alternatif d'image et modifier la taille de l'image.

Lorsque vous êtes satisfait de l'apparence de l'en-tête, vous pouvez cliquer sur l'icône « Ajouter des colonnes » dans la section « Faites glisser un nouveau bloc ici ».

Vous pouvez maintenant choisir la mise en page que vous souhaitez utiliser pour la zone principale de la page de panier.

Allez-y et cliquez sur la mise en page avec contenu et barre latérale.

Cela vous permet de créer une section pour votre panier et un espace où vous pouvez afficher les témoignages clients pour augmenter les conversions.

Dans le menu de gauche, faites défiler jusqu'à la section « WooCommerce ». Ici, trouvons le bloc « Panier » et faisons-le glisser sur votre mise en page.

Après cela, vous pouvez personnaliser chaque partie du panier à l'aide du menu de gauche.

Cela inclut la modification des polices, des couleurs, des boutons, et plus encore.

Lorsque vous êtes satisfait de l'apparence de la zone du panier, il est temps d'ajouter un bloc de témoignages. Il s'agit d'une forme de preuve sociale qui encouragera les visiteurs à finaliser leur achat.

Trouvez simplement le bloc « Témoignages » et faites-le glisser sur votre mise en page.

Vous pouvez maintenant modifier l'apparence des témoignages sur votre boutique en ligne.

Par exemple, dans le menu de gauche, vous verrez des paramètres pour changer la couleur de la bulle de commentaire, modifier l'alignement et ajouter d'autres témoignages clients.

Une autre excellente idée est d'afficher une évaluation par étoiles sous votre témoignage.

Pour ce faire, trouvez simplement le bloc « Notation par étoiles » et faites-le glisser sous le bloc de témoignages.

La rareté peut encourager vos clients à acheter maintenant, plutôt que d'attendre et de risquer de manquer une opportunité. Dans cette optique, vous pourriez vouloir ajouter un compte à rebours qui décomptera les minutes jusqu'à l'expiration du panier du visiteur.

Pour créer ce sentiment d'urgence, trouvez le bloc « Compte à rebours » et faites-le glisser en haut de votre panier.

Nous voulons afficher un minuteur différent pour chaque visiteur, vous devrez donc ouvrir le menu déroulant « Type de minuteur » et sélectionner « Minuteur visiteur (Pérenne) ».

Par défaut, le minuteur démarre à 30 minutes, mais vous pouvez le modifier en saisissant un nouveau nombre dans la section « Définir le minuteur pour ».

Nous voulons informer les acheteurs que leur panier expirera lorsque le minuteur atteindra 0, ajoutons donc un bloc « Titre » au-dessus.

Vous pouvez ensuite taper le texte que vous souhaitez afficher aux acheteurs.

Vous pouvez encourager les gens à ajouter plus d'articles à leur panier en créant une section produits populaires.

Pour promouvoir les meilleures ventes de votre magasin, faites simplement glisser et déposez un bloc « Produits les plus vendus » sur votre mise en page.

Par défaut, ce bloc affichera vos produits les plus populaires, mais vous pouvez utiliser les paramètres pour afficher les produits en promotion, vos produits les plus récents, et plus encore.

Pour ce faire, ouvrez simplement le menu déroulant « Type » et choisissez une nouvelle option.

Pour plus de détails, veuillez consulter notre guide sur comment afficher les produits populaires dans WooCommerce.

Lorsque vous êtes satisfait de l'apparence de la page du panier, il est temps de la publier. Cliquez sur la flèche déroulante à côté de « Enregistrer », puis sélectionnez l'option « Publier ».

Ensuite, vous devrez modifier l'URL du panier dans les paramètres de WooCommerce.

Allez simplement dans WooCommerce » Paramètres, puis basculez vers l'onglet « Avancé ».

Dans cet onglet, vous devrez ouvrir le menu déroulant « Page du panier » et commencer à taper l'URL de votre page personnalisée.

Lorsque la bonne page apparaît, cliquez simplement dessus pour la sélectionner.

Tutoriel vidéo

Si vous êtes plutôt un apprenant visuel, vous voudrez peut-être consulter notre tutoriel vidéo sur la création d'une page de panier WooCommerce personnalisée :

S'abonner à WPBeginner

Conseil bonus : Comment améliorer davantage les conversions de la page de panier WooCommerce

Une fois que vous avez créé une page de panier WooCommerce personnalisée, il existe de nombreuses façons de réduire l'abandon de panier et d'augmenter les ventes. Cela vous aide à gagner plus d'argent grâce à votre trafic existant.

Voici quelques moyens simples d'y parvenir.

1. Suivez vos conversions

L'abandon de panier est un problème majeur pour tous les magasins en ligne. En fait, 60 à 80 % des personnes qui ajoutent des articles à leur panier n'achètent pas. (Source : Statistiques sur l'abandon de panier)

Le suivi des conversions vous aide à comprendre ce qui fonctionne sur votre page de panier et ce qui ne fonctionne pas. Vous pouvez ensuite utiliser SeedProd pour affiner votre page de panier personnalisée afin que davantage de clients finalisent leurs achats.

La manière la plus simple de suivre les conversions WooCommerce est d'utiliser Google Analytics. Cependant, la configuration d'Analytics et la création d'objectifs Google Analytics manuellement nécessitent l'écriture de beaucoup de code personnalisé.

Dans cette optique, nous vous recommandons d'utiliser MonsterInsights. C'est le meilleur plugin Google Analytics pour WooCommerce et il est livré avec un module complémentaire eCommerce qui permet le suivi des conversions en quelques clics seulement.

Pour suivre les conversions de votre panier WooCommerce, consultez notre guide étape par étape sur comment configurer le suivi des conversions WooCommerce.

2. Réduisez l'abandon de panier avec des pop-ups chronométrés dans WooCommerce

Vous pouvez également réduire l'abandon de panier avec une fenêtre contextuelle chronométrée. La manière la plus simple et la plus efficace de le faire est d'utiliser OptinMonster.

C'est le meilleur plugin de fenêtre contextuelle WordPress, et sa technologie unique Exit-Intent® affiche les fenêtres contextuelles exactement au moment où un acheteur est sur le point de quitter la page du panier. Vous pouvez même utiliser ce logiciel pour offrir aux acheteurs un code de réduction spécial s'ils finalisent l'achat maintenant.

OptinMonster dispose d'un puissant ensemble de fonctionnalités de ciblage et de personnalisation.

Par exemple, si vous avez déjà offert un coupon à l'acheteur, vous pouvez alors lui montrer une fenêtre contextuelle éducative à la place. Par exemple, vous pourriez l'encourager à vous contacter et à poser toutes les questions qu'il pourrait avoir sur vos produits.

OptinMonster vous permet de créer différentes campagnes, y compris des fenêtres contextuelles, des tapis de bienvenue plein écran, des barres flottantes, des boîtes de défilement et des insertions.

Par exemple, si un client ajoute un article à son panier et ne finalise pas l'achat, vous pouvez lui proposer un coupon pour ce produit exact en utilisant une insertion.

Pour plus de détails, consultez notre guide sur comment créer une fenêtre contextuelle WooCommerce pour augmenter les ventes.

3. Augmentez les ventes avec des notifications d'activité sociale dans WooCommerce

Les notifications d'activité sociale montrent tous les produits que les acheteurs achètent en temps réel. Cela peut rassurer les acheteurs sur le fait que vous êtes un site Web populaire et digne de confiance, et utiliser également la peur de manquer quelque chose (FOMO) pour les pousser à acheter.

La manière la plus simple d'ajouter des notifications de preuve sociale à votre page de panier est avec TrustPulse.

C'est le meilleur plugin de preuve sociale pour WordPress et WooCommerce du marché et il a été prouvé qu'il augmente les conversions de 15%.

Nos marques partenaires l'utilisent pour afficher les achats en direct dans leurs boutiques, ce qui a amélioré leurs taux de conversion. Pour plus de détails, consultez notre avis sur TrustPulse.

Vous pouvez ajouter le plugin à votre site en quelques minutes seulement, et commencer à afficher une bulle de notification chaque fois que quelqu'un achète un produit, démarre un essai gratuit, et plus encore.

Pour plus de détails, consultez notre guide sur comment utiliser le FOMO sur votre site WordPress.

Nous espérons que cet article vous a aidé à créer une page de panier WooCommerce personnalisée sans écrire de code. Vous voudrez peut-être aussi consulter notre guide étape par étape sur comment personnaliser la page de connexion WooCommerce et notre sélection d'experts des meilleurs plugins WooCommerce pour votre boutique.

Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.