Comment Astra fonctionne-t-il avec WooCommerce pour ajouter une fonctionnalité de connexion des utilisateurs ? Le guide complet

AstraLorsque vous créez un site de commerce électronique avec un thème et WooCommerce, il est facile d'ajouter une fonctionnalité de connexion des utilisateurs. Il suffit d'activer la fonction "Compte client" dans les paramètres de WooCommerce, le système créera automatiquement les pages de connexion, d'enregistrement et de compte, le thème Astra est parfaitement compatible avec ces pages, les clients peuvent directement compléter l'enregistrement, la connexion, vérifier les commandes et d'autres opérations dans le front-end, sans avoir à entrer dans le back-end. L'ensemble du processus peut être mis en place en quelques minutes sans code.

I. Pourquoi ajouter le login WooCommerce dans Astra ?

WooCommerce Le mécanisme autonome de connexion des utilisateurs est principalement reflété dans le.. :

Demander aux utilisateurs de se connecter lors de la vérification du panier d'achat
WooCommerce propose une page "Mon compte" qui intègre la connexion, l'enregistrement, la gestion des commandes et bien plus encore !

Le support natif d'Astra pour WooCommerce est excellent, améliorant l'expérience de l'utilisateur de la manière suivante :

Intégrer un bouton de connexion dans la barre de navigation supérieure ou dans l'en-tête
Personnaliser le style de la page Mon compte
Optimiser la mise en page de la page de connexion avec l'éditeur Gutenberg.

II. préparation préalable

Installez et activez les éléments suivants

Thème Astra (Correspondance recommandée) Astra Pro (Ouvrir plus de contrôles WooCommerce)

Plugin WooCommerce (système officiel de commerce électronique, gratuit)

Plug-in d'assistance à la gestion des utilisateurs (en option)
- Theme My Login (interface frontale de connexion/enregistrement)
- Nextend Social Login (connexion à un compte social tiers)
- Enregistrement de l'utilisateur (extension du champ d'enregistrement)

Activation de la fonction de connexion à WooCommerce

Étape 1 : Activer les fonctions d'enregistrement et de connexion des utilisateurs

Aller dans les coulisses → WooCommerce → Paramètres → Comptes et confidentialité, cochez les options suivantes :

Permettre aux clients de se connecter sur la page "Mon compte".
Permettre aux clients de créer un compte à la caisse
Création automatique de comptes pour les clients (facultatif)

Après avoir sauvegardé les paramètres, la page Mon compte contiendra les formulaires de connexion et d'enregistrement.

Ajout d'un portail "Connexion/Mon compte" par le biais d'un menu personnalisé

Backstage → Apparence → Menu

Ajouter la page "Mon compte" générée automatiquement par WooCommerce (généralement la page "Mon compte"). /mon-compte)

Nommez-le".Connexion / Mon compte"ou nom personnalisé
Peut être utilisé avec des plug-ins Si le menu Permet d'alterner l'affichage des boutons "Connexion" et "Déconnexion" dans l'état de connexion.

V. Ajouter le bouton Login à la barre de menu supérieure d'Astra

Si vous souhaitez que la fonction de connexion soit mise en évidence dans l'en-tête, vous pouvez le faire dans le constructeur d'en-tête d'Astra :

Apparence → Personnalisation → Head Builder

Ajouter un module "bouton" ou "HTML

Définir le lien de saut à /mon-compte peut-être /login

Le texte du bouton peut être "Login" ou "Account Centre".

Des styles personnalisés pour s'adapter au style général de la conception

VI. utilisation Gutenberg Optimiser la page de connexion (optionnel)

Astra est entièrement compatible avec Gutenberg (l'éditeur de blocs natif de WordPress) et peut être utilisé pour créer unPersonnaliser la page de connexionet l'utiliser comme portail de connexion principal avec les menus ou boutons de navigation d'Astra.

1) Création d'une nouvelle page "Connexion de l'utilisateur

Aller dans Backend → Pages → New Page
Titre recommandé : "User Login" ou "Account Centre"

Cliquez sur "Utiliser l'éditeur Gutenberg" (c'est-à-dire la méthode d'édition par défaut) pour modifier.

2. insertion du formulaire de connexion

Méthode 1 : Insérez le formulaire de connexion WooCommerce en utilisant le bloc de shortcodes :

Cliquez sur la zone de contenu de la page → Ajouter un bloc → Rechercher et insérer le bloc "Short code".
Saisissez les informations suivantes :





	


		Se connecter

		

			
			
				Identifiant ou e-mail *Obligatoire
							
			
				Mot de passe *Obligatoire
				
			

			
			
				
					 Se souvenir de moi
				
								
			
			
				Mot de passe perdu ?
			

			
		


	

	

		S’inscrire

		

			
			
			
				Adresse e-mail *Obligatoire
							

			
				Un lien permettant de définir un nouveau mot de passe sera envoyé à votre adresse e-mail.

			
			Vos données personnelles seront utilisées pour vous aider tout au long de votre expérience sur le site, pour gérer l'accès à votre compte et pour les besoins de notre programme de formation.politique de confidentialitéAutres utilisations décrites dans.

Note : Ce shortcode contient non seulement le formulaire de connexion, mais aussi le formulaire d'enregistrement avec le bloc d'informations sur le compte (qui est automatiquement basculé après la connexion).

Méthode 2 (avancée) : utiliser un plugin de formulaire qui prend en charge la connexion de l'utilisateur, tel que WPForms ou Enregistrement de l'utilisateur, insérez leurs codes courts après avoir généré le formulaire.

résumés

Thème Astra avecWooCommerceParfaitement adaptés, vous pouvez rapidement créer un système de connexion des utilisateurs à la fois beau et pratique, sans programmation. Qu'il s'agisse d'utiliser la page de compte par défaut ou de créer un portail de connexion distinct, il est facile à mettre en œuvre et offre aux clients une expérience d'achat fluide.

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.