Facebook : Post embarqué / Embedded Post

Le code d'intégration d'une publication Facebook dans un article, code validé HTML5.
Avec ou sans le script intégré,
Choix de l'identifiant de l'application, réglage de la largeur, version HTML ou gadget AddToBlogger,
Le module emploie automatiquement la langue du blog.
Avec ou sans restriction d'affichage, intégration de CSS personnalisés, etc...

Table des matières

• Présentation des posts intégrés
• Configuration du module

Table des matières

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

Présentation des posts intégrés

Les posts partagés publiquement sur Facebook peuvent être intégrés dans les articles. Du simple petit message, en passant par les photos, vidéos, allant jusqu'aux commentaires déposés via le module de commentaires Facebook...

Configuration du module

Réglages du post	Versions HTML Gadget AddToBlogger Adresse Post FB ? Largeur 500px
Script	Intégrer le script Oui, uniquement dans le code du module Non, je l'ai déjà installé dans mon modèle Non, mais je veux l'installer dans mon modèle ? Langue Détection automatique ? Français (France) French (Canada) English (US) English (UK) English (Pirate) English (Upside Down) Afrikaans Arabic Azerbaijani Belarusian Bulgarian Bengali Bosnian Catalan Czech Welsh Danish German Greek Esperanto Spanish (Spain) Spanish Estonian Basque Persian Leet Speak Finnish Faroese Frisian Irish Galician Hebrew Hindi Croatian Hungarian Armenian Indonesian Icelandic Italian Japanese Georgian Khmer Korean Kurdish Latin Lithuanian Latvian Macedonian Malayalam Malay Norwegian (bokmal) Nepali Dutch Norwegian (nynorsk) Punjabi Polish Pashto Portuguese (Brazil) Portuguese (Portugal) Romanian Russian Slovak Slovenian Albanian Serbian Swedish Swahili Tamil Telugu Thai Filipino Turkish Ukrainian Vietnamese Simplified Chinese (China) Traditional Chinese (Hong Kong) Traditional Chinese (Taiwan) Langue ID application [NON-REQUIS] ? ID application
Affichage du module ?	Articles Pages autonomes Index Archive Pages 404 Uniquement à la page d'accueil
Mise en forme ?	Alignement horizontal Ne pas préciser Flottement à gauche Flottement à droite Aligner à gauche Centrer Aligner à droite Alignement vertical Ne pas préciser Haut Milieu Bas Display Ne pas préciser block inline inline-block CSS personnalisés [non requis]

Le code du module

<!-- Embedded Posts Facebook - Blogger Config.
     Ref.: http://goo.gl/R0ov83 -->

<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>

<div style="">
<div class="fb-post"
     data-href="https://www.facebook.com/Blogger.Code.PE/posts/600618066627269"
     data-width="500" >
</div>
</div>

Où recopier le code d'intégration ?

Sous cette configuration, le code d'intégration du post peut être ajouté aussi bien dans le code HTML d'un article, d'une page autonome ou dans un gadget HTML/JS.

<!-- Posts intégrés (Embedded Posts). Gadget AddToBlogger généré sur Blogger Code. Licence Creative Commons Attribution : Pas d'Utilisation Commerciale - Partage à l'Identique 3.0 non transposé. Attribution : Blogger Code Author : Soraya Lambrechts URL : https://bloggercode-blogconnexion.blogspot.com/ -->

Note : Les gadgets Add To Blogger ne sont pas disponibles pour les modèles dynamiques et la version mobile.

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.

Les contenus sociaux

• Facebook - Post
• Facebook - Commentaires
• Pinterest - Épingle
• Pinterest - Tableau

Les timelines

• Facebook - Plugin Page
• Twitter - Timeline

Les boutons de partage

• Facebook - Bouton J'aime
• Facebook - Bouton Partager
• Facebook - Bouton Enregistrer
• Pack Facebook
• Pack Blogger
• Twitter - Bouton Tweet
• Twitter - Bouton Mention
• Pinterest - Bouton Pin-It
• LinkedIn - Bouton Partager

Les boutons et badges de profil

• YouTube - Bouton S'abonner
• Twitter - Bouton Suivre
• Pinterest - Bouton Suivre
• Pinterest - Widget Profil

Les scripts des plugins sociaux

• Facebook - JS SDK