Archive Pages Design$type=blogging

Integrer la plateforme de commentaire Facebook pour Blogger

Sur le même sujet:

Tuto pour intégrer 'Facebook Comments' pour Blogger

Difficulté: Moyen | Requis: Compte Facebook, blog sous Blogger.

1 - Tout d'abord, vous devez créer une application Facebook pour votre blog, pour cela, rendez-vous içi: https://developers.facebook.com/apps

2 - En haut à droite, cliquez sur 'Créer une application': voir photo ci-dessous:


3 - Après, vous allez être redirigé vers ce screen. Vous devriez choisir:


  • Un nom pour votre app, vous pouvez choisir n'importe quel nom. Par exemple, je l'ai appelé: "blogger pour les nuls comments"
  • Un namespace pour votre app, qui ne doit pas contenir de majiscules, ni d'espaces. Vous pouvez aussi choisir n'importe quel nom. Ex: bplncomments
  • Ne cliquez surtout pas sur la dernière option, car elle n'est pas nécessaire pour les commentaires!

4 - Vous devriez après passer un test captcha :

5 - Si votre compte Facebok est déjà confirmé, vous serez redirigé vers l'étape 6, sinon, vous devriez l'activer en passant le test de confirmation ( Vous mettez votre Num de tél, puis on vous envoie un code de confirmation).

6 - Vous serez redirigé vers la page ci-dessous:
  • En rouge votre App ID
  • En vert, vous devez ajouter 'Blogspot.com' , comme sur la photo. ( n'est pas nécessaire si vous avez un nom de domaine personnalisé)
  • En bleu, mettez l'adresse de votre blog.
  • Finalement cliquez sur 'Enregistre les modification'

Une fois enregisté, votre APP est prête!

7 - Maintenant, copiez votre APP ID (encadré en rouge en haut sur la photo), puis mettez le à la place de FB-ID ci dessous: 

<meta content="FACEBOOK-APP-ID" property="fb:app_id" />

Ca ressemblera à ça, dans mon cas :

<meta content=" 360128287371147 " property="fb:app_id" />

8 - Connectez vous à Blogger, puis choisissez modèle, puis cliquez sur 'modifier le code HTML': voir photo.

Cliquez ensuite sur 'Traîter', puis sur la touche sur votre clavier ' F3 ', ou bien ' Ctrl ' et ' F ', puis tapez <head>

9 - Une fois <head> localisée, copiez ci-dessous le code de l'étape 7 (Voire photo):


Ensuite en cliquez sur 'Enregistrer le modèle'

10 - Maintenant, on doit ajouter des codes, pour celà on procède de la même façon:
Blogger > Modèle > Modifier le code HTML > Traîter > et là en clique sur le bouton en haut ' Développer des modèles de gadgets '

11 - Cherchez le code ci-dessous grâce à F3 ou ctrl+F : 

<div class='post-footer-line post-footer-line-3'>

Voilà ce que ça donne en photo:


12 - Copiez le code ci-dessous, et ajoutez le immédiatement après le code que vous avez trouvé: 

<b:if cond='data:blog.pageType == "item"'> <div id="fb-root"></div> <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> <fb:comments width='450' colorscheme='light' expr:title='data:post.title' expr:href='data:post.canonicalUrl' expr:xid='data:post.id'/> </b:if>

Voilà ce que ça donne en image:


  • Notez que vous pouvez modifier la largeur de votre box de commentaire en changeant ' 450 ' en rouge par la largeur que vous voulez.
  • Vous pouvez également changer la langue dans les commentaires en remplacant 'fr_FR' en vert par 'en_US' pour l'anglais etc..
  • Si vous utilisez un thème sombre, remplacez 'light' en bleu par 'dark'.


13 - Maintenant cherchez grâce à Ctrl+f ou F3 le code suivant:  <html, puis ajoutez juste après le code suivant:

xmlns:fb="https://www.facebook.com/2008/fbml" 

Ca donnera le code comme ça: 

<html xmlns:fb="https://www.facebook.com/2008/fbml"

Voilà un screen de ce que ça donne:

Cliquez sur 'Enregistrer le modèle'

14 -  C'est bon! Maintenant, vous avez la plateforme de commentaires de Facebook sur votre blog ... ENJOY!

Une démo ? Voire ci dessous ;)
Aidez nous en partageant cet article sur vos réseaux sociaux ;)
Si vous avez un problème lors de l'installation, n'hésitez pas à laisser un commentaire :)

COMMENTAIRES

BLOGGER : 31
Loading...
Nom

astuces Facebook feature gadget Google Menu news Pages Réseaux Sociaux slider automatique templates Traduction trafic tutoriel
false
ltr
item
Blogger Pour Les Nuls: Integrer la plateforme de commentaire Facebook pour Blogger
Integrer la plateforme de commentaire Facebook pour Blogger
http://1.bp.blogspot.com/-EWDUsjhVPvs/T4nB0q3Lt9I/AAAAAAAAAT8/fF4dEGTimPM/s1600/hautdroite.jpg
http://1.bp.blogspot.com/-EWDUsjhVPvs/T4nB0q3Lt9I/AAAAAAAAAT8/fF4dEGTimPM/s72-c/hautdroite.jpg
Blogger Pour Les Nuls
http://blogger-pourlesnuls.blogspot.com/2012/04/integrer-la-plateforme-de-commentaire.html
http://blogger-pourlesnuls.blogspot.com/
http://blogger-pourlesnuls.blogspot.com/
http://blogger-pourlesnuls.blogspot.com/2012/04/integrer-la-plateforme-de-commentaire.html
true
7261274087058654712
UTF-8
Aucun article trouvé VOIR TOUS Lire la suite Répondre Annuler la réponse Supprimer Par Accueil PAGES ARTICLES Voir tous RECOMMANDE POUR VOUS LIBELLE ARCHIVE SEARCH Aucun article ne répond aux critère de votre requête Back Home Dimanche Lundi Mardi Mercredi Jeudi Vendredi Samedi Dim Lun Mar Mer Jeu Ven Sam Janvier Février Mars Avril Mai Juin Juillet Août Septembre Octobre Novembre Décembre Jan Fév Mar Avr Mai Jun Jul Août Sep Oct Nov Déc maintenant il y a une minute Il y a $$1$$ minutes il y a une heure Il y a $$1$$ heures Hier Il y a $$1$$ jours Il y a $$1$$ semaines il y a plus que 5 semaines