Comment ajouter le bouton "like" de Facebook sur Blogger et obtenir des statistiques de Facebook



Cet article sur le bouton "like" de Facebook est destiné à tous ceux qui voudraient installer un bouton "j'aime" dynamique de Facebook et avoir des statistiques de visites.

 A quoi ça ressemble? et qu'est ce que ça fait comme action,



























Ce bouton 'like" connecte votre visiteur à son compte Facebook, quand il clique sur votre bouton.
Ce bouton est dynamique puisqu'il  permet à votre visiteur de commenter le lien à partager sur Facebook, tout en affichant la photo de son profil.



Comment installer ce bouton?






















Tout d'abord:
Aller sur:

Tableau de bord
Votre blog
Présentation
Modifier le code HTML
Cocher la case"développer des modèles de Gadgets"
*pour ceux qui le souhaitent: sauvegarder votre Thème"

Quand vous êtes dans votre code source

Faites ctrl+F pour lancer une recherche dans votre code
Taper dans le champ de recherche:  <b:includable id=’post’ var=’post’>

 Et immédiatement en dessous, le code çi-dessous, après l'avoir copié dans votre presse-papier

 ou ctrl+A-->ctrl+C-->ctrl+V
<iframe expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&amp;layout=standard&amp;show-faces=true&amp;width=530&amp;height=60&amp;action=like&amp;colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:530px; height:60px' allowTransparency='true'></iframe>

Comme dans l'image du code ci-dessus.

Les boutons 'like" sont biens indépendants et correspondent à chaque article ( cf: image du blog en début d'article ).

Ensuite rendez-vous sur: http://www.facebook.com/insights/

Enregistrez votre nom de domaine, liez le à votre page Facebook ou votre profil ou votre application FB et copiez et coller un identifiant juste après la balise "head" de votre code source.

Exemple pour Techtoolgeek: <meta property="fb:page_id" content="155981994424414" />, comme vous l'auriez fait pour déclarer votre blog dans Google Outils pour Webmasters.



















Dès que Facebook aura vérifié que vous êtes bien le propriétaire du blog, ( c'est instantané ), vous pourrez consultez des rapports qui vous donnerons des indications sur vos visiteurs qui interagissent avec vos articles.

Attention, ce n'est pas Google Analytics, mais ça a le mérite d'exister.


Un exemple en image:












Commentaires

  1. Samantha Paul27 février 2011 à 23:38

    Merci pour votre tuto, enfin un bouton "I like" indépendant !!
    Mais comment le mettre en fin de message dans le code html ?
    Merci
    Sam

    RépondreSupprimer
  2. Franck Melka28 février 2011 à 16:39

    Je suis allé sur votre blog, il est super.
    Vous avez déjà résolu votre interrogation, votre bouton like de Facebook est bien en fin de votre message.
    Bonne semaine.

    PS: belles images;-)

    RépondreSupprimer
  3. Caroline Weiler4 mars 2011 à 16:21

    j'y arrive pas :(, le "code" à taper dans le champs de recherche n'est pas sur mon code html

    help

    RépondreSupprimer
  4. Franck Melka4 mars 2011 à 17:27

    Bonjour Caroline,

    je viens d'aller sur votre blog, la bouton like de FB est opérationnel.

    Il apparait bien sur mon mur.

    Bon week-end

    RépondreSupprimer
  5. Samantha Paul8 mars 2011 à 12:36

    Merci Franck pour vos compliments sur mon blog ça fait plaisir ! C'est un début ....
    En tout cas n'hésitez pas à faire des commentaires sur celui-ci ou a devenir membre, à le partager... afin de le faire vivre !
    Sinon oui j'ai bien réussi à mettre "I like" en fin de message un peu au hasard ;) en tout cas merci encore pour votre tuto ça m'a beaucoup aidé !!!
    A bientôt

    RépondreSupprimer
  6. L'Orange Déicide14 mai 2011 à 13:34

    Bonjour Monsieur,

    j'ai réussi grâce à votre article à ajouter un bouton "like" à la fin de mes articles, toutefois j'aimerais également ajouter un bouton "devenir fan de" sur le côté, afin que les visiteurs qui apprécient mon blog puissent suivre l'actu du blog sur facebook.

    J'ai bien réussi à récupérer le code ( < div id="fb-root">< script src="http://connect.facebook.net/en_US/all.js#xfbml=1"> ) ( j'ai du rajouter des espaces sinon le commentaire n'était pas publié )

    Hélas, je ne sais pas où le placer afin qu'il apparaisse sur la colonne de droite sur mon blog ( en dessous des abonnements aux flux RSS par exemple )

    Merci d'avance de votre aide !

    RépondreSupprimer
  7. Franck Melka14 mai 2011 à 15:16

    En fait c'est très simple;Ils suffit d'aller dans le tableau de bord, présentation, et dans la maquette de votre blog, cliquer sur ajouter un gadget (dans votre sidebar, bien sur).

    Ensuite vous aurez un choix de gadgets, sélectionnez celui qui vous permet de rajouter du code html qui est représenté par cette icône: "html" et tout simplement de rajouter votre code.

    Ensuite pour le déplacer dans votre sidebar, il faut cliquer dessus et le mettre à l'endroit que vous souhaitez.

    Bon week-end et bravo pour votre blog.

    RépondreSupprimer
  8. L'Orange Déicide15 mai 2011 à 14:24

    Effectivement, c'était tout bête ! Merci beaucoup, bonne continuation à vous :)

    RépondreSupprimer

Enregistrer un commentaire

Posts les plus consultés de ce blog

Comment installer GLPI sur Centos/GLPI ne peut pas fonctionner correctement sans les fonctions json_encode et json_decode> L'extension mbstring de votre parseur PHP n'est pas installée>

Image
Dans cet article nous allons voir comment installer GLPI sur un serveur Centos  5.2 et comment résoudre les différentes difficultés liées à cette installation. Dans notre cas de figure Centos est installé sur VMware. GLPI est solution open source de gestion de parc informatique, et Centos est une distribution GNU/Linux destinée aux serveurs. Important: avant toute chose, il faut immédiatement après l'installation de Centos, lancer une mise à jour par l'intermédiaire de la commande YUM . Pour celà, lancez: # yum list updates # yum update # reboot Pour notre démonstration, je travaillerai en mode graphique mais en ouvrant un terminal de façon à pouvoir travailler en CLI. Toutes les commandes seront écrites en rouge, dans mysql on termine toujours une commande par un point-virgule. Pour différencier les commandes du shell de celles de mysql: - devant chaque commande du shell, il y aura #  - devant chaque commande mysql, il y aura mysql> Avant tout
Lire la suite
Image
Découvrez comment rédiger des prompts efficaces pour les modèles GPT. Apprenez les structures, secrets et meilleures pratiques pour obtenir des réponses précises. Devenez un expert en prompt engineering. Dans cette formation, vous allez apprendre à rédiger des prompts, leurs structures, leurs secrets, les trucs et astuces pour obtenir un prompt parfait et ainsi un résultat précis.   A - La rédaction d'un prompt parfait pour interagir avec un modèle de langage comme #ChatGPT (ou n'importe quel modèle GPT) dépend largement de l'objectif que vous souhaitez atteindre.  Cependant, voici quelques conseils généraux pour optimiser vos prompts : 1. Clarté  : Soyez aussi clair et précis que possible. Évitez les ambiguïtés. 2. Contexte  : Fournissez suffisamment de contexte. Si vous posez une question avancée ou technique, il peut être utile de fournir des informations de base pour orienter la réponse. 3. Question explicite : Posez votre question de manière directe. Par exemple, &quo
Lire la suite

Augmenter le paramètre memory_limit lors de l'installation de GLPI / increase php memory limit/MAMP/Apache/php

Image
Lors de l'installation de GLPI sur un MAC (OSX Snow Leopard) utilisant MAMP , on a toujours un message d'erreur nous indiquant que GLPI nécessite 64 Mio de mémoire et qu'il est important de lui allouer cette mémoire en configurant le fichier php.ini. Cette opération est facilement réalisable, comme nous allons le voir. Bien entendu, l'objectif de cet article n'est pas d'apprendre comment installer MAMP sur un MAC, ni GLPI dans MAMP. Tout d'abord, quel est le message qui s'affiche? Dans les test de la mémoire allouée, par défaut nous avons 32 Mio alors que GLPI en nécessite 64 au minimum, on nous demande donc d'augmenter les paramètres memory_limit dans le fichier php.in, mais lequel? Pour connaitre le fichier à modifier, il nous tout d'abord savoir  quelle version de php est installée sur notre serveur, pour cela rendez-vous dans la page d'accueil de MAMP et cliquer sur l'onglet phpinfo Ensuite vous aurez tous les él
Lire la suite