La connexion sociale permet aux visiteurs de se connecter à votre site sans créer de compte utilisateur. Ils utilisent les informations d’identification de leur compte sur d’autres sites comme Facebook ou Google pour se connecter. Il s’agit d’une fonctionnalité utile à offrir, mais il y a des avantages et des inconvénients à fournir des identifiants sociaux.
Le principal avantage est la commodité pour vos visiteurs. Le fait de leur permettre de se connecter facilement augmente presque toujours la participation. Et le fait est que la grande majorité des visiteurs préfèrent ne pas créer un autre compte sur le site Web.
L’inconvénient est que vous ne pouvez pas constituer une base de données d’utilisateurs aussi étendue que si vous encouragiez les visiteurs à créer des comptes sur votre site. Les informations que vous recevez sur un visiteur qui utilise un login social varient selon la plate-forme.
Mais si vous n’avez pas besoin de recueillir des données spécifiques, les avantages des identifiants sociaux l’emportent facilement sur les inconvénients.
Pour ce tutoriel de WordPress sur les connexions sociales, nous allons utiliser le plugin WordPress Social Login. La version gratuite du plugin fournit des logins pour les utilisateurs de Facebook, Google, Twitter, Instagram et LinkedIn (plus cinq autres plateformes).
Dans ce tutoriel, nous allons parcourir les fonctionnalités de connexion sociale du plugin. Mais le plugin fournit également des boutons de partage social et des commentaires sociaux. Les commentaires sociaux permettent aux utilisateurs qui sont connectés à Facebook ou Google de commenter sans être connectés à votre site.
Nous ne détaillerons pas ces fonctionnalités ici, mais elles valent la peine d’être consultées.
Commençons.
Installation du plugin WordPress Social Login
Connectez-vous à votre panneau d’administration WordPress.
Dans la colonne de navigation de gauche, passez la souris sur le lien “Plugins” et cliquez sur le lien “Add New”.
Dans la boîte “Rechercher des plugins…”, entrez “WordPress Social Login”.
Une fois que vous avez localisé le plugin, cliquez sur le bouton “Installer maintenant”.
Cliquez sur le bouton “Activer”.
Configuration de la connexion sociale de WordPress
Une visite guidée du plugin est proposée lorsque vous accédez pour la première fois aux paramètres. Les captures d’écran ci-dessous sont celles que vous verrez après la visite guidée (ou si vous sautez la visite).
Vous avez plusieurs options pour configurer les identifiants sociaux. Vous pouvez configurer chaque connexion vous-même, en utilisant les “App ID” et “App Secrets” que vous obtenez des fournisseurs. Par exemple, pour configurer une connexion Google, vous devez créer un projet Google Developer pour obtenir un App ID.
Mais le Social Login Plugin que nous utilisons offre une alternative. Il s’occupera de l’autorisation des plateformes, vous épargnant le temps et la peine d’enregistrer chacune d’entre elles vous-même. C’est cette option que nous allons utiliser ici.
Dans la colonne de navigation de gauche, passez la souris sur le lien “miniOrange Social Login, Sharing” et cliquez sur le lien “Social Login”.
Vous atterrirez sur l’onglet “Configurer les applications”. Pour activer une connexion à un réseau social, cliquez sur l’interrupteur à bascule correspondant.
Une fenêtre de configuration s’ouvre.
Cliquez sur l’interrupteur à bascule “App miniOrange pré configurée”.
Cela ouvrira une boîte “Register with miniOrange”. Complétez les informations d’enregistrement et cliquez sur le bouton “Enregistrer”.
La confirmation du compte n’est pas nécessaire. Une fois que votre compte miniOrange est enregistré, vous verrez que la plateforme sociale est marquée “Active”.
Au moment où ce tutoriel a été écrit, les identifiants Facebook ne pouvaient pas être ajoutés automatiquement. Vous devrez obtenir un App ID et un App Secret sur la console des développeurs Facebook. Des instructions détaillées sont fournies sur la page du plugin.
Si vous autorisez l’enregistrement des visiteurs sur votre site WordPress, votre page de connexion aura maintenant l’option de connexion sociale.
Au fur et à mesure que vous ajoutez des plateformes, les identifiants apparaissent.
Que se passe-t-il lorsque quelqu’un se connecte à votre site avec un identifiant social ?
Lorsqu’un utilisateur se connecte à votre site à l’aide d’un identifiant social, il est enregistré comme “abonné” et ajouté à votre liste d’utilisateurs.
Personnaliser les icônes de connexion sociale
Si vous n’aimez pas l’apparence par défaut des icônes de connexion, il est facile de les modifier.
Dans la section “Connexion sociale”, cliquez sur l’onglet “Personnaliser les icônes de connexion sociale”.
Les options comprennent la possibilité d’utiliser de petits boutons carrés ou ronds et de modifier le texte et la couleur du bouton. Une fenêtre d’aperçu pratique vous permet de visualiser vos modifications en temps réel. Les modifications ne sont pas enregistrées tant que vous n’avez pas fait défiler la page et cliqué sur le bouton “Enregistrer”.
Options d’affichage
L’onglet “Options d’affichage” permet de contrôler où les boutons de connexion sont visibles. Par défaut, ils se trouvent sur votre page de connexion, mais vous pouvez les placer sur une page d’inscription ou même dans votre section de commentaires.
Comme vous pouvez le constater, lorsque les boutons de connexion apparaissent sur une page ou un article, le CSS du thème est appliqué. Dans ce cas, en utilisant le thème WordPress Twenty Nineteen, la police a changé par rapport à ce que nous avons vu sur la page de connexion. Vous devrez donc appliquer un CSS supplémentaire pour styliser les boutons.
Dans ce cas, le thème WordPress est personnalisable. Je suis donc allé à
Apparence Personnaliser CSS supplémentaire
et j’ai appliqué une police sans empattement à la classe du bouton de connexion comme suit :
Et cela a permis d’améliorer l’apparence :
Je ne suis pas sûr de ce qui se passe avec le logo Google lorsque les boutons sont affichés dans les commentaires. J’ai envoyé un message au développeur, et si je reçois une réponse, je posterai une mise à jour.
Un coup de chapeau au développeur pour avoir fourni un moyen de supprimer son logo de l’affichage des boutons. Il suffit de décliquer l’option “Afficher le logo miniOrange avec les icônes de connexion sociale sur le formulaire sélectionné” dans l’onglet “Options d’affichage”.
Affichage des boutons de connexion sur une page ou un message spécifique
Vous n’êtes pas limité à l’affichage des boutons de connexion sociale aux emplacements prévus. Il existe un code court que vous pouvez utiliser pour les placer n’importe où :
[miniorange_social_login]
Ici, j’ai ajouté le shortcode au milieu d’une page.
Non pas qu’il y ait une raison d’ajouter des identifiants sociaux à une page, mais il est là pour vous montrer les possibilités.
Que se passe-t-il si vous désinstallez le plugin WordPress Social Login ?
Si vous désinstallez le plugin, soyez conscient de ce qui suit :
- Les logins sociaux ne seront plus disponibles.
- Les utilisateurs créés lors de la connexion via le login social ne seront plus en mesure de se connecter. (Leur courriel pourrait être utilisé comme nom d’utilisateur, mais une réinitialisation du mot de passe serait nécessaire pour créer un mot de passe).
- Les shortcodes du plugin ne fonctionneront plus, donc les shortcodes eux-mêmes seront affichés partout où ils ont été utilisés.
Réduire les frictions, augmenter la communication
Proposer plusieurs façons de se connecter à votre site Web WordPress augmente l’engagement des visiteurs. C’est clair. Donc, tout ce que vous pouvez faire pour faciliter la tâche des visiteurs est dans votre intérêt.
Transférer les autorisations des utilisateurs à une autre plateforme n’est pas forcément idéal. Je comprends cela. Mais si l’alternative est qu’un visiteur soit refoulé par une barrière à l’entrée, c’est probablement un compromis raisonnable.
Les humains sont des créatures sociales. Vos visiteurs veulent s’engager. Ce plugin leur permet de le faire facilement.
Autorisez-vous l’enregistrement des utilisateurs sur votre site WordPress ? Avez-vous déjà exploré des méthodes alternatives ou supplémentaires ? Faites-le moi savoir dans les commentaires.