Saviez-vous qu’un visiteur sur quatre abandonnera votre site Web si le chargement prend plus de quatre secondes ? Même un deuxième retard peut réduire la satisfaction des clients de 16 %. (Source : Expert en création de sites Web)

Avec un temps de chargement de page plus long, vos clients ont plus de chances de partir sans voir ce que votre boutique a à offrir. Ce qui signifie un taux de rebond plus élevé. 

Cela ne fonctionne pas bien avec les moteurs de recherche et ne fait que faire baisser le classement de votre site.

En fin de compte, tout se résume à l’expérience utilisateur. Plus l’expérience utilisateur est bonne, meilleures sont les conversions de votre magasin.

2. Personnalisation

Vous voulez un contrôle total sur l’apparence et la convivialité de votre boutique en ligne ? Pensez ensuite à un thème que vous pouvez facilement personnaliser.

Lors de la création d’une boutique en ligne, l’idée est d’en créer une meilleure que celle de vos concurrents. Votre logo, vos polices et vos couleurs doivent tous refléter l’identité de votre marque.

Alors pourquoi s’en tenir aux paramètres

Vous devez pouvoir personnaliser chaque élément du thème soit à partir du personnalisateur, soit à l’aide d’Elementor. Bien que la plupart des thèmes vous offrent cette flexibilité, il est utile de le vérifier dès le début.

3. Modèles de démonstration

Pourquoi commencer sur une toile vierge alors que vous pouvez tirer parti de certains modèles de boutique prêts à l’emploi ?

Admettez-le. Quand on débute, n’est-il pas plus simple de créer une boutique en ligne en voyant comment c’est déjà fait ? C’est comme faire référence à ce qui fonctionne avant de devenir un pro

Recherchez des thèmes qui vous offrent la flexibilité d’utiliser des modèles de boutique WooCommerce prédéfinis qui peuvent être facilement personnalisés à l’aide d’Elementor.

4. Optimisé pour les ventes mobiles

Les ventes depuis les appareils mobiles sont en constante augmentation. ​​

Les rapports indiquent que les ventes d’appareils mobiles devraient atteindre 3 560 milliards de dollars en 2021, soit 22,3 % de plus que ce qu’elles ont enregistré en 2020.

(Source : Statista)

Estvotre boutique optimisée pour les mobiles ? Votre thème est-il réactif et fonctionne-t-il bien sur tous les appareils ? Si ce n’est pas le cas, nous vous recommandons d’y réfléchir sérieusement.

5. Processus de paiement plus rapide

Commençons

• Le taux moyen d’abandon de panier est de près de 70 % (69,57 pour être précis), et il atteint 85,65 % lorsqu’il s’agit d’utilisateurs mobiles
• En raison de l’abandon de panier, les marques de commerce électronique perdent jusqu’à 18 milliards de dollars de chiffre d’affaires chaque année

La bonne nouvelle est que le même rapport indique également qu’en optimisant l’expérience de paiement, il y a une augmentation de 35,62 % des conversions.

Bien que la raison principale soit l’inclusion de frais supplémentaires, 26 % ont cité le processus de paiement étant trop long lors du paiement.

(Source : Sleeknote)

Toutes ces données prouvent l’importance d’une page de paiement bien conçue.

À moins que vous ne souhaitiez constater une baisse significative de vos revenus de vente, vous devez vous assurer que votre thème dispose d’un processus de paiement optimisé pour la conversion.

6. Assistance géniale

Un peu d’assistance ne serait-elle pas utile de temps en temps ? Et quelle meilleure façon que d’avoir une équipe d’assistance, juste quand vous le souhaitez.

Bien que la plupart des thèmes offrent une assistance via la documentation, il est agréable d’opter pour un thème WordPress qui offre une assistance humaine conviviale.

7. Sécurisé

Enfin, optez pour un thème stable et sécurisé. Celui qui vous permet d’installer à peu près n’importe quel plugin WooCommerce et Elementor sans craindre de casser votre boutique.

Pour faire court, recherchez un thème conçu pour la performance, la conversion et qui fonctionne à merveille. 

Un thème comme Astra ! 🙂

Ce dont vous avez besoin pour créer votre boutique WooCommerce

Comme le titre de cet article le suggère, vous aurez besoin de deux outils principaux pour créer votre boutique au-delà du plugin WooCommerce principal :

• Astra Theme – il s’agit d’un thème WordPress gratuit qui comprend des options de personnalisation approfondies, ainsi qu’une intégration WooCommerce intégrée et des sites de démonstration.
• Elementor – il s’agit d’un générateur de pages gratuit qui vous aidera à personnaliser diverses pages de votre boutique, comme votre page d’accueil et à propos de page.

La seule chose que nous supposerons pour ce didacticiel est que vous avez déjà installé WooCommerce – nous aborderons tout le reste pour donner à votre boutique une apparence et un fonctionnement optimaux.

Si vous avez besoin d’aide pour configurer WooCommerce, consultez notre guide complet.

Une fois WooCommerce installé, voici comment donner à votre boutique un look génial !

Partie 1 : Créer un site Web WooCommerce en moins de 10 minutes

Au-delà de ses options générales de conception légère et de personnalisation, Astra vous aide spécifiquement avec WooCommerce de deux manières principales. 

Vous pouvez :

• Importez des modèles Elementor WooCommerce gratuits, ainsi que les paramètres de personnalisation de WordPress pour créer rapidement une superbe boutique WooCommerce.
• Utilisez l’intégration WooCommerce dédiée d’Astra pour personnaliser les aspects importants de votre boutique via WordPress en temps réel Personnalisateur.

Voici comment utiliser Astra pour configurer le cœur de votre boutique WooCommerce :

Étape 1 : Thème et plug-in 

Pour commencer, vous devrez installer un thème et un plugin. Les deux sont répertoriés sur WordPress.org, ce qui signifie que vous pouvez les installer directement depuis votre tableau de bord WordPress :

• Thème Astra
• Plugin de modèles de démarrage

Étape 2 : Importer le site de démarrage Astra WooCommerce

Une fois que vous avez installé le thème Astra et le plugin Starter Templates, accédez à Appearance → Starter Templates dansvotre tableau de bord WordPress pour importer votre site de démonstration (cet article d’aide contient plus d’informations si nécessaire).

Cela lancera l’assistant de modèle de démarrage pour installer le modèle prédéfini sur votre site Web.

Cliquez sur le bouton « Créez votre site Web maintenant ».

Ensuite, sélectionnez le générateur de pages Elementor :

Vous pouvez ensuite utiliser les options de filtrage pour trouver les différents modèles eCommerce Elementor.

Certains de ces modèles sont gratuits, tandis que d’autres, marqués comme « Premium », nécessitent le plugin Premium Starter Templates qui fait partie de l’Astra Essential Bundle et du Growth Bundle.

N’hésitez pas à choisir n’importe quel site de démonstration qui attire votre attention. Mais pour ce didacticiel, nous allons utiliser le site de démonstration gratuit Brand Store :

Une fois que vous aurez cliqué sur le site de démonstration souhaité, une nouvelle page s’ouvrira où vous pourrez télécharger le logo et la palette de couleurs de votre site Web. Cela vous facilite la vie car vous n’aurez pas à ajouter le logo ni à choisir les couleurs une deuxième fois.

Cependant, si votre logo et vos couleurs ne sont pas prêts, vous pouvez simplement sauter l’étape. Pour ce tutoriel, cliquez sur « Passer et continuer ».

Ensuite, vous rencontrerez une boîte qui vous demandera de remplir vos coordonnées (que vous pouvez choisir de laisser vide) et d’installer les données personnalisées ajoutées au site Web. 

Donc,

Une fois que vous avez cliqué sur le bouton Envoyer & Créer mon site Web, l’importation du site Web commencera. 

Maintenant, vous êtes prêt à vous approprier les choses !

Étape 3 : Utilisez le personnalisateur WordPress pour personnaliser les choses

Astra utilise le personnalisateur WordPress natif pour vous aider à personnaliser l’apparence de votre boutique. Cet outil vous permet d’apporter des modifications sans code à divers aspects de votre boutique et de voir immédiatement les résultats

Pour accéder au personnalisateur WordPress, accédez à Apparence → Personnaliser

En plus des paramètres spécifiques à WooCommerce ici, Astra inclut également des options pour vous aider à personnaliser d’autres aspects de votre site comme les polices, les couleurs, les logos, etc.

Pour une explication complète de ces paramètres, vous pouvez consulter les articles d’assistance sur les paramètres du personnalisateur. Pour ce didacticiel, cependant, nous nous concentrerons spécifiquement sur les intégrations WooCommerce d’Astra.

Ceux-ci vous permettent de contrôler certains aspects de votre boutique tels que :

• Comment fonctionnent vos pages de liste de produits
• Ventes incitatives sur la page de votre panier
• Images de vos produits
• Autres plus petits paramètres

La plupart des paramètres WooCommerce sont situés

Paramètres WooCommerce

Pour accéder à l’ensemble des options, accédez à WooCommerce

• Catalogue de produits – vous permet de contrôler le nombre de produits à afficher sur la page de votre boutique, ainsi que les informations à afficher et le nombre de colonnes de produits à afficher.
• Single Product – vous permet de désactiver le fil d’Ariane.
• Cart – vous permet d’activer les ventes incitatives de produits sur la page de votre panier. Les ventes incitatives peuvent vous aider à augmenter vos ventes en affichant des produits ciblés liés aux produits déjà présents

  

  Cette fonctionnalité est idéale pour promouvoir une vente ou une offre spéciale.

  La modification des Colonnes de la boutique en 4 ajoute un autre produit sur chaque ligne :

  

  Au-delà de la partie WooCommerce, vous pouvez également trouver les paramètres de WooCommerce dans :

  • Global → Conteneur – vous permet de contrôler la largeur de la zone occupée
    

    

    Étapes pour créer un site Web WooCommerce avec Elementor & Thème Astra.

    Partie 2 : Utilisez le générateur de pages Elementor pour personnaliser les pages de votre boutique

    Astra vous aide à personnaliser votre boutique et vos pages produits, ainsi que votre menu de navigation et votre barre latérale.

    Mais lorsqu’il s’agit de peaufiner votre page d’accueil et votre page À propos de nous, c’est là qu’intervient le plugin gratuit de création de pages Elementor.

    Pour modifier votre page d’accueil, cliquez sur Modifier avec Elementor. Elementor facilite :

    • Modifier le texte et les images
    • Déplacer les éléments de conception

      

      Si vous avez besoin d’aide pour utiliser le générateur de pages Elementor pour modifier les pages principales de votre boutique, les vidéos officielles Elementor 101 sont un excellent endroit pour en savoir plus sur Elementor. Si vous êtes un débutant total, vous devez d’abord vous familiariser avec le générateur de pages Elementor.

      Saviez-vous que vous pouvez créer un panier complet, une page de paiement, une page de compte client et bien plus encore en utilisant simplement un shortcode ? 

      Voici une liste complète de codes courts WooCommerce que vous pouvez explorer.

      Meilleurs thèmes Elementor WooCommerce

      Il existe de nombreux thèmes WordPress et beaucoup d’entre eux sont compatibles avec Elementor et WooCommerce.

      Bien que nous ne les ayons pas tous répertoriés ici, nous avons mentionné certains des meilleurs thèmes Elementor WooCommerce. En sélectionnant l’un d’entre eux, vous devriez offrir l’expérience que vous recherchez.

      1. Astra

      

      Avec plus d’un million d’installations et étant le seul thème WordPress non

      Astra est un thème WordPress léger qui offre des intégrations avec Elementor et WooCommerce. De plus, Astra est livré avec des sites de démonstration WooCommerce prêts à l’emploi qui peuvent être facilement personnalisés à l’aide d’Elementor.

      En utilisant Astra, vous obtenez :

      • Des magasins beaucoup plus rapides qui contribuent à augmenter le taux de conversion
      • Un panier déroulant qui permet aux utilisateurs de visualiser leur panier à partir de n’importe quelle page
      • Processus de paiement optimisé pour la conversion, réduisant ainsi les abandons de panier rate
      • Attirez l’attention des utilisateurs avec des bulles de vente qui aident à augmenter les ventes
      • Sites entièrement réactifs qui fonctionnent parfaitement sur tous les appareils
      • Magasins personnalisables sans avoir à écrire une seule ligne de code

      Vous voulez plus de fonctionnalités ? 

      Mettez à niveau vers Astra Pro et obtenez des fonctionnalités WooCommerce supplémentaires telles que :

      • Défilement infini qui charge dynamiquement vos produits à mesure que les utilisateurs continuent de faire défiler
      • Options de paiement supplémentaires pour améliorer l’utilisateurexpériences, telles que les paiements en deux étapes, les paiements sans distraction, et plus encore
      • Plus d’options d’affichage des produits et de galerie qui peuvent être facilement ajustées. Option permettant d’ouvrir les images
        Démarrez avec Astra

        2. Bonjour Elementor + Générateur de thèmes

        

        Elementor est un plugin de création de pages WordPress extrêmement populaire et possède ses propres thèmes que vous voudrez peut-être consulter.

        Les modèles fonctionnent très bien avec WooCommerce et peuvent être personnalisés facilement à l’aide d’Elementor WooCommerce Builder.

        À l’aide des widgets WooCommerce dédiés tels que les prix, les boutons d’ajout au panier et les fonctionnalités du générateur de thèmes Elementor, vous pouvez concevoir votre boutique et vos pages de produits comme vous le souhaitez.

        Commencez avec le thème Bonjour

        3. GénérerPress

        

        GeneratePress est un autre thème WordPress populaire compatible avec WooCommerce.

        À l’aide du personnalisateur WordPress, les paramètres GeneratePress WooCommerce vous permettent de configurer à peu près tout, comme le panier déroulant, le mode de paiement sans distraction, et plus encore.

        Bien que le thème GeneratePress soit disponible gratuitement sur WordPress, pour accéder aux paramètres WooCommerce, vous aurez besoin de GeneratePress Premium.

        Démarrez avec GeneratePress

        4. Névé

        

        Neve est un thème WordPress prêt pour WooCommerce qui est livré avec plusieurs sites Web de démonstration prêts à l’emploi alimentés

        La version gratuite de Neve offre une compatibilité complète avec WooCommerce. Pour plus d’intégration WooCommerce, vous pouvez envisager la version Pro.

        La version Neve Pro contient un module booster WooCommerce qui vous permet de personnaliser les pages de votre boutique, de vos produits et de votre paiement.

        Démarrez avec Neve

        5. OcéanWP

        

        Avec plus de 700 000 installations actives, OceanWP est un thème WordPress populaire doté de nombreuses fonctionnalités intégrées pour les magasins WooCommerce.

        Vous disposez de sites de démonstration WooCommerce prêts à l’emploi, tous alimentés

        Certaines fonctionnalités supplémentaires pour WooCommerce incluent :

        • Aperçu rapide du produit
        • Panier déroulant
        • Bouton flottant d’ajout au panier
        • Paiement sans distraction processus

        OceanWP vous offre de nombreuses options de personnalisation et est compatible avec Elementor.

        Démarrez avec OceanWP

        Quand envisager de devenir pro avec Astra

        Astra et Elementor proposent des versions professionnelles qui peuvent ajouter des fonctionnalités à votre boutique WooCommerce.

        Cette fonctionnalité n’est pas seulement un régal pour les yeux : elle ajoute des fonctionnalités qui peuvent avoir un réel effet sur les résultats de votre magasin en permettant à vos visiteurs d’acheter plus facilement vos produits, ainsi qu’en vous offrant des options pour contrôler la page de paiement de votre magasin :

        • Défilement infini pour les produits : Plus de produits se chargent automatiquement lorsqu’un visiteur fait défiler la page. Recherchedu Baymard Institute suggère que les acheteurs de commerce électronique ont tendance à voir plus de produits avec un défilement infini, ce qui est idéal si votre magasin dispose d’un catalogue complet.
        • Barre latérale hors toile : Cela vous permet d’ajouter des filtres utiles sans gêner la navigation de vos acheteurs. Le filtrage de qualité est un aspect essentiel de toute boutique de commerce électronique. Bien fait, il permet à vos clients de trouver rapidement le bon produit afin qu’ils puissent effectuer leur achat.
        • Aperçu rapide du produit : Les acheteurs peuvent cliquer sur un bouton Aperçu rapide lorsqu’ils survolent un produit pour voir plus d’informations à ce sujet. produit. Cela leur permet de voir des détails importants sans avoir à charger une nouvelle page, ce qui peut faciliter l’expérience d’achat.
        • Plus d’options de paiement : Vous pouvez ajouter un paiement sans distraction ou activer un processus de paiement en deux étapes. Vous pouvez également choisir d’activer ou non le champ du coupon, ainsi que quelques autres paramètres plus petits. Toutes ces options vous aident à peaufiner votre processus de paiement pour garantir que le taux d’abandon de votre panier est aussi bas que possible.
        • Marque blanche : Si vous créez une boutique pour un client, cette fonctionnalité vous permet de supprimer toute la marque Astra du tableau de bord WordPress pour offrir une version finale plus personnalisée. produit.

        Lorsque Astra Pro vous donne accès à des fonctionnalités et fonctionnalités de commerce électronique étendues et uniques, Astra Essential Bundle et Growth Bundle vous permettent d’utiliser premium des sites Web prêts à l’emploi dotés de balises « Premium » de la bibliothèque de sites Web de démarrage.

        

        Elementor vs Elementor Pro : quand mettre à niveau

        La version gratuite d’Elementor fonctionne très bien. Que vous soyez débutant ou développeur de sites Web WordPress chevronné, Elementor offre toute une gamme de possibilités de conception.

        Cependant, si vous recherchez plus d’outils et de fonctionnalités pour améliorer les conversions et les ventes, il y a toujours Elementor Pro.

        Bien que nous nous soyons davantage concentrés sur les aspects WooCommerce et Elementor

        1. Bien que le générateur de thème vous permette de personnaliser chaque élément de votre thème, le générateur de thème d’Elementor Pro vous permet d’aller au-delà des restrictions de thème. À l’aide d’Elementor, vous pouvez concevoir visuellement les différents éléments de votre site Web, tels que l’en-tête, le pied de page, la page d’archive, les publications uniques, etc. Est-ce que cela implique du codage ? Pas du tout! Et cela fonctionne sur à peu près n’importe quel thème WordPress.
        2. Comment créer des formulaires de contact ? Nous pensons que c’est en installant un plugin de formulaire de contact tel que WP Forms, Ninja Forms, Contact Form 7 et bien d’autres. Bien que toutes ces options soient excellentes, le widget de formulaires d’Elementor Pro vous offre la même flexibilité. Concevez vos formulaires à la volée et définissez des alertes et des notifications personnalisées. Vous souhaitez intégrer des outils d’automatisation ou de CRM ? Les widgets Form d’Elementor Pro vous permettent de le faire en quelques clics.
        3. Avez-vous utilisé les modèles et blocs professionnels de la bibliothèque Elementor ? Si c’est le cas, vous savez qu’il existe de nombreuses autres options disponibles

           En plus de ce qui précède, voici pourquoi vous pourriez envisager d’opter pour la version Elementor Pro, surtout si vous possédez une boutique en ligne.

           WooCommerce Fonctionnalités	Elementor Gratuit	Elementor Pro
           Tableau des prix Widget	❌	✅
           Liste de prix Widget	❌	✅
           Archive produitModèle	❌	✅
           SingleModèle de produit	❌	✅
           Woo Produits Widget	❌	✅
           Woo Catégories​ Widget	❌	✅
           Modèles WooCommerce & Blocs​	❌	✅
           20+ WooCommerce Widgets	❌	✅

           WooCommerce, Astra et Elementor : mieux ensemble

           Rassemblez-les tous et WooCommerce, Astra et Elementor constituent une triple menace qui vous permet de créer une boutique de commerce électronique entièrement personnalisée en un rien de temps sans écrire une seule ligne de code.

           N’oubliez pas que tout ce que vous avez à faire est :

           • Installer et configurer WooCommerce
           • Importer un site de démonstration Astra
           • Personnalisez votre boutique via le personnalisateur en temps réel d’Astra paramètres
           • Modifiez votre page d’accueil et d’autres pages principales avec le générateur de pages Elementor

           Maintenant, lancez-vous et commencez à vendre vos produits !