Installer les commentaires Facebook sur WordPress sans Plugins !
Votes : environ (100%) 1 vote

Comme vous le savez, Facebook est le réseau le plus célèbre au monde, avec plus de 800 millions d’utilisateurs actifs, donc si vous possédez un blog ou un site qui marche sous le CMS WordPress, utiliser les commentaires Facebook peut être utile pour vos lecteurs… pour votre site !

Laisser un commentaire en utilisant son compte Facebook est plus rapide, et les moteurs de recherche commencent à s’habituer à ce changement, Google a commencé dernièrement l’indexation des commentaires Facebook !

L’avantage particulier de cette méthode est de faire connaître votre site web, sans même passer par le partage, car en mettant un commentaire, Facebook va partager automatiquement le lien de la page avec le commentaire qu’a laissé le visiteur sur votre site, sur son mur (journal) !

Vous allez découvrir dans ce tutoriel une méthode parmi plusieurs permettant d’ajouter les commentaires Facebook sur votre site web WordPress, et comment désactiver (si vous voulez) le système de commentaires par défaut de WordPress…

Allons-y !

Comment ajouter les commentaires Facebook sur WP sans Plugins…

Créer une application et obtenir le ID :

Vous devez dans un premier temps créer une application, pour cela ouvrez ce lien : https://developers.facebook.com/apps/

Cliquez sur « Créer une application« …

Mettez un nom quelconque, car cela ne sera plus affiché tant que vous n’allez l’utiliser que pour l’activation des commentaires Facebook… Mettez un Namespace pour les statistiques…

Validez la CAPTCHA… en recopiant ce qui est affiché dans l’image…

Une fois l’application créée, ouvrez cette page : https://developers.facebook.com/apps et recopiez l’ID de votre application…

Bien ! Voyons maintenant comment ajouter le code à votre thème, rien de plus facile :)

Ajouter le code de l’application :

En fait, le code n’est pas assez compliqué, il ne dépasse pas les 5 lignes !

Connectez-vous à l’hôte de votre hébergement en utilisant un client FTP (Filezilla), puis accédez au dossier de votre thème… Ouvrez le fichier « header.php« …

Collez le code meta suivant juste après la balise <head> :

[php]

<meta property=’fb:app_id’ content=’LE ID DE VOTRE APP ICI’ />

[/php]

Vous n’avez qu’à mettre le ID de votre application, et en voici le résultat pour mon thème :

[php]

<head>
<meta property=’fb:app_id’ content=’373820235968837′ />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title><?php bloginfo(‘name’); ?> <?php wp_title(); ?></title>
<link rel="pingback" href="<?php bloginfo(‘pingback_url’); ?>" />
<meta name="generator" content="WordPress <?php bloginfo(‘version’); ?>" /> <!– leave this for stats –>
</head>

[/php]

Puis ouvrez le fichier « comments.php » pour ajouter le code suivant juste avant ou après <!– You can start editing here. –>

Si vous ne trouvez pas cela dans votre thème, essayez de coller le code suivant juste avant la ligne <?php if ($comments) : ?>, cela va placer les commentaires Facebook avant les commentaires du WordPress…

[php]

<div id="fb-root"></div>
<script src="http://connect.facebook.net/fr_FR/all.js#xfbml=1"></script>
<fb:comments href="<?php the_permalink(); ?>" width="600"></fb:comments>

[/php]

Vous pouvez bien-sur modifier la largeur en modifiant la valeur de l’attribut width= » »…

Voici le résultat pour mon thème :

[php]

<!– You can start editing here. –>
<center>
<?php if ( comments_open() ) : ?>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/fr_FR/all.js#xfbml=1"></script>
<fb:comments href="<?php the_permalink(); ?>" width="600"></fb:comments>
<?php endif; ?>
</center>

<?php if ($comments) : ?>
<h2 id="comments"><?php comments_number(‘Pas de commentaires…’, ‘Déjà un commentaire.’, ‘Déjà % commentaires !’ );?> <a href="#respond"> { Ajouter le vôtre ? }</a></h2>

<div class="commentlist">
<?php wp_list_comments2(); ?>
</div>

<?php else : // this is displayed if there are no comments so far ?>

<?php if (‘open’ == $post->comment_status) : ?>
<!– If comments are open, but there are no comments. –>

<?php else : // comments are closed ?>
<!– If comments are closed. –>
<p class="nocomments">Les commentaires sont fermés.</p>

<?php endif; ?>

[/php]

J’ai ajouté la balise <center> pour centrer, et <?php if ( comments_open() ) : ?> pour n’afficher les commentaires que si les commentaires sont activés !

Si vous voulez afficher le nombre des commentaires publiés, vous n’avez qu’à ajouter le code suivant à n’importe quelle place dans votre thème :

[php]

<fb:comments-count href=<?php the_permalink(); ?>></fb:comments-count> commentaires

[/php]

Le résultat :

Et en voici le résultat de ce tutoriel…

Voici l’aperçu de la zone des commentaires Facebook pour un administrateur, un commentaire déjà publié :

Si vous cliquez sur « Vue modérateur« , vous aurez la possibilité de supprimer les commentaires et autres possibilités que possède un modérateur…

Pour un visiteur normal :

A bientôt !

Soufiane – Easytutoriel.com