Comment créer une lightbox WooCommerce

L'un des plus grands obstacles auxquels les consommateurs sont confrontés lors de leurs achats en ligne est de trouver rapidement des informations sur les produits. En fait, selon un rapport Forrester, 45 % des adultes américains en ligne abandonneront leur achat en ligne s'ils ne trouvent pas de réponse rapide à leur question .

En ajoutant une lightbox WooCommerce avec une fonctionnalité d'affichage rapide à votre boutique en ligne, vous serez en mesure de créer des flux d'utilisateurs fluides et d'offrir une expérience d'achat en ligne sans friction à vos clients. En d'autres termes, vos clients pourront trouver tout ce dont ils ont besoin - produits, détails sur les produits et informations sur les prix - sans avoir à cliquer sur des pages de produits uniques.

Dans cet article, nous allons approfondir les raisons pour lesquelles vous pourriez envisager d'utiliser un plugin lightbox WooCommerce sur votre boutique en ligne. Nous vous guiderons également à travers un didacticiel étape par étape pour vous montrer comment vous pouvez créer une lightbox WooCommerce avec vue rapide en quatre étapes simples.

Commençons!

Pourquoi avez-vous besoin d'un plugin WooCommerce Lightbox

En tant que propriétaire d'une boutique WooCommerce, vous savez probablement déjà que les clients doivent visiter des pages de produits individuelles pour en savoir plus sur chaque produit. Cependant, cela ne permet pas toujours une expérience d'achat intuitive et conviviale.

Avec un plugin WooCommerce lightbox, vous pouvez permettre aux clients :

• Affichez les images, les galeries et les détails des produits dans une lightbox.
• Sélectionnez les options de produit (par exemple les variations et les quantités) et ajoutez-les à leur panier.

Et la meilleure partie est qu'ils peuvent faire tout cela directement à partir de la page principale de la boutique ou des pages de catégories. Vous pouvez choisir d'inclure des informations telles que l'image ou la galerie du produit, les variantes et les attributs, les sélecteurs de quantité, les boutons d'ajout au panier et des détails supplémentaires sur le produit tels que son prix, ses avis et ses catégories.

Contrairement au flux d'utilisateurs WooCommerce par défaut, le fait d'avoir un plug-in WooCommerce lightbox qui possède également des fonctionnalités de galerie vous permet d'améliorer l'expérience d'achat en ligne de vos clients. Il facilite la visualisation des images et des galeries de produits et permet de trouver rapidement tous les détails importants du produit WooCommerce. Ceci est particulièrement utile pour les magasins en ligne qui vendent des produits centrés sur l'image tels que des vêtements, des bijoux, des photographies ou des articles cadeaux.

Voici quelques-uns des principaux avantages de l'utilisation d'un plug-in pour créer une lightbox avec une fonctionnalité d'affichage rapide :

• Vous n'avez pas besoin de modifier un fichier php. Une fois que vous avez installé et activé le plugin, il créera automatiquement une visionneuse de vue rapide. Il n'est pas nécessaire de modifier le fichier functions.php .
• Style personnalisé avec CSS. Vous pouvez personnaliser votre lightbox pour qu'elle corresponde à votre marque sans avoir à modifier les fichiers CSS.
• Support. Vous avez également accès au support client des développeurs du plugin, c'est-à-dire Barn2 Media.

Comment utiliser WooCommerce Quick View Pro pour créer une visionneuse Quick View

Voici ce dont vous aurez besoin pour créer une lightbox WooCommerce avec une fonctionnalité d'affichage rapide :

• Une boutique alimentée par WooCommerce avec quelques produits ajoutés.
• WooCommerce Quick View Pro - un plug-in réactif de lightbox WooCommerce.

Étape 1 : Installez et activez WooCommerce Quick View Pro

Une fois que vous avez acheté le plugin WooCommerce Quick View Pro, connectez-vous à votre site Web WordPress, installez-le et activez-le. Ensuite, rendez-vous sur la page des paramètres du plugin ( WooCommerce > Paramètres > Produits > Vue rapide ) depuis le tableau de bord WordPress.

Entrez la clé de licence que vous avez reçue dans l'e-mail de confirmation d'achat dans l'option Clé de licence . Cliquez sur le bouton Enregistrer les modifications en bas de l'écran pour continuer.

Si vous visitez la page principale de la boutique de votre boutique en ligne, vous remarquerez que des boutons Aperçu rapide ont été ajoutés directement sous les images des produits. Selon le thème que vous utilisez, cela pourrait ressembler à ceci :

Et lorsque vous cliquez dessus, il lance une lightbox WooCommerce qui affiche l'image, la galerie, le nom, le prix, la description, le SKU et la catégorie du produit.

Étape 2 : Choisissez comment les clients lancent la Lightbox WooCommerce

Avec WooCommerce Quick View Pro, vous pouvez choisir comment les clients lancent la lightbox du produit. Rendez-vous à nouveau dans WooCommerce > Paramètres > Produits > Vue rapide et recherchez la section Options .

Vous pouvez autoriser les clients à lancer la lightbox en :

• Afficher le bouton Aperçu rapide dans la boutique. Cliquez sur le bouton Vue rapide directement sous chaque image de produit. Vous pouvez également modifier le texte du bouton et choisir d'afficher/masquer l'icône du bouton.
• Ouvrez Quick View en cliquant sur le nom ou l'image du produit dans la boutique. En cliquant sur le nom ou l'image du produit.

Vous pouvez choisir d'activer l'une des options ou les deux ! Il est également important de garder à l'esprit que, par défaut, cliquer sur le nom ou l'image du produit conduira les clients vers la page du produit unique. L'activation de l'option Ouvrir la vue rapide en cliquant sur le nom du produit ou l'image dans la boutique vous permet de désactiver cette option.

Étape 3 : Afficher les images du produit dans la Lightbox (avec vue rapide)

L'une des fonctionnalités intéressantes proposées par WooCommerce Quick View Pro est qu'il vous permet de choisir ce que vous souhaitez afficher dans la lightbox.

• Produits centrés sur l'image. Si vous vendez des produits centrés sur l'image (comme des vêtements, des chaussures ou des bijoux), vous souhaitez permettre aux clients de voir les images et les galeries de produits dans la lightbox avec zoom d'image.
• Produits avec spécifications et détails. Si vous vendez des produits en gros, des pièces d'ordinateur ou de la musique, vous souhaiterez peut-être n'afficher que les détails du produit dans la lightbox.
• Produits personnalisables. Si vous vendez des produits personnalisables ou des produits avec des variantes, vous souhaitez afficher à la fois l'image et les détails du produit dans la lightbox.

À partir de l'écran des paramètres du plug-in, recherchez l'option d'affichage Vue rapide et décidez si vous souhaitez afficher l' image uniquement , les détails du produit uniquement ou les détails de l'image et du produit dans la vue lightbox.

Par exemple, si vous décidez d'afficher uniquement les détails du produit, votre lightbox WooCommerce pourrait ressembler à ceci :

Et si vous décidez d'afficher des images dans la lightbox, vous pouvez également choisir de les afficher sous forme de vignettes ou de puces . Voici à quoi pourrait ressembler votre lightbox WooCommerce si vous affichiez à la fois les images et les détails du produit avec l'option de style de vignette de la Galerie définie sur Puces :

Remarque : Si vous souhaitez afficher une galerie de produits, assurez-vous d'ajouter des images à la galerie de produits à partir de l'écran Modifier le produit du produit. Vous pouvez le faire pour chaque produit WooCommerce pour lequel vous souhaitez afficher plusieurs images.

Étape 4 : Décidez des détails des produits à afficher

Si vous choisissez d'afficher les détails du produit (ou les détails de l'image et du produit) dans la lightbox de WooCommerce, vous avez également la possibilité de décider quels détails du produit inclure dans la lightbox de la vue rapide.

Depuis la page des paramètres du plugin, vous pouvez utiliser l'option Détails du produit pour cocher les détails du produit qui apparaissent dans la lightbox :

• Commentaires
• Prix
• Brève description
• Bouton Ajouter au panier
• Méta-informations (telles que les SKU et les catégories)

Si, par exemple, vous ne souhaitez pas afficher les options d'achat, laissez simplement la case du bouton Ajouter au panier décochée. Votre lightbox WooCommerce pourrait ressembler à ceci :

Conclusion

Une lightbox WooCommerce avec vue rapide permet aux clients de :

• Trouvez rapidement les détails du produit qu'ils recherchent
• Voir les images des produits
• Sélectionnez des variantes
• Ajouter des produits au panier

… sans avoir à visiter d'abord la page du produit unique.

WooCommerce Quick View Pro permet aux utilisateurs d'ajouter une lightbox avec une fonctionnalité d'affichage rapide à leurs pages de boutique principales et à leurs pages de catégorie. Il permet également de personnaliser facilement l'apparence de la lightbox et la façon dont les clients interagissent avec elle.

Êtes-vous d'accord qu'une lightbox WooCommerce avec une fonctionnalité d'affichage rapide améliore l'expérience d'achat en ligne des clients ? Partagez vos pensées dans la section des commentaires ci-dessous!