Produit Quick View pop-ups avec WoodMart

La fonction d'affichage rapide permet aux acheteurs de voir les détails du produit directement sur la page de présentation du produit sans avoir à passer à une autre page. WoodMart est doté de cette fonction sans qu'il soit nécessaire d'installer un plugin supplémentaire, et la configuration est très simple, ce qui convient àSite de commerce électroniqueAméliorer l'efficacité de la recherche de produits.

Image [1]-La fenêtre contextuelle de visualisation rapide des produits avec WoodMart

Activation de l'affichage rapide

Allez dans Backstage et cliquez sur WoodMart → Theme Settings → Shop.

Trouvez l'option "Quick View" et cochez "Enable".

Vous pouvez également régler l'affichage des fenêtres contextuelles de l'affichage rapide :

  • Style de mise en page : affichage horizontal (image à gauche, texte à droite) ou vertical (haut et bas)
  • Affichage d'informations : description du produit, prix, sélection de variantes, évaluation, état des stocks, etc.
  • Style d'image : activation ou non de la rotation des vignettes

Cliquez sur Enregistrer lorsque vous avez effectué vos ajustements et actualisez la page pour qu'elle prenne effet.

Image [2] - Effet pop-up du produit Quick View avec WoodMart

Si votre liste de produits utilise l'option Elementor peut-être WPBakery les boutons sont également intégrés automatiquement sans qu'il soit nécessaire d'effectuer une action distincte.

Modifier le style et le texte du bouton

Allez dans Paramètres du thème → Styles et couleurs → Boutons

Image [3] - Effet pop-up de l'affichage rapide des produits avec WoodMart

Faites défiler vers le bas pour trouver la règle d'ajout et sélectionnez Quick View Add to Cart :

Image [4] - Effet pop-up de l'affichage rapide des produits avec WoodMart
  • La couleur des boutons, la bordure et la taille des caractères peuvent être modifiées.
  • Modifier le texte du bouton, par exemple remplacer "Quick View" par "Click Me to Preview" ou "Product Details".
  • Prise en charge du téléchargement d'icônes personnalisées ou de l'utilisation de polices d'icônes (par exemple Font Awesome)
Image [5] - Effet pop-up de l'affichage rapide du produit avec WoodMart

Si vous utilisez Elementor Loop Builder pour personnaliser la liste des produits, il est recommandé d'unifier le nom de la classe du bouton, par exemple .quick-view-buttonet ensuite dans le CSS personnalisé du thème ou CSS personnalisé d'Elementor dans un style uniforme, par exemple :

.quick-view-button {
  couleur de fond : #111 ;
  couleur : #fff ;
  
  border-radius : 4px ; }
}
Image [6] - Effet de pop-up pour l'affichage rapide des produits avec WoodMart

Optimiser l'affichage mobile

WoodMart a rendu la fenêtre contextuelle Quick ViewréactifAdapté, le mobile s'affichera en plein écran.

Il est possible de l'optimiser davantage en utilisant des feuilles de style CSS personnalisées :

.quick-view-popup .product-summary {
  font-size : 16px ;
}
@media(max-width:768px){
  .quick-view-popup .product-image-gallery {
    display : none ; /* Hide image gallery for faster loading */
  }
}

En outre, lemobileIl est recommandé de ne conserver que les informations principales, telles que l'image principale, le prix et le bouton d'achat, et de réduire le contenu distrayant.Amélioration de la vitesse de chargement.

Approche rapide

  • Les fenêtres pop-up ne s'affichent pas : vérifier si elles sont activéesPlugin de mise en cacheSi vous voulez le tester, effacez le cache et testez-le à nouveau.
  • Style incorrect : vérifiez si le CSS est personnalisé ou si le thème est à jour.
  • Échec du chargement de la variante : assurez-vous que les paramètres de la variante sont complets et qu'il ne manque pas d'attributs ou d'images.

court

WoodMart La fonction Quick View ne nécessite pas l'installation d'un plugin et s'accompagne d'une interface de paramétrage et de contrôles de style qui permettent d'améliorer rapidement l'interactivité des pages de listes de produits. Avec un bon style et une optimisation mobile, elle peut également améliorer l'efficacité de la conversion. Il est recommandé d'activer cette fonctionnalité pour chaque produit afin de faciliter la navigation, la comparaison et la commande des acheteurs.

Mises à jour récentes


Contactez nous
Vous n'arrivez pas à lire le tutoriel ? Contactez-nous pour une réponse gratuite ! Aide gratuite pour les sites personnels et les sites de petites entreprises !
Service clientèle WeChat
Service clientèle WeChat
Tel : 020-2206-9892
QQ咨询:1025174874
(iii) Courriel : info@361sale.com
Horaires de travail : du lundi au vendredi, de 9h30 à 18h30, jours fériés.
© Déclaration de reproduction
Cet article a été rédigé par Little Lin
LA FIN
Si vous l'aimez, soutenez-le.
félicitations1258 partager (joies, avantages, privilèges, etc.) avec les autres
commentaires achat de canapé

Veuillez vous connecter pour poster un commentaire

    Pas de commentaires