Comment configurer l'aperçu rapide des produits WooCommerce dans Kadence

L'amélioration de l'efficacité des achats et de l'expérience de navigation peut augmenter WooCommerce Taux de conversion du site web. La fonction Quick View sur un site web permet aux utilisateurs de voir les informations sur le produit dans une fenêtre pop-up et de passer une commande sans avoir à passer à la page détaillée. En utilisant le thème Kadence, qui est léger, flexible et hautement compatible avec WooCommerce, cet article expliquera comment configurer l'affichage rapide dans Kadence.

Comprendre Kadence et permettre l'installation

1.1 Qu'est-ce que Kadence et pourquoi est-il adapté à la création d'une boutique WooCommerce ?

Kadence est un thème WordPress conçu pour la vitesse, la convivialité et l'esthétique, avec des capacités de construction de pages flexibles et un puissant personnalisateur de thème. Utilisé avec WooCommerce, il offre :

• Une présentation des produits hautement personnalisable
• Optimisation mobile réactive
• Intégration transparente avec le plug-in Kadence Blocks
• Vitesse de chargement des pages optimisée pour le référencement

Kadence et les plug-ins travaillent ensemble pour créer une expérience d'achat fluide et intuitive pour les utilisateurs, avec des aperçus rapides des produits qui constituent une partie importante du processus.

1.2 Installation et activation de Kadence

• Connectez-vous au backend de WordPress et allez dans [Apparence] > [Thèmes].
• Installation et activation des thèmes Kadence

Deuxièmement, installez et configurez le plug-in de prévisualisation rapide des produits

Le thème Kadence lui-même ne dispose pas d'un aperçu rapide intégré des produits, nous devons donc utiliser un plugin tiers pour y parvenir.

2.1 Installer le plugin recommandé : YITH WooCommerce Quick View

YITH Quick View est l'un des plugins de prévisualisation rapide les plus populaires, avec une grande compatibilité et une version gratuite pour la plupart des besoins.

Étapes de l'installation :

• Allez dans [Plugins] > [Installer des plugins] et recherchez "YITH WooCommerce Quick View"
• Cliquez sur Installer et activer

• Lorsque cette option est activée, [YITH] > [Quick View] apparaît dans le menu d'arrière-plan.

2.2 Configuration des fonctionnalités de base

• Type de boutonIcône + texte : Choisissez entre "icône + texte" ou simplement une icône, en fonction du style de la page.
• position du boutonLes options recommandées sont "survoler la vignette du produit" ou "sous le titre".
• mise en page de la fenêtre pop-upFenêtre flottante optionnelle au centre, structure à deux colonnes, pour s'adapter à différents styles

Configurer les styles des boutons pour qu'ils correspondent aux styles de Kadence

• Allez dans le backend de WordPress et ouvrez Apparence. frappe (sur le clavier) Personnaliser entrer dans Kadence

• Couleurs et polices > Couleurs de baseLes couleurs principales de Kadence sont #0058ff

• partir pour YITH > Quick View > Personnalisation
• Définissez les valeurs de couleur suivantes :
  • Couleur d'arrière-plan du bouton (Arrière-plan): :#0058ff
  • Couleur d'arrière-plan du survol (survol de l'arrière-plan): :#0044cc(version approfondie)
  • Couleur du texte: :#ffffff(blanc)
  • Couleur du texte en survol: :#ffffff

Une fois les réglages terminés, les boutons utilisent les couleurs primaires de Kadence et le style général est uniforme.

Quatrièmement, l'adaptation réactive et l'optimisation des performances

4.1 Optimisation mobile

• Sur les petits écrans, le contenu de la fenêtre contextuelle doit être aligné verticalement.
• Veillez à ce que les boutons de fermeture, de sélection des variantes et d'ajout au panier soient faciles à cliquer.
• Ajuster la taille et l'espacement des polices avec les fonctionnalités typographiques réactives de Kadence

4.2 Optimisation de la vitesse de chargement

• Activer le chargement d'images Lazy Load (supporté par Kadence par défaut)
• Réduire le nombre de produits par page pour éviter de déclencher un trop grand nombre de demandes de ressources pop-up.
• Utilisation du plugin Cache LiteSpeed Cache Améliorer la réactivité générale des pages

V. Problèmes courants et solutions

questions	raison d'être	guérir
Bouton non affiché	Conflits avec des plugins ou interférences avec le style de la personnalisation du thème	Désactiver temporairement la mise en cache ou les feuilles de style CSS personnalisées et résoudre les problèmes étape par étape
Échec du chargement de la fenêtre pop-up	Le cache n'a pas été effacé ou la requête AJAX a échoué	Vérifier si les paramètres AJAX de WooCommerce sont activés
La fonction "Ajouter au panier" ne répond pas.	Erreur JavaScript ou conflit de logique de la variante	Vérifiez si des erreurs ont été signalées dans la console de votre navigateur et mettez à jour la version du plugin.

VI. conclusion

existent Thèmes de KadenceL'activation de la fonctionnalité d'aperçu rapide des produits WooCommerce dans YITH peut améliorer l'expérience de navigation, accélérer le processus de commande et réduire le taux de rebond. Avec le plugin YITH Quick View, il est facile de créer un e-commerce beau, efficace et adapté aux mobiles !page web.

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
① 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.