Générateur d'intégration Facebook

Introduction

Le Générateur d'intégration Facebook de Toollect transforme toute URL publique de publication, vidéo ou Page Facebook en code officiel d'intégration du SDK JavaScript que documente Facebook – la div fb-post / fb-video / fb-page plus le chargeur sdk.js – en un clic, avec un aperçu en direct rendu par le propre SDK de Facebook avant de copier.

La friction qu'il supprime est familière à quiconque a déjà collé du code Facebook à la main. Le configurateur de Facebook cache le plugin Page, répartit les options de publication et de vidéo sur des pages séparées et alterne entre les formes iframe et SDK sans expliquer les compromis. Écrire la div à la main échoue silencieusement quand un attribut data- est mal orthographié et la publication s'affiche comme un simple lien. Cet outil présente Publication, Vidéo et plugin Page côte à côte, expose chaque attribut documenté du plugin, inscrit votre choix de langue directement dans l'URL du chargeur et montre le rendu réel dans le même navigateur qui servira vos visiteurs.

Chaque voie de code est SDK uniquement par conception. Le SDK est le format que Facebook maintient pour les trois types de plugins, le seul qui prend en charge les langues d'affichage et le seul qui peut garder cohérents les onglets et le dimensionnement du plugin Page. Le générateur inclut fb-root et le chargeur quand vous en avez besoin et les omet quand votre site charge déjà le SDK, garde l'aperçu honnête sur les bloqueurs de publicités et le contenu privé et n'envoie jamais votre lien via un serveur Toollect.

Cas d'usage

Intégrer du contenu Facebook apparaît dans plus d'endroits qu'un article de blog, et les trois onglets se partagent naturellement le travail.

Blogs et contenu éditorial

Un billet de commentaire citant une publication publique, un article culturel réutilisant une vidéo virale, une critique intégrant la timeline d'une marque comme preuve sociale – les cas classiques. Le mode Publication avec la largeur par défaut de 500 pixels couvre la plupart des colonnes ; le mode Vidéo garde le lecteur au premier plan ; le plugin Page montre une timeline en direct sans captures d'écran.

Salles de rédaction et couverture en direct

Les reporters tirent les déclarations officielles et les publications de témoins dans la couverture continue. La vitesse compte, et la vérification aussi – le générateur normalise les liens mobiles de partage comme m.facebook.com et les URL chargées de suivi en une référence canonique, et l'aperçu confirme que la publication s'affiche encore avant de publier l'article.

Sites marketing et portfolios

Avis clients comme timelines de Page intégrées, vidéos de lancement comme lecteurs sur la page, publications d'annonce comme cartes. La sélection de langue affiche l'habillage autour dans la langue du visiteur et omettre le chargeur SDK garde les pages qui chargent déjà le SDK Facebook exemptes de scripts dupliqués.

Documentation et sites communautaires

Notes de version citant une publication de lancement, documentation référençant une annonce de groupe Facebook, pages d'événement montrant l'onglet Évènements d'une Page. Afficher le texte et le chargement différé permettent aux pages lourdes de rester discrètes jusqu'au défilement à proximité.

Fonctionnement

L'outil fonctionne en cinq étapes :

1. Analysez et classez l'URL – l'entrée est comparée à la grammaire des liens Facebook – ID numériques de 5–20 chiffres ou ID pfbid, noms d'utilisateur de 2–50 caractères, onglets correspondant à [a-z][a-z0-9_]* et les trois hôtes officiels facebook.com avec tout sous-domaine, fb.watch et fb.me. Les clés de requête de suivi sont lues puis ignorées pour le routage – l'URL canonique reconstruite ne les porte jamais. Les routes sans ID comme facebook.com/watch sans v ou fb.watch sans code court sont refusées.
2. Choisissez le type de plugin – post / photo / group-post correspondent à Publication, video / reel à Vidéo, page au plugin Page. La barre d'onglets suit le lien – coller une URL watch bascule automatiquement vers Vidéo, coller une URL de Page vers le plugin Page – et changer d'onglet manuellement efface la sortie périmée au lieu de rebondir.
3. Renseignez vos options – Langue depuis le menu déroulant de l'onglet, largeur et hauteur depuis les champs numériques, cases à cocher de Page pour les onglets et l'habillage, interrupteurs vidéo pour le plein écran, la lecture automatique et les sous-titres. Chaque modification est ramenée dans la plage valide, réécrite dans le champ et régénère immédiatement.
4. Construisez le balisage officiel – vos options deviennent des attributs data-* sur la div fb-* et, pour le plugin Page, l'URL du chargeur porte votre langue comme https://connect.facebook.net/{locale}/sdk.js#xfbml=1&version=v26.0. Aucune URL d'iframe n'est construite – le SDK consomme les attributs de la div au moment de l'analyse.
5. Affichez l'aperçu – le générateur injecte la div plus un fb-root dans l'hôte d'aperçu, charge ou recharge sdk.js pour la locale choisie, appelle FB.XFBML.parse et observe l'iframe résultante. Trois issues sont rapportées honnêtement – succès, bloqueur de publicités ou rendu qui ne peut pas s'achever.

Changer n'importe quelle option reconstruit toute la chaîne – nouveaux attributs, nouveau bloc de code, aperçu réanalysé – de sorte que le code que vous copiez correspond toujours à ce que vous regardez.

Formats d'URL pris en charge

Le générateur accepte toute forme d'URL qui identifie une publication, vidéo ou Page publique sur les trois hôtes officiels de Facebook et refuse tout le reste avec un message spécifique. Le schéma et www. sont optionnels ; les sous-domaines mobiles sont normalisés.

Formats acceptés

La barre oblique finale, le fragment hash et la chaîne de requête après l'ID sont tolérés et écartés ; les suffixes de vue comme un segment d'onglet numérique après un nom d'utilisateur sont traités comme une vue d'onglet Page, pas comme une ressource séparée.

Formats refusés

Le cas fb.watch mérite d'être souligné car le bouton de partage de l'app produit encore cette forme. Le générateur la refuse délibérément avec le message dédié aux liens courts et vous demande d'ouvrir le lien et de copier l'URL complète de la publication ou de la vidéo à la place. Coller l'URL développée réussit immédiatement.

Anatomie du code d'intégration

La sortie est le code que documente Facebook, avec vos options appliquées. Une intégration de publication aux réglages par défaut ressemble à ceci :

<div class="fb-post" data-href="https://www.facebook.com/facebook/posts/10153231379946729" data-width="500"></div>
<div id="fb-root"></div>
<script async defer src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v26.0"></script>

Parcours des parties :

• La classe de la div du plugin – fb-post, fb-video ou fb-page indique au SDK quel plugin instancier. Une classe par intégration.
• data-href – l'URL canonique de la section précédente, avec les esperluettes échappées. C'est le seul attribut obligatoire pour les trois plugins.
• data-width (Publication et Vidéo) – la largeur souhaitée en pixels. Publication accepte 350–750 par défaut 500 dans cet outil, Vidéo 220–1920 par défaut 500. Le SDK de Facebook dimensionne la carte à cette largeur quand c'est possible.
• data-show-text – présent quand Afficher le texte de la publication est coché. Facebook le documente pour les publications et vidéos qui contiennent une photo ; sans lui le texte peut rester masqué.
• data-lazy – présent quand Chargement différé est coché. Retarde le rendu jusqu'à ce que l'intégration soit proche du défilement.
• data-allowfullscreen / data-autoplay / data-show-captions (Vidéo uniquement) – allowfullscreen active le bouton plein écran, autoplay lance la lecture muette au chargement de la page sur ordinateur, show-captions affiche les sous-titres par défaut quand ils sont disponibles sur ordinateur. Les trois sont absents quand désactivés.
• data-tabs / data-height / data-small-header / data-adapt-container-width / data-hide-cover / data-hide-cta / data-show-facepile (plugin Page uniquement) – tabs liste les onglets visibles comme timeline,events,messages par défaut timeline, height par défaut 500, les booléens correspondent directement aux interrupteurs d'habillage du plugin.
• Le chargeur – fb-root plus sdk.js#xfbml=1&version=v26.0 depuis connect.facebook.net/{locale}/. en_US est un exemple – votre choix de langue inscrit le segment de locale. La case Include the fb-root div and sdk.js loader supprime tout ce bloc quand votre site charge déjà le SDK.

Un plugin Page avec des réglages non par défaut montre l'ensemble plus complet d'attributs :

<div class="fb-page" data-href="https://www.facebook.com/facebook" data-tabs="timeline,events" data-width="340" data-height="500" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-hide-cta="false" data-show-facepile="true"></div>

Options d'intégration

Chaque contrôle correspond à un attribut. Valeurs par défaut entre parenthèses.

Langue (par défaut votre langue de site Toollect – zh-hant devient zh_TW, zh-hans zh_CN, en en_US et de même pour de, es, fr, it, ja, nl, pt, sv) – affiche 60 locales de en_US à af_ZA avec des noms localisés par langue de page Toollect. Chaque sélection explicite, anglais compris, est inscrite dans l'URL du chargeur. Le SDK localise l'entourage de l'intégration – horodatages, libellés du bouton J'aime – jamais le texte de la publication lui-même.

Largeur (Publication 500, Vidéo 500, Page 340) – saisie comme nombre exact, ramenée à la plage valide dès que vous quittez le champ. Publication 350–750, Vidéo 220–1920, Page 180–500. Les valeurs hors plage sautent à la limite la plus proche – 5000 en Vidéo devient 1920.

Hauteur (Page 500) – plugin Page uniquement, 70–2048. Les publications et vidéos ne portent pas d'attribut de hauteur – le SDK dimensionne leurs cartes à partir de la largeur et du contenu.

Afficher le texte de la publication avec photos et vidéos (désactivé) – inscrit data-show-text="true" pour Publication et pour Vidéo ajoute (bureau uniquement) dans le libellé pour correspondre à la note de Facebook selon laquelle l'interrupteur de texte n'affecte que le rendu sur ordinateur.

Chargement différé jusqu'au défilement proche (désactivé, tous les onglets) – inscrit data-lazy="true".

Autoriser la lecture en plein écran (désactivé, Vidéo) – inscrit data-allowfullscreen="true".

Lecture automatique au chargement de la page (muet, bureau uniquement) (désactivé, Vidéo) – inscrit data-autoplay="true". Facebook le documente comme lecture automatique muette uniquement sur ordinateur.

Afficher les sous-titres par défaut quand disponibles (bureau uniquement) (désactivé, Vidéo) – inscrit data-show-captions="true", bureau uniquement.

Onglets à afficher (Journal, plugin Page) – trois cases timeline / events / messages jointes comme data-tabs="timeline,events,messages". Les onglets décochés sont simplement absents de la liste.

Utiliser un petit en-tête / Adapter à la largeur du conteneur / Masquer la photo de couverture / Masquer le bouton d'appel à l'action personnalisé / Afficher les photos de profil des amis (plugin Page) – chacun inscrit son booléen data-*. Adapter est activé par défaut ; facepile est activé par défaut.

Inclure la div fb-root et le chargeur sdk.js (activé) – contrôle si le bloc chargeur est ajouté. Les sites qui chargent déjà sdk.js globalement devraient le décocher.

Langue et internationalisation

La FAQ Facebook sur les publications intégrées et le guide d'internationalisation du SDK JavaScript disent la même chose – la langue d'affichage des plugins sociaux provient du segment de locale de l'URL sdk.js. Cet outil le rend visible.

Votre sélection de langue se répercute à deux endroits :

• Le code généré – https://connect.facebook.net/{locale}/sdk.js#xfbml=1&version=v26.0 avec locale comme en_US, zh_TW, fr_FR ou ja_JP.
• L'aperçu en direct – changer le menu déroulant reconstruit l'hôte d'aperçu, supprime tout script SDK précédemment chargé qui porte une locale différente, efface window.FB et charge la nouvelle locale à neuf avant d'appeler FB.XFBML.parse.

La valeur par défaut suit automatiquement votre langue de site Toollect – visiter toollect.com/zh-hant/tools/facebook-embed-generator/ présélectionne zh_TW, zh-hans présélectionne zh_CN, ja présélectionne ja_JP et les langues européennes correspondent à leur forme territoriale (de→de_DE, fr→fr_FR et ainsi de suite), avec repli sur en_US sinon. Il n'y a pas d'option Automatique – Facebook exige une locale explicite, donc l'outil en inscrit toujours une.

Ce qui change et ce qui ne change pas :

Langues d'affichage prises en charge

Facebook documente environ cent locales pour le SDK. Le menu déroulant propose les soixante plus utilisées, avec des noms localisés par langue de page Toollect. L'ensemble complet documenté inclut :

af_ZA Afrikaans · ar_AR Arabe · az_AZ Azéri · bg_BG Bulgare · bn_IN Bengali · bs_BA Bosnien · ca_ES Catalan · cs_CZ Tchèque · da_DK Danois · de_DE Allemand · el_GR Grec · en_GB Anglais (UK) · en_US Anglais (US) · es_ES Espagnol (Espagne) · es_LA Espagnol · et_EE Estonien · eu_ES Basque · fa_IR Persan · fi_FI Finnois · fr_FR Français · gl_ES Galicien · gu_IN Gujarati · he_IL Hébreu · hi_IN Hindi · hr_HR Croate · hu_HU Hongrois · hy_AM Arménien · id_ID Indonésien · is_IS Islandais · it_IT Italien · ja_JP Japonais · jv_ID Javanais · ka_GE Géorgien · km_KH Khmer · kn_IN Kannada · ko_KR Coréen · lo_LA Lao · lt_LT Lituanien · lv_LV Letton · mk_MK Macédonien · ml_IN Malayalam · mr_IN Marathi · ms_MY Malais · my_MM Birman · nb_NO Norvégien · ne_NP Népalais · nl_NL Néerlandais · pa_IN Pendjabi · pl_PL Polonais · pt_BR Portugais (Brésil) · pt_PT Portugais (Portugal) · ro_RO Roumain · ru_RU Russe · si_LK Cinghalais · sk_SK Slovaque · sl_SI Slovène · sq_AL Albanais · sr_RS Serbe · su_ID Soundanais · sv_SE Suédois · sw_KE Swahili · ta_IN Tamoul · te_IN Télougou · th_TH Thaï · tl_PH Philippin · tr_TR Turc · uk_UA Ukrainien · ur_PK Ourdou · vi_VN Vietnamien · zh_CN Chinois (simplifié) · zh_HK Chinois (Hong Kong) · zh_TW Chinois (traditionnel)

Toute locale au-delà de ce menu est valide dans l'URL du chargeur selon le même modèle – https://connect.facebook.net/{locale}/sdk.js – mais les soixante ci-dessus couvrent chaque langue que Toollect lui-même propose, donc coller le code nécessite rarement une édition.

Utilisation

1. Collez une URL Facebook dans le champ – tout format accepté des tableaux ci-dessus, y compris m.facebook.com et les liens courts fb.me qui se résolvent en Page. Schéma et www. sont optionnels.
2. Appuyez sur Générer ou Entrée. Le code apparaît dans la zone de sortie et l'aperçu s'ouvre automatiquement, montrant le rendu réel du SDK. La barre d'URL pilote aussi l'onglet – un lien watch bascule vers Vidéo, un lien de Page vers le plugin Page.
3. Choisissez l'onglet si nécessaire – Publication pour publications, photos et publications de groupe ; Vidéo pour vidéos et reels ; plugin Page pour Pages. Changer régénère avec le jeu d'options de cet onglet, les onglets non correspondants effacent la sortie périmée.
4. Réglez la langue – la valeur par défaut correspond déjà à votre langue de site, mais vous pouvez choisir n'importe laquelle des soixante locales. L'URL du chargeur générée et l'aperçu basculent immédiatement.
5. Ajustez les options restantes – largeur, hauteur pour Page, interrupteurs d'en-tête et de couverture, chargement différé. Chaque modification régénère ; la zone de code et l'aperçu ne divergent jamais.
6. Vérifiez les diagnostics de l'aperçu – si aucune carte n'apparaît, l'avertissement au-dessus de la sortie indique si le SDK a été bloqué, si le contenu ne peut pas s'afficher ou si l'URL pointe vers une timeline personnelle plutôt qu'une Page.
7. Copiez le code et collez-le dans votre page là où l'intégration doit apparaître. Si votre site charge déjà sdk.js, décochez l'inclusion du chargeur pour éviter un doublon.

Une entrée qui ne correspond à aucun format pris en charge efface la sortie et s'explique dans la zone rouge d'erreur – soit le message de lien invalide soit le message de lien court. Effacer réinitialise entrée, code et aperçu en une étape.

Tutoriel

Suivez un lien réel à travers les trois onglets.

Étape 1 – Collez un lien de publication tel que l'app le partage. Copiez une URL de publication avec paramètres de suivi :

https://m.facebook.com/facebook/posts/pfbid0AbCdEfGhIjKlMnOpQrStUvWxYz1234567890?__tn__=K-R

Appuyez sur Générer. L'analyseur lit au-delà du sous-domaine m. et du suivi __tn__ jusqu'à facebook, publication pfbid0AbCdEfGhIjKlMnOpQrStUvWxYz1234567890, l'onglet reste Publication et le code montre data-width="500" avec le chargeur en_US car ce tutoriel est sur le site anglais. L'aperçu s'ouvre et la carte s'affiche à 500 pixels.

Étape 2 – Changez la langue. Basculez la langue de Publication vers Chinois traditionnel zh_TW. Le chargeur devient https://connect.facebook.net/zh_TW/sdk.js#xfbml=1&version=v26.0 et l'aperçu recharge le SDK – l'horodatage près de la publication bascule vers sa forme chinoise tandis que le texte de la publication reste exactement tel que rédigé.

Étape 3 – Rétrécissez. Saisissez 600 dans Largeur et quittez le champ. La div gagne data-width="600" et la carte rétrécit. Essayez de saisir 9999 et de quitter – le champ revient à 750, le maximum de Publication.

Étape 4 – Basculez vers Vidéo. Dans le champ remplacez l'URL de publication par une vidéo :

https://www.facebook.com/facebook/videos/10153231379946729/

Appuyez sur Générer. L'outil bascule vers Vidéo, le code devient <div class="fb-video" data-href="https://www.facebook.com/facebook/videos/10153231379946729" data-width="500"> et le menu déroulant de langue montre la même valeur par défaut en_US. Cochez Lecture automatique et Afficher les sous-titres – chacun inscrit son data-* avec la note bureau uniquement conservée dans le libellé.

Étape 5 – Plugin Page. Collez https://www.facebook.com/facebook et Générez. L'onglet plugin Page s'ouvre avec data-tabs="timeline" et l'ensemble complet d'habillage. Cochez Évènements et Messages – l'attribut devient data-tabs="timeline,events,messages". Changez Largeur à 500 et Hauteur à 700 – les deux attributs se mettent à jour. L'aperçu montre la timeline, la couverture et le facepile de la Page exactement comme le code sur votre site.

Étape 6 – Copiez et publiez. Appuyez sur Copier et collez dans une page HTML simple qui charge déjà sdk.js – décochez le chargeur avant de copier. Ouvrez la page – la publication, la vidéo et la Page s'affichent chacune aux largeurs que vous avez réglées, dans les langues que vous avez choisies.

Aperçu et diagnostics

L'aperçu exécute le véritable sdk.js de Facebook sur votre div exacte issue de buildSdkCode, donc il échoue exactement où votre page échouera. L'hôte montre un indicateur de chargement pendant que sdk.js se télécharge et que FB.XFBML.parse s'exécute, puis l'un des quatre résultats apparaît :

Les deux avertissements temporisés ne se déclenchent qu'après des attentes généreuses – vingt secondes pour le téléchargement du SDK, quinze de plus pour le rendu – de sorte que les connexions lentes ne provoquent pas de fausses alertes. Une publication intégrable s'affiche bien à l'intérieur de ces fenêtres et un plugin Page de profil personnel affiche l'avertissement jaune en environ trois secondes après que l'iframe est restée à taille zéro.

Un détail utile à savoir – le générateur suit loadedLocale. Changer de langue après un rendu réussi supprime la précédente balise script sdk.js, efface window.FB et charge la nouvelle locale à neuf avant l'analyse. Les cartes précédemment rendues de l'ancienne locale sont effacées de l'hôte d'aperçu avant la nouvelle analyse, donc l'aperçu correspond toujours à l'URL du chargeur que vous copierez.

Astuces

• Associez-le à l'Analyseur d'URL Facebook. L'analyseur examine et nettoie un lien – type, nom d'utilisateur, ID, clés de suivi supprimées – tandis que ce générateur transforme le lien propre en code. Archivez avec l'analyseur, publiez avec le générateur.
• Un chargeur, beaucoup d'intégrations. Les pages avec plusieurs intégrations Facebook devraient charger sdk.js une fois – générez la première intégration avec le chargeur coché, les autres décochées, ou chargez le SDK vous-même dans le gabarit du site et omettez-le partout. La div fb-root n'est aussi nécessaire qu'une fois par page.
• Concevez pour la colonne, puis fixez la largeur. Les cartes Facebook plafonnent visuellement autour des largeurs du tableau d'options ; l'aperçu montre le vrai résultat à la taille de votre conteneur avant de vous engager. Saisissez une valeur exacte en pixels – 567 est valide – et la contrainte ne le corrigera que s'il quitte la plage documentée.
• Utilisez le mode Vidéo pour les publications centrées sur le clip. Une vidéo intégrée via le plugin Publication s'affiche comme une carte statique – via fb-video elle s'affiche comme un lecteur avec les contrôles de lecture automatique et de sous-titres que documente le plugin.
• Épinglez la langue explicitement. Laisser l'habillage flotter avec le <html lang> de la page hôte rend la sortie dépendante de l'endroit où elle est collée. Chaque sélection explicite, en_US compris, inscrit la locale dans le code et reproduit les mêmes libellés quel que soit l'hôte.
• Chargement différé sur les pages lourdes. Un article avec trois timelines de plugin Page profite directement de data-lazy – le SDK diffère l'analyse jusqu'à ce que l'intégration soit proche du défilement.
• Gardez les onglets du plugin Page minimaux. Chaque onglet supplémentaire ajoute de la hauteur et du coût réseau – timeline seul est le rendu initial le plus rapide ; ajoutez events et messages uniquement quand la page les utilise vraiment.

Alternatives

Comment d'autre pouvez-vous amener du contenu Facebook sur une page ?

Le configurateur propre de Facebook est l'alternative la plus proche et la source du même vocabulaire data-* – mais il sépare Publication, Vidéo et Page en pages différentes, n'offre pas d'avertissement personnel contre Page et ne produit jamais d'union Publication/Vidéo/Page avec la liste complète de langues de l'outil. La voie API Graph achète le contrôle total au prix d'une app, d'un jeton et d'un examen continu et laisse quand même le rendu à votre charge. Les services tiers interposent leurs propres scripts. Le générateur occupe le juste milieu pratique – balisage officiel, options complètes, confirmation visuelle immédiate.

Face aux API officielles

Deux surfaces officielles touchent l'intégration Facebook et le générateur est construit directement sur la plus accueillante, sans clé.

Le générateur n'appelle aucun point de terminaison Graph. Il construit le balisage Social Plugin par règle, reflétant ce que produirait le configurateur, et s'appuie sur le propre FB.XFBML.parse du SDK pour le rendu. L'API Graph n'intervient pas – récupérer des données de publication via elle exigerait un jeton et laisserait quand même le rendu à votre charge, tandis que le SDK affiche déjà la carte officielle gratuitement.

Générateur vs analyseur d'URL

Toollect livre deux outils Facebook qui acceptent les mêmes liens et la division du travail mérite un coup d'œil :

L'analyseur est l'analyste ; le générateur est le constructeur. Un flux de publication utilise légitimement les deux dans l'ordre – analyser pour identifier et normaliser vers quoi un lien de partage désordonné pointe, puis générer pour le mettre sur la page. Ils concordent grammaticalement par construction, donc un lien que l'analyseur accepte comme publication ou vidéo intégrable est un lien que ce générateur intègre, et un lien que ce générateur refuse est expliqué par l'analyseur.

Ce qu'il ne fait pas

Les limites, nommées pour que l'outil ne soit jamais surestimé :

• Il n'intègre pas les liens courts fb.watch directement. Un lien court ne porte aucune destination tant que Facebook ne redirige pas. Collez plutôt l'URL développée de la publication ou de la vidéo.
• Il ne distingue pas de façon fiable une Page d'un profil personnel par la seule URL. Les deux partagent facebook.com/{username} et profile.php?id=.... Une liste blanche statique bloquerait de vraies Pages ou laisserait passer des profils personnels – les deux arrivent dans la nature – donc l'outil génère le code pour toute URL en forme de Page et affiche un avertissement jaune dans l'aperçu uniquement quand le SDK affiche une iframe nulle ou minuscule ou signale une erreur de rendu.
• Il ne contourne pas la confidentialité ni la restriction. Publications privées, publications de groupe que le spectateur ne peut pas voir, Pages restreintes par âge ou pays et auteurs ayant désactivé l'intégration produisent un code correct qui n'affiche rien ou une vue limitée là où même le configurateur propre de Facebook n'afficherait rien.
• Il ne récupère ni ne vérifie le contenu de la publication avant le rendu. La validation est grammaticale – si le contenu existe et est intégrable seul le SDK l'indique lors de l'analyse de la div.
• Il ne stylise pas la carte. Couleurs, polices et habillage à l'intérieur du plugin rendu appartiennent à Facebook. Seules la présence et la taille – afficher le texte, couverture, facepile, chargement différé et largeur/hauteur numériques – vous appartiennent.
• Il n'installe pas le code. Ce que vous copiez est ce que vous collez ; l'outil ne peut pas atteindre votre CMS ou votre constructeur de pages.

Dépannage

Confidentialité et traitement des données

Cet outil est honnête sur son trafic.

• La génération elle-même est locale. Analyser l'URL, l'associer à un onglet et assembler la div fb-* se produisent dans votre navigateur avec des opérations de chaînes JavaScript. Aucun serveur Toollect ne voit le lien que vous collez.
• L'aperçu charge la machinerie de Facebook. Afficher la carte récupère sdk.js depuis connect.facebook.net dans la locale que vous avez choisie, appelle FB.init et FB.XFBML.parse et l'iframe rendue provient de facebook.com et fbcdn.net – précisément le trafic que le code que vous copiez produira dans les navigateurs de vos lecteurs.
• La sélection de langue est inscrite dans le code. Choisir ja_JP inscrit cette locale dans l'URL du chargeur que vous collez ; les navigateurs de vos visiteurs récupéreront le SDK de cette locale. Aucune préférence n'est stockée par Toollect.
• Aucun compte, aucun stockage, aucune analyse. L'outil ne garde aucun état entre les visites au-delà de l'hôte d'aperçu en mémoire ; fermer l'onglet met fin à tout.
• Publier le code signifie que vos visiteurs parlent à Facebook. C'est la nature de l'intégration de contenu social tiers – cela mérite d'être dit clairement. Si vous avez besoin d'un flux de travail Facebook strictement hors ligne, l'Analyseur d'URL Facebook de ce site effectue tout son travail avec zéro requête réseau.

Caractéristiques techniques

Détails :

• Sortie – div SDK fb-post / fb-video / fb-page avec attributs data-* documentés plus fb-root et sdk.js#xfbml=1&version=v26.0 depuis https://connect.facebook.net/{locale}/sdk.js ; Include the fb-root div and sdk.js loader supprime le bloc chargeur quand désactivé
• Grammaire d'entrée – hôtes facebook.com avec tout sous-domaine, fb.watch, fb.me ; nom d'utilisateur 2–50 caractères [A-Za-z0-9.] ; onglets [a-z][a-z0-9_]* avec seconds segments numériques refusés ; ID 5–20 chiffres ou pfbid[1,200] ; codes courts 5–40 alphanum ; liste réservée 43 entrées ; profile.php?id= et /username tous deux routent vers Page en attendant vérification au rendu
• URL canoniques de sortie – https://www.facebook.com/{username} ou profile.php?id= pour Pages, .../posts/{id} / share/p/{id}/ / story.php?story_fbid=... pour publications, .../videos/{id} ou watch/?v= pour vidéos, .../reels/{id} / reel/{id} pour reels, .../photo/?fbid= pour photos, .../groups/{gid}/posts/{id} pour publications de groupe
• Dimensions – Publication 350–750 par défaut 500, Vidéo 220–1920 par défaut 500, Page largeur 180–500 par défaut 340 plus hauteur 70–2048 par défaut 500 ; data-width/data-height inscrits directement, pas de dimensionnement iframe
• Langues – toute des 60 fbeLangCodes sélectionnable ; fbeLangDefault suit la langue de page Toollect – zh-hant→zh_TW, zh-hans→zh_CN, en→en_US, de→de_DE, es→es_ES, fr→fr_FR, it→it_IT, ja→ja_JP, nl→nl_NL, pt→pt_BR, sv→sv_SE ; locale inscrite dans URL du chargeur et honorée par rechargement SDK d'aperçu via suivi loadedLocale
• Cycle de vie de l'aperçu – renderPreview injecte fb-root + div fb-*, loadSdkJs(locale, cb) gère sdk.js en cache avec rechargement sensible à la locale (supprime ancien script et window.FB au changement), FB.XFBML.parse invoqué sur l'hôte, startWatcher sonde l'iframe toutes les 500 ms jusqu'à 30 essais (15 s) et jusqu'à 6 essais de 0×0 persistant (~3 s) avant l'avertissement de profil personnel, setPreviewLoading unifié sur quatre points de sortie, lien fbe-fallback pointe vers lastCanonical sur tout diagnostic
• Prise en charge des navigateurs – tous les navigateurs modernes avec API presse-papiers et prise en charge de script async/defer ; le rendu SDK exige exécution de script tiers et joignabilité de connect.facebook.net

Fonctionnalités

• Générez le code officiel du SDK JavaScript Facebook pour publications, vidéos et plugins Page en un clic
• Aperçu en direct rendu par le propre sdk.js de Facebook avant de copier – avec diagnostic d'échec et de délai du SDK
• Choisissez parmi 60 langues d'affichage – votre sélection est inscrite dans l'URL du chargeur sdk.js pour vos visiteurs
• Ajustez chaque option officielle du plugin – largeur, onglets de Page, couverture, en-tête, facepile et chargement différé
• Sortie SDK uniquement qui fonctionne sur tout site – fb-root et chargeur optionnels inclus ou omis à la demande
• Gratuit et dans le navigateur – sans clé API, sans compte, sans proxy serveur Toollect

Questions fréquentes