Comment intégrer Facebook Login avec WordPress

Publié: 2021-03-26

Stimuler l'engagement et la fidélité à la marque via votre site Web WordPress peut être délicat. L'un des meilleurs moyens de rester en contact avec les utilisateurs est de créer des comptes sur votre site. Cependant, de nombreux visiteurs peuvent penser que cette tâche est fastidieuse, surtout si elle les oblige à générer et à se souvenir plus tard d'un nouveau mot de passe sécurisé. Une façon de contourner ce problème est d'offrir la fonctionnalité de connexion Facebook.

En permettant aux visiteurs de créer plus facilement des comptes et d'accéder à votre site, vous pouvez indirectement encourager l'engagement tout en facilitant la vie de vos utilisateurs. Dans cet article, nous allons vous montrer exactement comment configurer un bouton de connexion Facebook sur votre site WordPress.

Creusons !

Pourquoi vous pourriez vouloir ajouter une connexion Facebook à votre site WordPress

WordPress vous permet d'autoriser l'enregistrement des utilisateurs immédiatement. Étant donné que votre site Web dispose déjà d'une option de connexion, vous vous demandez peut-être pourquoi vous devriez vous embêter à ajouter l'intégration de Facebook. Les principales raisons se résument toutes à la commodité pour vos utilisateurs.

Étant donné que la plate-forme compte près de 2,8 milliards d'utilisateurs actifs par mois, la grande majorité des visiteurs de votre site ont probablement déjà un compte Facebook. Compte tenu du nombre de noms d'utilisateur et de mots de passe que les gens doivent retenir de nos jours, la possibilité d'utiliser un compte existant pour s'inscrire sur votre site est extrêmement pratique. Les visiteurs peuvent être plus susceptibles de créer des comptes s'ils peuvent utiliser des informations de connexion qu'ils connaissent déjà.

L'ajout de la connexion Facebook à votre site Web permet aux utilisateurs de créer des comptes en un seul clic.

Un exemple de bouton de connexion Facebook.

Bien entendu, cette commodité n'est pas sans avantages pour votre entreprise. En facilitant l'inscription des utilisateurs, vous les encouragez indirectement à s'engager davantage avec votre site. Ceci est souhaitable pour un certain nombre de raisons, telles que :

  • Avoir un compte sur votre site Web peut aider les utilisateurs à se sentir plus investis dans votre marque.
  • Les utilisateurs peuvent être plus susceptibles de laisser des commentaires et d'interagir avec votre contenu. Cela crée un sentiment de communauté et contribue à stimuler l'optimisation des moteurs de recherche (SEO).
  • Ils peuvent être plus susceptibles de partager du contenu avec leurs réseaux sociaux s'ils sont déjà connectés, ce qui contribue à augmenter la portée de vos publications.
  • Les utilisateurs enregistrés peuvent être plus faciles à atteindre avec des promotions et des notifications de nouveau contenu.

Enfin, l'énorme base d'utilisateurs de Facebook signifie que l'intégration peut fournir des analyses puissantes et des informations démographiques auxquelles vous n'auriez peut-être pas accès autrement. Ces détails peuvent être inestimables lorsqu'il s'agit de développer votre entreprise.

Comment intégrer Facebook Login avec WordPress (en 5 étapes)

Maintenant que vous savez pourquoi vous devriez envisager l'intégration de la connexion Facebook, il est temps d'apprendre à la configurer et de commencer à en récolter les avantages. Le processus peut sembler complexe, mais il est en réalité plus facile qu'il n'y paraît. Parcourons-le.

Étape 1 : Configurer un compte de développeur Facebook

La première chose à faire est de créer un compte développeur Facebook. Cela vous permettra d'utiliser le kit de développement logiciel (SDK) Facebook pour créer diverses applications et intégrations, y compris un bouton de connexion pour votre site :

La page des développeurs Facebook.

Visitez le site des développeurs Facebook et cliquez sur Commencer dans le coin supérieur droit. On vous posera une poignée de questions, mais si vous avez déjà un compte Facebook, le processus est extrêmement rapide. Lorsque vous avez terminé, vous accédez à la page des applications Facebook, ce qui mène à l'étape suivante.

Étape 2 : Créer une nouvelle application Facebook

L'étape suivante consiste à créer une application Facebook, qui est le vaisseau qui contiendra le code de votre intégration. Depuis la page principale des applications, cliquez sur le bouton vert Créer une application pour commencer :

Création d'une nouvelle application Facebook.

Cela ouvrira une fenêtre vous invitant à sélectionner ce que votre application doit faire :

Sélection de l'objectif d'une nouvelle application Facebook.

Choisissez Créer des expériences connectées pour configurer Facebook Login. Ensuite, vous devrez donner un nom à votre application et fournir une adresse e-mail de contact :

Nommer votre application Facebook.

Lorsque vous avez terminé, cliquez sur Créer une application. Il vous sera demandé de confirmer votre humanité avec un CAPTCHA, puis vous pourrez passer à l'étape suivante.

Étape 3 : ajouter un produit pour la nouvelle application

Ensuite, vous devrez choisir un produit pour votre nouvelle application. Il s'agit essentiellement d'un morceau de code préemballé pour vous aider à démarrer dans la bonne direction. Si vous avez choisi Créer des expériences connectées à l'étape 2, vous devriez voir une option sur cette page pour la connexion Facebook :

Choisir un produit pour votre application Facebook.

Survolez-le et cliquez sur Configurer . Facebook vous invitera alors à choisir une plate-forme pour l'application :

Sélection de la plate-forme pour votre bouton de connexion Facebook.

Comme il s'agit de votre site Web, sélectionnez Web . Sur l'écran suivant, vous verrez une liste guidée d'étapes à suivre, en commençant par fournir l'URL de votre site Web :

L'assistant de création de votre bouton de connexion Facebook.

Certaines étapes vous demanderont de copier et de coller du code à divers endroits de votre site Web pour activer l'analyse et ajouter le bouton Se connecter avec Facebook . Bien qu'il soit possible de le faire manuellement et que cela fonctionne très bien, nous utiliserons un plugin WordPress à l'étape 5 pour rendre le processus encore plus facile. Vous pouvez sauter ces étapes en toute sécurité si vous le souhaitez.

Étape 4 : Configurez votre bouton de connexion Facebook

Lorsque vous arrivez à l'étape 4 du processus d'ajout de votre produit, Facebook vous donnera le code du bouton de connexion. À ce stade, vous pouvez configurer son apparence.

Facebook fournit un générateur de code très utile que vous pouvez utiliser pour configurer votre bouton de connexion comme vous le souhaitez :

L'éditeur de configuration pour l'apparence du bouton de connexion Facebook.

Vous pouvez ensuite simplement copier et coller le code généré sur la page appropriée de votre site. Encore une fois, nous utiliserons un plugin pour accomplir cela au lieu d'intégrer le bouton de connexion Facebook manuellement, mais les options de personnalisation peuvent toujours être utiles.

Étape 5 : Affichez le bouton de connexion sur votre site à l'aide du plugin Nextend Social Login

À ce stade, vous êtes prêt à afficher votre bouton de connexion Facebook sur votre site Web WordPress. Bien que vous puissiez l'ajouter manuellement en suivant les instructions du tableau de bord de votre compte de développeur Facebook, nous vous recommandons d'utiliser un plugin pour simplifier les choses. Nextend Social Login est une solution fantastique qui fonctionne également pour Google et Twitter :

Le plugin WordPress de connexion sociale Nextend.

Pour installer ce plugin, ouvrez votre tableau de bord WordPress et accédez à Plugins > Ajouter un nouveau. Recherchez « Nextend » et installez le plugin. N'oubliez pas de l'activer également.

Ensuite, dirigez-vous vers Paramètres> Nextend Social Login :

Le panneau de paramètres Nextend dans le tableau de bord WordPress.

Cliquez sur Mise en route sous l'option Facebook pour configurer le plugin. Une liste d'instructions pour créer une application Facebook vous sera présentée - puisque nous l'avons déjà fait, vous pouvez faire défiler vers le bas et cliquer sur le bouton indiquant J'ai fini de configurer mon application Facebook .

Ensuite, un écran de paramètres s'affichera :

La page des paramètres de Nextend.

Vous devrez entrer votre identifiant d'application et votre secret d'application. Ceux-ci peuvent être trouvés dans votre compte de développeur Facebook. Cliquez sur Mes applications en haut, puis sélectionnez l'application que vous avez créée précédemment. Dans la barre latérale de gauche, cliquez sur Paramètres > De base :

L'identifiant de l'application Facebook et le secret de l'application utilisés pour connecter votre bouton de connexion au plugin Nextend.

Votre identifiant d'application et votre secret d'application sont en haut de l'écran. Entrez-les dans les paramètres Nextend. Vous pouvez configurer l'apparence de votre bouton ici en utilisant l'un des styles prédéfinis de Nextend, ou utiliser votre propre bouton personnalisé que vous avez créé à l'étape 4 :

Les paramètres de configuration du bouton Nextend.

Une fois que vous avez fait cela et enregistré vos modifications, votre page de connexion devrait afficher un bouton Continuer avec Facebook (ou le texte que vous choisissez dans les paramètres).

Conclusion

Que vous souhaitiez générer plus d'inscriptions, encourager plus de commentaires ou accéder à de meilleures analyses, l'intégration de Facebook à votre site WordPress peut être un excellent moyen d'atteindre vos objectifs. Le processus peut sembler intimidant, mais ce n'est pas si mal une fois que vous avez commencé.

Suivez simplement ces cinq étapes pour activer l'intégration de connexion Facebook pour votre site :

  1. Configurez un compte de développeur Facebook.
  2. Créez une application Facebook.
  3. Ajoutez un produit pour l'application.
  4. Configurez votre bouton de connexion Facebook.
  5. Affichez le bouton de connexion sur votre site à l'aide du plugin Nextend Social Login.

Avez-vous des questions sur l'ajout de l'intégration Facebook à votre site ? Faites-nous savoir dans la section commentaires ci-dessous!

Image en vedette via V3rc4 / shutterstock.com