Ajouter le bouton aimer Facebook pour un site sans plugin
Catégorie de l'article : Réseaux sociaux
Article Publié le : 30 janvier 2013
Article affiché 14043 fois
il y a 14 Commentaires
Vous auriez envie d’insérer un bouton Facebook sur votre site (ou la page Facebook lié à votre site) pour indiquer le nombre de personnes qui aime le site (et non un article du site).
Pour avoir le bouton qui s’affiche avec le nombre de personnes qui aiment (comme dans la partie droite, en haut de la page), il suffit d’insérer dans la partie footer du template, si vous ne l’avez pas :
<div class="fb-like" data-send="false" data-layout="standard" data-width="450" data-show-faces="false" data-colorscheme="light" data-action="like"<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/fr_FR/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Dans la partie où vous voulez insérer le code, saisissez le code suivant :
<!-- code facebook --> <div data-href="http://wordpress.buldozer.fr" data-send="false" data-layout="box_count" data-width="50" data-show-faces="false"></div> <!-- code facebook -->
Remplacer wordpress.buldozer.fr par l’adresse de votre site.
Voici ce que cela va donner :
Sinon, pour afficher cet autre exemple :
Il faut saisir cette ligne de code :
<!-- code facebook --> <div data-href="http://wordpress.buldozer.fr" data-send="false" data-layout="button_count" data-width="50" data-show-faces="false"></div> <!-- code facebook -->
Bonjour,
Est ce que ceci a un impact sur le referencement du site ?
Bonjour,
il semble que Google apporte de plus en plus d’importance aux réseaux sociaux.
Il commence à y avoir un impact sur le référencement du site
@Energie Verte : Ce n’est pas cela qui va permettre d’arriver en 1ère page, mais ça ne va pas non plus pénaliser. On va dire que ça ne mange pas de pain et que ça contribuera à vfaire en sorte que l’article puisse être relayer.
Bonjour,
Perso, vue ce que les réseaux sociaux peuvent actuellement apporter en terme de référencement il est juste de penser qu’insérer ce bouton pourrait améliorer le trafic non? Merci pour la tuto, je vais le tester sur un de mes blogs et voir les répercussions.
Bonjour,
cela ne coûte rien de mettre un bouton, on ne sait jamais. Google+1 risque de prendre plus d’ampleur pour le référencement, au niveau de google, on se demande pourquoi.
Bonjour,
Oui pourquoi pas sans pour autant que l’on s’attendent à ce que 1000 like te propulse en première page mais cela pourrait en effet aider. Tous les moyens sont bons pour se référencer du moins de manière « propret » alors le tester ne fera sûrement pas de mal sans, je redis, placer la barre haute.
Bonjour,
merci pour le message.
cela permet de gagner un lien sur Facebook
C’est toujours ca de gagner en visibilité je trouve. Je rejoins l’opinion de Malorie sur le fait de ne pas non plus rêvé à un positionnement top en l’effectuant mais c’est on peut dire un petit plus qui pourrait accélérer un petit quelque chose comme on dit! Merci du partage Philippe!
Ce n’est pas cela qui va permettre de propulser le site en première position, mais cela peut aider un peu
Je dispose déjà du bouton sur mon site, mais j’avais aucune idée du code. Sympa de partager, nous autres qui sommes pas forts en codage, c’est ces petits trucs qui nous font galérer.
De rien
Merci pour le code! J’avais pris un tout autre chemin qui m’avait mené à l’impasse. Bon, certes je ne suis pas pro mais j’aime à explorer les « possibilités » sans vouloir prendre toutefois trop de risques. Facebook, Twitter, Pinterest sont aussi importants je trouve.
Bonjour Philippe,
Merci pour ton article. Dans quel fichier faut il coller la 1ere partie du code ? (« <div class="fb-like" …)
Merci
Bonjour Christophe,
la première partie du code peut se coller n’importe où. Comme je l’ai indiqué, le mieux c’est de l’afficher dans le footer. Pourquoi ?
Tout simplement pour permettre un affichage de la page le plus rapidement. En le mettant dans le header, tu risques d’avoir une page blanche pendant quelques secondes. Si tu le met à la fin, toute la page sera déjà chargée