Comment ajouter une connexion sociale WordPress à WooCommerce

Publié: 2022-04-18

Vous cherchez un moyen de permettre à vos abonnés de réseaux sociaux de se connecter facilement à votre site WooCommerce ? Envisagez d'ajouter une connexion sociale WordPress à votre site Web.

En ajoutant une connexion sociale à WooCommerce, vous offrez aux visiteurs du site un moyen rapide de se connecter en utilisant les informations d'identification de leur compte de réseau social.

Cependant, le seul problème est que WooCommerce n'offre pas par défaut une option de connexion sociale pour votre site de commerce électronique. Il vous permet uniquement d'offrir un simple formulaire de connexion et d'inscription aux visiteurs du site les obligeant à créer un nouveau compte avec de nouvelles informations d'identification.

La bonne nouvelle est que vous pouvez créer un formulaire de connexion et d'inscription personnalisé sur votre site WooCommerce à l'aide d'un plugin comme ProfilePress.

Dans cet article, nous allons vous montrer comment vous pouvez ajouter des boutons sociaux au formulaire de connexion WooCommerce et remplacer celui par défaut de WooCommerce par ceux personnalisés de ProfilePress.

Pourquoi devriez-vous ajouter une connexion sociale à WooCommerce ?

En tant que propriétaire de boutique en ligne, vous savez probablement déjà que WooCommerce offre par défaut des options limitées aux visiteurs du site pour se connecter à votre site Web.

Tous les visiteurs du site devront d'abord s'inscrire sur votre site Web en utilisant un nom d'utilisateur unique et leur adresse e-mail avant de pouvoir accéder au contenu. Les formulaires de connexion par défaut semblent non seulement basiques, mais offrent également des options limitées permettant aux utilisateurs de s'inscrire et de se connecter rapidement à votre site WooCommerce.

Les formulaires WooCommerce par défaut ne sont pas conçus pour permettre à vos utilisateurs de se connecter à votre site Web à l'aide de leurs comptes de médias sociaux. Étant donné que de nombreuses personnes ont des comptes de médias sociaux sur des plateformes telles que Facebook, Twitter ou Google, il est plus facile d'utiliser ces détails de compte pour se connecter à votre boutique.

Voici quelques raisons supplémentaires pour lesquelles l'ajout d'une connexion sociale à votre site WooCommerce est utile :

  • Permettre à tous les types d'utilisateurs de s'inscrire et de se connecter à votre site. Étant donné que la plupart des gens ont déjà des comptes de médias sociaux prêts à fonctionner, vous pouvez rendre votre site WooCommerce beaucoup plus accessible et accueillant pour tous les types d'utilisateurs. Les utilisateurs qui ont déjà un compte Facebook enregistré peuvent facilement s'inscrire et se connecter à votre site Web en quelques clics.
  • Offrez une expérience utilisateur conviviale. Offrir une expérience utilisateur conviviale sur votre site WooCommerce encourage les gens à faire plus d'achats et améliore la fidélisation de la clientèle. Pensez-y : s'il est facile pour les clients de se connecter à votre site WooCommerce et de passer leurs commandes, il y a plus de chances que ces mêmes clients reviennent sur votre boutique en ligne la prochaine fois.
  • Encouragez plus de personnes à s'inscrire. En offrant une inscription et une connexion faciles en un clic, vous encouragez davantage de personnes à s'inscrire sur votre site WooCommerce. C'est un excellent moyen de créer vos listes de diffusion et d'améliorer vos campagnes de marketing par courrier électronique.
  • Convertissez vos abonnés sur les réseaux sociaux en utilisateurs enregistrés sur votre site. Si votre entreprise a un énorme succès sur les plateformes de médias sociaux, ce pourrait être une bonne idée de détourner toute l'attention vers votre site WooCommerce. Vous pouvez le faire en proposant des boutons de connexion sociale sur votre site WooCommerce afin que votre public accède plus facilement à votre site WooCommerce.

Le moyen le plus simple d'ajouter une connexion sociale à WooCommerce par défaut

Bien qu'il existe de nombreux plugins que vous pouvez utiliser pour ajouter des boutons de connexion sociale sur votre site WooCommerce, ProfilePress est la seule solution qui se démarque.

ProfilePress est un profil d'utilisateur professionnel et un plug-in d'adhésion intégré avec de puissants générateurs de formulaires et des personnalisations avancées.

Vous pouvez créer des formulaires personnalisés attrayants pour les pages de connexion et d'inscription WooCommerce par défaut sans avoir à écrire une seule ligne de code. En plus de cela, vous pouvez également créer des répertoires de membres et présenter tous vos membres inscrits sur le front-end de votre site WooCommerce. La meilleure partie de ProfilePress est que vous pouvez utiliser les modèles préconçus pour créer rapidement des formulaires personnalisés, puis les personnaliser en fonction de vos besoins.

À l'aide du plug-in ProfilePress, vous pouvez ajouter des boutons de connexion sociale à un formulaire de connexion ProfilePress personnalisé et le remplacer par le formulaire d'inscription et de connexion WooCommerce par défaut sur la page "Mon compte".

Ajout d'une connexion sociale à WooCommerce à l'aide de ProfilePress

Ici, nous allons vous montrer à quel point il est facile d'ajouter une connexion sociale à WooCommerce à l'aide de ProfilePress.

Pour ce tutoriel, vous aurez besoin d'avoir le plugin WooCommerce installé sur votre site WordPress. Vous aurez également besoin du plugin ProfilePress pour ajouter des formulaires de connexion personnalisés avec des boutons de connexion sociale sur votre site WooCommerce.

Étape 1 : Installez et activez ProfilePress

Pour commencer, procurez-vous le plugin ProfilePress et installez-le sur votre site WordPress.

Accédez à Plugins → Ajouter nouveau dans le panneau d'administration WordPress et cliquez sur le bouton Ajouter nouveau . Maintenant, téléchargez le fichier zip et procédez à l'installation du plugin sur votre site WooCommerce.

Étape 2 : Créer un formulaire de connexion personnalisé

Avec le plugin ProfilePress prêt à l'emploi, vous pouvez commencer à créer un formulaire de connexion personnalisé avec des boutons de médias sociaux ajoutés. Assurez-vous d'abord d'activer le module complémentaire Social Login en accédant à l'écran ProfilePress → Addons .

Une fois cela fait, allez dans ProfilePress → Formulaires et profils et cliquez sur le bouton Ajouter nouveau .

Sélectionnez le Drag & Drop Builder et donnez un nouveau titre à votre formulaire de connexion personnalisé. Sélectionnez maintenant un modèle pour commencer à modifier le formulaire de connexion. Nous avons sélectionné le modèle Bash à démontrer.

Une fois que vous avez cliqué sur le bouton Sélectionner un modèle , il vous redirigera automatiquement vers la page d'édition du formulaire où vous pourrez ajouter des champs supplémentaires ainsi que les boutons de connexion aux médias sociaux.

Étape 3 : Ajoutez des boutons de connexion sociale

Vous pouvez ajouter plusieurs boutons de connexion sociale et glisser-déposer ajouter ou supprimer des champs supplémentaires à votre formulaire de connexion à partir de cette page.

Vous pouvez également modifier chaque champ et personnaliser le texte du champ affiché sur le front-end de votre site WooCommerce.

Cliquez simplement sur l'icône des paramètres tout en passant votre souris sur le champ et cliquez sur le bouton Appliquer les modifications une fois que vous avez terminé. Une fois que vous avez terminé de personnaliser les champs, vous pouvez utiliser la méta-boîte Paramètres du formulaire pour ajouter des boutons de connexion aux médias sociaux à votre formulaire de connexion.

À l'aide de l'onglet Apparence , ajoutez des comptes de médias sociaux à l'aide du champ de texte Boutons de connexion sociale . Vous pouvez également personnaliser le texte des boutons d'envoi et les espaces réservés des champs de texte pour votre formulaire de connexion personnalisé.

Une fois que vous avez terminé, assurez-vous de cliquer sur le bouton Appliquer les modifications pour continuer.

Étape 4 : Remplacez le formulaire de connexion WooCommerce par défaut

Copiez le shortcode du formulaire de connexion personnalisé et accédez à Pages → Ajouter nouveau pour créer une nouvelle page de connexion sociale sur votre site WooCommerce.

Collez simplement le shortcode du formulaire de connexion à l'aide du bloc Shortcode et cliquez sur le bouton Publier pour continuer. Il ne reste plus qu'à configurer la connexion sociale réelle dans les paramètres et à remplacer le formulaire de connexion WooCommerce par défaut par celui que nous venons de créer.

Pour définir la page que nous avons créée comme page de connexion WordPress par défaut à l'échelle mondiale sur notre site, accédez à ProfilePress → Paramètres et sélectionnez la page de connexion nouvellement créée à l'aide du menu déroulant Page de connexion sous l'onglet Paramètres globaux .

Pour configurer le processus de connexion sociale réel, accédez à ProfilePress → Paramètres et cliquez sur l'onglet Connexion sociale pour définir les paramètres de connexion sociale.

Ici, vous pouvez configurer des clés API pour tous les comptes de médias sociaux afin que les différentes applications sociales s'intègrent de manière transparente aux formulaires de connexion sociale ProfilePress. Après avoir entré les clés API pour les plateformes de médias sociaux, cliquez sur le bouton Enregistrer les modifications .

En plus de cela, vous pouvez également modifier le texte du bouton sur les boutons de connexion sociale en accédant à l'onglet Boutons .

Une fois que vous avez terminé, assurez-vous de cliquer sur le bouton Enregistrer les modifications .

Pour remplacer les formulaires d'inscription et de connexion par défaut affichés dans la page Mon compte WooCommerce ; cliquez sur l'onglet WooCommerce et sélectionnez votre page de connexion sociale nouvellement créée à l'aide des champs déroulants Formulaire de connexion à mon compte et Formulaire d' inscription à mon compte.

Voici à quoi cela pourrait ressembler sur votre page Mon compte WooCommerce en fonction du thème de formulaire que vous avez sélectionné.

Vous pouvez également remplacer le formulaire de connexion WooCommerce par défaut à la caisse par un formulaire de connexion ProfilePress avec connexion sociale. Pour ce faire, sélectionnez simplement la page de connexion qui contient le formulaire de connexion avec les connexions sociales que nous avons créées précédemment à l'aide du menu déroulant Checkout Login Form .

Cliquez sur le bouton Enregistrer les modifications pour continuer.

Cliquer sur les boutons de connexion sociale redirigera les utilisateurs vers la page d'authentification de connexion.

Les clients peuvent également se connecter à partir de la page de paiement WooCommerce en utilisant leurs comptes de médias sociaux.

Conclusion

L'ajout de boutons de connexion sociale à votre site WooCommerce est un excellent moyen d'encourager davantage d'inscriptions et d'améliorer l'expérience utilisateur sur votre site. Ceci est particulièrement utile pour les entreprises qui ont déjà un énorme suivi sur leurs comptes de médias sociaux.

Cependant, vous êtes limité par la fonctionnalité WooCommerce par défaut lorsqu'il s'agit d'offrir une connexion sociale sur votre site. C'est pourquoi nous vous recommandons d'utiliser un plugin de création de formulaire personnalisé dédié tel que ProfilePress pour remplacer le formulaire de connexion par défaut d'apparence générique sur votre site WooCommerce.

Vous cherchez un moyen simple d'ajouter une connexion sociale à votre site WooCommerce ? Obtenez ProfilePress aujourd'hui !