Méthode complète pour ajouter WooCommerce Mini Cart à Astra Pro

L'icône du panier joue un double rôle : elle affiche visuellement l'état des produits ajoutés et guide efficacement les utilisateurs tout au long du processus d'achat.Astra Pro Le plugin étend la fonction WooCommerce qui permet d'ajouter des mini-paniers dans différentes zones (Mini-chariot), qui peut être intégré de manière flexible à n'importe quel endroit de la page grâce à des codes courts afin de répondre à des exigences personnalisées en matière de mise en page. Le contenu suivant explique comment configurer le mini-panier d'achat dans Astra, y comprisancien en-têteetnouveau constructeuretappel en code courtet les ajustements de style courants.

Les anciennes versions d'Astra ajoutent l'icône du panier d'achat à l'en-tête

Lorsque le site utilise l'ancienne structure d'en-tête Astra, l'icône du panier d'achat peut être ajoutée à la fin du menu principal. La procédure à suivre est la suivante :

• activer WooCommerce Plug-ins ;
• Allez dans le backend et cliquez surétat extérieur > Personnaliser > En-tête > Menu principal ;
• Recherchez l'élément "Dernier élément du menu" dans les paramètres du menu et sélectionnez WooCommerce ;

Une fois le réglage terminé, l'icône du panier s'affiche sur le côté droit du menu principal, indiquant le nombre de produits et permettant d'accéder à la page du panier.

Le nouveau créateur d'en-tête ajoute une icône de panier d'achat

La nouvelle version d'Astra propose la fonction Header & Footer Builder qui permet de placer les icônes du panier d'achat dans la zone du menu principal, dans l'en-tête supérieur ou dans l'en-tête inférieur. Voici comment l'utiliser :

• commencer à utiliser Astra Pro Plug-ins ;
• Activez le module Header Sections dans le tableau de bord Astra ;
• Allez dans Apparence > Personnaliser > En-tête > En-tête ci-dessus. ;
• Sélectionnez WooCommerce dans la section 1 ou la section 2 ;

Une fois ajoutée, l'icône du panier d'achat s'affiche dans la zone désignée, et les contenus tels que le style de l'icône, le titre et le montant peuvent être définis indépendamment.

Insérer l'icône du panier d'achat à l'aide d'un shortcode

Si vous devez afficher l'icône du panier quelque part sur la page, par exemple dans le contenu de l'article, le pied de page ou la barre latérale, vous pouvez utiliser la fonction Astra Pro La fonction de code court est fournie.

Le code court de base est le suivant :[astra_woo_mini_cart]

Le shortcode permet de définir la direction de la fenêtre contextuelle, par exemple :

[astra_woo_mini_cart direction="top left"]

[astra_woo_mini_cart direction="bottom right"]

[astra_woo_mini_cart direction="top right"]

Vous souhaitez insérer un panier d'achat coulissant dans la page, utilisez :[astra_woo_slide_in_cart]

Le code court ci-dessus peut être placé dans le Gutenberg Bloc,Elementor Page, zone de widget de la barre latérale ou tout autre emplacement compatible avec les shortcodes.

Avant d'utiliser le shortcode, vous devez activer l'option Astra Pro et ouvrez le module WooCommerce dans Astra Options.

Quantité de produit Ajustement des couleurs

Le nombre de produits à côté de l'icône du panier d'achat peut ne pas s'afficher en raison d'un problème de correspondance des couleurs. La raison la plus fréquente est que la couleur du nombre est trop proche de la couleur de fond, ce qui entraîne une confusion visuelle.

Le traitement est le suivant :

• Allez dans Apparence > Personnaliser > Constructeur d'en-tête > Panier > Conception. ;
• Trouvez l'option "Compter les couleurs" ;
• Réglez la couleur sur une couleur plus contrastée ;
• Enregistrer les modifications ;

Cette fonction est disponible depuis Astra Pro Pris en charge depuis la version 3.5.9 du plugin, avec la possibilité de personnaliser les couleurs des numéros pour éviter les anomalies d'affichage.

résumés

Astra Pro (utilisé comme expression nominale) WooCommerce Mini Cart est très flexible et permet d'ajouter des icônes à la structure de l'en-tête ou de les intégrer à n'importe quel endroit de la page grâce à des codes courts. Combiné au style d'icône et aux paramètres de couleur, il peut répondre aux besoins de différents types de sites en ce qui concerne la présentation du processus d'achat. Une bonne utilisation de ces fonctionnalités peut contribuer à améliorer l'effet général de la page et la facilité d'utilisation.