Share
Facebook a lancé les plugins sociaux pour les développeurs en 2010. Vous connaissez tous au moins l'un d'entre eux, le bouton "J'aime" que vous voyez sur de nombreux articles de blog sur le réseau (comme celui-ci, excusez-moi!). Aujourd'hui, nous nous concentrons sur le système Commentaires Box. L'ajout de commentaires Facebook permet à l'utilisateur de commenter sur votre blog en utilisant son compte Facebook. Il n'a pas besoin d'entrer son nom et son adresse email ou même de créer un compte sur votre site..
Je ne vais pas insister trop pour savoir si vous avez réellement besoin de cette fonctionnalité sur votre propre blog. Chaque site a son propre ensemble de priorités et de meilleures pratiques. Mais, pour les besoins de l’argumentation, examinons les avantages de l’ajout de commentaires Facebook à votre site WordPress..
Voici une liste de fonctionnalités:
Si un utilisateur ouvre une publication avec des commentaires Facebook sur la page, le script vérifie si l'utilisateur est connecté à Facebook. Cela se produit dans une iframe, aucune donnée n'est donc réellement transférée sur votre serveur. La seule information dont le script a besoin sur votre site Web est un identifiant d'application Facebook et l'URL complète de la publication. Avec l'identifiant de l'application, Facebook vérifie si l'utilisateur est autorisé à modérer des commentaires ou à modifier les paramètres de la zone de commentaires. L'URL est utilisée pour localiser les commentaires sur les serveurs de Facebook. Si l'utilisateur n'est pas connecté à Facebook, il peut se connecter directement à partir de la zone de commentaires..
Ajoutons maintenant la boîte à commentaires à votre thème..
Pour ajouter une boîte de commentaires Facebook, vous devez d'abord créer une application Facebook. Accédez à https://developers.facebook.com/apps/ et créez une nouvelle application. Entrez un nom et définissez les paramètres régionaux de l'application. Le nom n'est pas crucial, car il n'apparaîtra pas sur le site. Assurez-vous simplement que vous pouvez identifier l'application plus tard, si vous avez plusieurs sites Web avec les commentaires Facebook activés.
Vous pouvez maintenant voir un aperçu de votre application. Vous pouvez modifier le nom, les paramètres régionaux et d’autres informations. Étant donné que l'application ne sera pas publiée dans le répertoire d'applications, vous n'avez pas besoin de remplir les autres champs. Important est le ID de l'application que vous pouvez trouver en haut de la page. Nous aurons besoin de l'identifiant plus tard lors de l'ajout du code au thème.
La personne qui a créé l'application est l'administrateur et peut donc modérer les commentaires par défaut. Pour ajouter un autre administrateur, cliquez sur Rôles sur le site de gauche. Vous devez être ami avec la personne à qui vous voulez attribuer le rôle d'administrateur..
Il est également nécessaire de configurer l'URL du site et le domaine. Cliquer sur Web dans le volet de navigation de gauche et entrez l’URL complète de votre blog en tant qu’URL de site. Le nom de domaine est l'URL de base. Par exemple: si votre blog est hébergé sur http: //somecooldomainname.tld/mike/my-blog, le tout serait l'URL du site et somecooldomainname.tld est le domaine lui-même.
L'ajout des commentaires ne prend que 4 lignes de code.
Vous devez ajouter l'identifiant de l'application Facebook à votre header.php déposer dans le
étiquette. Et vous devez remplacer 'VOTRE APP ID' avec l'ID de votre application nouvellement créée.Voici un exemple de
.<?php wp_title( '|', true, 'right' ); bloginfo( 'name' ); ?>
Comme vous pouvez le constater, l'ID de l'application a été ajouté directement après le jeu de caractères dans la section head..
Voyons d'abord le code.
L'appel JavaScript dans la deuxième ligne a une référence de locale (en_US). Si vous souhaitez que votre zone de commentaires apparaisse dans une langue différente, vous pouvez modifier l'URL. Par exemple http://connect.facebook.net/de_DE/all.js est pour l'interface allemande. J'ai aussi trouvé fr_FR et es_ES pour que la France et l'espagnol fonctionnent. Si vous voulez voir si une langue différente est prise en charge, ouvrez simplement le lien http://connect.facebook.net/de_DE/all.js dans une nouvelle fenêtre et modifiez les paramètres régionaux dans l'URL. Vous recevrez une erreur si les paramètres régionaux ne sont pas pris en charge..
Le tag fb: commentaires dans la troisième ligne indique à la zone de commentaires d'afficher uniquement les commentaires pour l'URL définie. Utiliser la fonction WordPress the_permalink () nous permet d'affecter dynamiquement l'URL correcte pour chaque message. Si vous utilisez une URL fixe, les mêmes commentaires apparaîtront sur chaque publication / page. Juste pour le plaisir, essayez d'utiliser "http: // localhost" comme URL. Vous recevrez un message d'erreur de Facebook indiquant que la page n'est pas accessible, mais qu'elle fonctionnera toujours. Et comme vous pouvez le voir, il y a des commentaires d'autres développeurs qui ont utilisé la même URL pour les tests.
Vous devez également modifier l'option largeur (en px) en fonction de votre thème. Cette option définit la largeur de l'ensemble de la zone de commentaires. Il y a une autre option appelée num_posts. Avec cela, vous pouvez définir combien de commentaires sont affichés par défaut. S'il y a plus de commentaires que définis dans num_posts, il affichera un lien pour en montrer plus.
Il est plus facile de modifier le commentaires.php. Bien sûr, cela est différent dans chaque thème, alors suivez simplement les règles de base.
Afficher uniquement les commentaires si:
J'ai modifié le fichier comments.php du thème par défaut "Twenty Ten" comme exemple:
Comme vous pouvez le constater, nous n'affichons la zone de commentaires que s'il n'y a pas de protection par mot de passe ou si la publication est publique (ligne 9). Si les commentaires sont fermés, un message approprié est affiché..
C'est le thème par défaut avec les commentaires Facebook activés.
Vous pouvez voir un message d'erreur au-dessus du premier commentaire. Il est apparu parce que j’appelais la zone de commentaires à partir de mon serveur Web local via http: // localhost / wordpress /? p = 1 et Facebook ne peut pas s'y connecter. Alors, à quoi ça ressemble en ligne? Ceci est la vue pour un administrateur.
Si vous comparez la capture d'écran avec celle ci-dessus, vous verrez des options supplémentaires. Même si j'étais reconnu comme "moi" lorsque j'ai ouvert la page à partir de mon serveur local, Facebook n'a pas pu accéder au site lui-même. Maintenant que c'est en ligne et que Facebook peut atteindre la page, je peux accéder aux options de l'administrateur pour modérer les commentaires et modifier les paramètres. Les commentaires peuvent être modérés sur chaque page de publication ou sur tous les commentaires en même temps ici http://developers.facebook.com/tools/comments.
Dans la page des paramètres, vous pouvez définir si les commentaires sont visibles par tout le monde immédiatement ou si vous souhaitez les vérifier en premier. Vous pouvez également créer une liste noire pour les mots incorrects, autoriser la connexion via un fournisseur externe (voir ci-dessous) et activer une simple correction orthographique..
Si un utilisateur non-administrateur consulte les commentaires, il verra ce qui suit:
Si vous décidez de poster le commentaire sur votre mur, celui-ci sera affiché comme ceci:
Une session Facebook doit être ouverte pour authentifier l'utilisateur. Si l'utilisateur n'est pas connecté, il peut soit se connecter à Facebook, soit utiliser un autre service (Yahoo !, AOL ou Hotmail) pour s'authentifier..
Comme je l'ai dit, autoriser les services tiers pour l'authentification est facultatif et peut être désactivé dans les paramètres..
Le nombre de commentaires s'affichera en haut de la zone de commentaires, où vous pourrez également modifier l'ordre d'affichage des commentaires. Le nombre de commentaires peut également être affiché en utilisant cette iframe.
Il vous donnera la bulle de dialogue classique de Facebook et le texte $ n commentaires, tout vient en bleu Facebook.
Si vous souhaitez modifier le style du nombre de commentaires, essayez d’utiliser le méthode:
Accentsconagua
