Ce tutoriel vous aidera à intégrer le bouton j'aime de Facebook, dans votre blog, où vous voulez.
Ces quelques lignes de codes auront sûrement un impact positif sur le trafic de votre blog, et engagera mieux vos visiteurs.
Tutorial d'intégration du bouton J'aime à Blogger
Niveau : Facile
Connectez vous à votre blog, puis modèle, et cliquez sur ' modifier le code HTML '
Au début du code, ajoutez le code ci dessous tout près de ' <html ' . Voire photo ci dessous
xmlns:fb="https://www.facebook.com/2008/fbml"
Etape 2 : Maintenant, vous devez choisir ou mettre le bouton j'aime, vous avez 3 choix:
CHOIX 1:
Boutons de partage en haut de l'article (En dessous du titre):
On cherche alors grâce au bouton de clavier ' F3 ' , ou bien en appuyant simultanément sur 'Ctrl' et 'F', le code: ' <post-header-line-1> ' , et juste après on ajoute le code de l'étape prochaine. (Etape 3)
CHOIX 2:
Boutons de partage en bas de l'article (En dessous de l'article):
On cherche alors grâce au bouton de clavier ' F3 ' , ou bien en appuyant simultanément sur 'Ctrl' et 'F', le code: ' <data:post.body/> ' , et juste après on ajoute le code de l'étape prochaine. (Etape 3)
Etape 3 : Le code Facebook.
Après avoir effectué votre choix, il ne vous reste qu'à ajouter le code ci dessous (Après personnalisation, si vous voulez).
<div> <b:if cond='data:post.isFirstPost'> <script>(function(d){ var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;} js = d.createElement('script'); js.id = id; js.async = true; js.src = "//connect.facebook.net/fr_FR/all.js#xfbml=1"; d.getElementsByTagName('head')[0].appendChild(js); }(document));</script> </b:if> <fb:like expr:href="data:post.canonicalUrl" layout='standard' send='true' show_faces='false' font="arial" action="like" colorscheme="light"></fb:like> </div>
Personnalisation du code:
J'ai colorié tout les variables modifiables, je vais les expliquer et par quoi les changer (avec la même couleur).
1 - Le code en rouge:
Le code en rouge désigne le type du bouton. Il en existe 3, à savoir:
- standard: Le type standard et basique, montre le nombre de gens qui on liké votre article, et apparaît une phrase : Soyez le premier de vos amis.
- Button_count : C'est une version plus minimaliste que la standard, du coup moins large, et ne fait pas apparaître la phrase, mais conserve le nombre de likes.
- Box_Count : Une version plus haute, et moins large de la button_count.
 |
| Différents types du bouton j'aime |
2 - Le code en jaune:
Cette variable prend 2 valeurs:
- true : Fait apparaître le bouton envoyer à côté du bouton j'aime.
- false : Enlève le bouton envoyer.
3 - Le code en vert:
Cette variable prend aussi 2 valeurs:
- true : Fait apparaître les visages des gens qui ont aimé votre article.
- false : Enlève les visages.
4 - Le code en bleu:
Qui désigne la police du verbe, et la hrase de ce bouton, vous pouvez la remplacer par:
arial | lucida grande | segoe ui | tahoma | trebuchet ms
5 - Le code en violet:
Désigne le verbe à apparaître dans le bouton:
- Like : Fait apparaître ' J'aime '
- Recommend : Fait apparaître le verbe ' Recommander '
6 - Le code en gris:
Il existe 2 couleur pour le bouton j'aime:
- light : Couleur standard à savoir le bleu ciel.
- dark: Couleur grise, optimisée pour les thèmes plus sombres.
Après avoir personnaliser votre code, ajouter le après votre choix de l'étape 2, sauvegardez, et c'est bon :-)
Si vous avez un problème quelque part, n'hésitez pas à le signaler.
Bonjour,
RépondreSupprimerJ'aimerais mettre un bouton "j'aime" sur mes articles, dans l'idéal relié aux "j'aime" de la page facebook associé.
J'ai essayé de nombreux codes sur internet je n'arrive à en faire marcher aucun.
J'ai également testé le votre, et miracle, j'ai réussi à le mettre sur l'article delà première page. Mais hélas joie de courte durée, il n'apparaît pas sur les autres articles. Que faire ?
Merci d'avance pour votre aide.
MERCI MERCI MERCI !!!! vraiment ça me sauve !!! clair net et précis tout ce qu'il me fallait
RépondreSupprimerBonjour ,
RépondreSupprimerSur mon blog, Mon compteur "j'aime"' de facebook" tourne à " 0 j'aime" , 5 ou 7 jours après la publication de l'article. Pouvez-vous m'aider à corriger cela svp ??
J'avais plus de 960 "jaime" sous un article qui ne contient que 0 j'aime actuellement.
Quelqu'un peut m'aider ? Merci d'avance.
j'ai toute essayé et rien ne fonctionne ????? pas capable de mettre le bouton j'aime de Facebook
RépondreSupprimerpour moi nickel. par contre j'ai mis le code entre les balises div class='post-header' et div class='post-header-line-1'/et ça marche :) sinon ça ne marchait pas ! j'ai fait au moins 7 sites internet et rien ne marchait. trop contente :) merci !!!
RépondreSupprimerhttp://the-fu-way.blogspot.fr
Merci ça marche bien chez moi voir résultat : http://www.star-tair.com/
RépondreSupprimerEl lisant j'ai remarqué que vous avez parlé des 3 choix, par contre vous avez distingué que 2 loool. L'essentiel ça roule merci une autre fois.
Enregistrer un commentaire