Excessivement populaire

Facebook : Boîte de commentaires / Comments Box

Facebook : Boîte de commentaires / Comments Box

La boîte des commentaires Facebook, configuration pour Blogger. Code validé HTML5.
Avec ou sans mode administrateur.
Version HTML ou gadget AddToBlogger.
Divers réglages : largeur, ordre de tri, thème, nombre de commentaires, etc.
etc...


En obtenant et en utilisant des plugins Facebook, vous acceptez les conditions d'utilisation de Facebook.

Présentation de la boîte

Ce développement permet d’intégrer la boîte de commentaires FaceBook sur votre blog de 2 manières :
  1. Dans le code HTML du modèle. Dans ce cas-là, la boîte remplacera l'un des modules fournis par défaut par Blogger. Ce qui vous permettra de gérer l'affichage depuis l'interface.
  2. Via un gadget "AddToBlogger".

Démo
Lien : commentaires


Installation du module

Paramétrez d'abord les options dans le tableau. Les méthodes d'installation ci-dessous varieront en fonction de vos choix.

Support
Placer dans
Raccorder aux options Blogger
Remplacer
J'utilise
Sous cette configuration, vous devrez activer vos flux de blog et désactiver les commentaires Google+, via votre tableau de bord Blogger.
Le module Facebook sera également disponible dans votre modèle mobile.
Apparence
Largeur 100% ?
Thème
Nbre de commentaires 2 commentaires
Ordre des commentaires
Langue ?
Administrateur ?
ID application [NON-REQUIS] ?
id de votre profil [NON-REQUIS] ?

Le code du module
<b:includable id='fbcomments' var='post'>
<!-- Comments Box Facebook - Blogger Config.
     Ref.: https://goo.gl/UA2AwZ -->

  <b:if cond='data:post.allowComments'>
    <div class='comments' id='comments'>
      <a id='fbcomments'/>
      <h4><span class='fb-comments-count' expr:data-href='data:post.url.canonical'/> <data:commentLabel/></h4>
      <div class='fb-comments'
           expr:data-href='data:post.url.canonical'
           data-num_posts='2'
           data-order_by='social'
           data-width='100%'
           data-colorscheme='light' />

    </div>
  </b:if>
</b:includable>
<b:includable id='fbcomment_count_picker' var='post'>
<!-- Comments Count Facebook - Blogger Config.
     Ref.: https://goo.gl/UA2AwZ -->

  <a class='comment-link' expr:href='data:post.url.canonical + &quot;#fbcomments&quot;'><span class='fb-comments-count' expr:data-href='data:post.url.canonical'/> <data:top.commentLabel/></a>
</b:includable>
Où recopier ce code ?

  • Tableau de bord
  • Modèle
  • Modifier le code HTML
  • Rechercher Gadget Blog1

Déployez (►) le gadget Blog1 :

<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog'></b:widget>

Recopiez le code avant l'inclusion main :

<b:includable id='main' var='top'></b:includable>



Raccordement de la boîte
<b:include data='post' name='fbcomments'/>
Où recopier ce code ?
Les emplacements cités peuvent varier en fonction des antécédents de votre modèle. La méthode est basée sur la dernière mise à jour de Blogger qui remonte à juin 2013.

Dans le code du gadget Blog1, déployez (►) l'inclusion comment_picker :

<b:includable id='comment_picker' var='post'></b:includable>

Dans cette inclusion remplacez la balise :

<b:include data='post' name='threaded_comments'/>



Raccordement du lien commentaire dans les index
<b:include cond='data:blog.pageType not in {&quot;item&quot;, &quot;static_page&quot;} and data:post.allowComments' data='post' name='fbcomment_count_picker'/>
Où recopier ce code ?
Les emplacements cités peuvent varier en fonction des antécédents de votre modèle. La méthode est basée sur la dernière mise à jour de Blogger de mars 2015.

Pour la version web

Dans le code du gadget Blog1, déployez (►) l'inclusion post :

<b:includable id='post' var='post'></b:includable>

Dans cette inclusion remplacez la balise :

<b:include cond='data:blog.pageType not in {&quot;item&quot;,&quot;static_page&quot;}                          and data:post.allowComments' data='post' name='comment_count_picker'/>


Pour la version mobile personnalisée

Dans le code du gadget Blog1, déployez (►) l'inclusion mobile-index-post :

<b:includable id='mobile-index-post' var='post'></b:includable>

Dans cette inclusion remplacez la balise :

<b:include cond='data:blog.pageType != &quot;static_page&quot;                          and data:post.allowComments                          and data:post.numComments != 0' data='post' name='comment_count_picker'/>



Le script
<div id='fb-root'/>
<script>
  var localeFB = &quot;<data:blog.locale/>&quot;;
  // <![CDATA[
    (function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      var localeList = { 'af': 'af_ZA', 'de': 'de_DE', 'en': 'en_US', 'en_GB': 'en_GB', 'ar': 'ar_AE', 'eu': 'eu_ES', 'bn': 'bn_IN', 'bg': 'bg_BG', 'ca': 'ca_ES', 'zh_HK': 'zh_HK', 'zh_CN': 'zh_CN', 'zh_TW': 'zh_TW', 'ko': 'ko_KR', 'hr': 'hr_HR', 'da': 'da_DK', 'es_419': 'es_LA', 'es': 'es_ES', 'et': 'et_EE', 'fil': 'tl_PH', 'fi': 'fi_FI', 'fr': 'fr_FR', 'fr_CA': 'fr_CA', 'gl': 'gl_ES', 'el': 'el_GR', 'iw': 'he_IL', 'hi': 'hi_IN', 'hu': 'hu_HU', 'id': 'id_ID', 'is': 'is_IS', 'it': 'it_IT', 'ja': 'ja_JP', 'lv': 'lv_LV', 'ms': 'ms_MY', 'ml': 'ml_IN', 'nl': 'nl_NL', 'no': 'nn_NO', 'fa': 'fa_IR', 'pl': 'pl_PL', 'pt_BR': 'pt_BR', 'pt_PT': 'pt_PT', 'ro': 'ro_RO', 'ru': 'ru_RU', 'sr': 'sr_RS', 'sk': 'sk_SK', 'sl': 'sl_SI', 'sv': 'sv_SE', 'sw': 'sw_KE', 'ta': 'ta_IN', 'cs': 'cs_CZ', 'te': 'te_IN', 'th': 'th_TH', 'tr': 'tr_TR', 'uk': 'uk_UA', 'vi': 'vi_VN', 'am': 'en_US', 'gu': 'en_US', 'kn': 'en_US', 'mr': 'en_US', 'or': 'en_US', 'ur': 'en_US', 'zu': 'en_US' };
      js.src = "//connect.facebook.net/"+localeList[localeFB]+"/all.js#xfbml=1";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, "script", "facebook-jssdk"));
  // ]]>
</script>
Où recopier le script ?

Le script Facebook est un élément essentiel au fonctionnement de tous les modules officiels de ce réseau social. Si vous avez déjà installé un module Facebook sur votre blog, vous n'êtes plus obligé de le rajouter à nouveau.

Le script doit être positionné juste après la balise <body > dans le code HTML du blog.

En savoir plus



Gérer l'affichage depuis le tableau de bord

Si vous avez installé la version HTML dans l'éditeur HTML du modèle, vous avez la possibilité de gérer l'affichage.

Activation / désactivation générale.

  • Paramètres
  • Publications et commentaires
  • Commentaires
  • Emplacements des commentaires


Pour activer, vous sélectionnez : Imbriqués.

Pour désactiver, vous sélectionnez : Masqués.

Les options Page pleine et pop-up sont inopérantes.


Facebook : Commentaires


Activation / désactivation par article.

Dans l'éditeur des articles, depuis la colonne des paramètres des articles, vous pouvez activer ou désactiver les commentaires en cochant soit :
Autoriserpour afficher.
Ne pas autoriser, masquer les existantspour désactiver.
Ne pas autoriser, afficher les existantsoption inopérante.


Facebook : Commentaires


Les contenus sociaux

Spotlight

Populaires cette semaine