Generador de inserción de Facebook

Introducción

El Generador de inserción de Facebook de Toollect convierte cualquier URL pública de publicación, vídeo o página de Facebook en el código oficial de inserción del SDK de JavaScript que documenta Facebook – el div fb-post / fb-video / fb-page más el cargador sdk.js – con un clic, con una vista previa en vivo renderizada por el propio SDK de Facebook antes de copiar.

La fricción que elimina te resulta familiar si alguna vez has pegado código de Facebook a mano. El configurador de Facebook oculta el plugin de página, reparte las opciones de publicación y vídeo en páginas separadas y alterna entre las formas de iframe y SDK sin explicar las ventajas de cada una. Escribir el div a mano falla en silencio cuando un atributo data- está mal escrito y la publicación se renderiza como un simple enlace. Esta herramienta presenta publicación, vídeo y plugin de página lado a lado, expone cada atributo documentado del plugin, escribe tu elección de idioma directamente en la URL del cargador y muestra el render real en el mismo navegador que servirá a tus visitantes.

Cada vía de código es solo SDK por diseño. El SDK es el formato que Facebook mantiene para los tres tipos de plugin, el único que admite idiomas de visualización y el único que puede mantener coherentes las pestañas y el tamaño del plugin de página. El generador incluye fb-root y el cargador cuando los necesitas y los omite cuando tu sitio ya carga el SDK, mantiene la vista previa honesta sobre bloqueadores de anuncios y contenido privado y nunca envía tu enlace a través de un servidor de Toollect.

Casos de uso

Insertar contenido de Facebook aparece en más lugares que en una entrada de blog, y las tres pestañas reparten el trabajo de forma natural.

Blogs y contenido editorial

Una publicación de comentario que cita una publicación pública, un artículo cultural que reutiliza un vídeo viral, una reseña que inserta la cronología de una marca como prueba social – los casos clásicos. El modo Publicación con el ancho por defecto de 500 píxeles cubre la mayoría de columnas; el modo Vídeo mantiene el reproductor en primer plano; el plugin de página muestra una cronología en vivo sin capturas.

Redacciones y cobertura en directo

Los reporteros incorporan declaraciones oficiales y publicaciones de testigos en la cobertura continua. La velocidad importa y también la verificación – el generador normaliza enlaces móviles para compartir como m.facebook.com y URLs cargadas de seguimiento a una referencia canónica, y la vista previa confirma que la publicación aún se renderiza antes de publicar la historia.

Sitios de marketing y portafolios

Reseñas de clientes como cronologías de página insertadas, vídeos de lanzamiento como reproductores en la página, publicaciones de anuncio como tarjetas. La selección de idioma renderiza el chrome circundante en el idioma del visitante y omitir el cargador del SDK mantiene las páginas que ya cargan el SDK de Facebook libres de scripts duplicados.

Documentación y sitios de comunidad

Notas de versión que citan una publicación de lanzamiento, documentación que referencia un anuncio de grupo de Facebook, páginas de evento que muestran la pestaña Eventos de una página. Mostrar texto y Carga diferida permiten que las páginas pesadas permanezcan tranquilas hasta que se hace scroll cerca.

Cómo funciona

La herramienta funciona en cinco pasos:

1. Analiza y clasifica la URL – la entrada se compara con la gramática de enlaces de Facebook: IDs numéricos de 5–20 dígitos o IDs pfbid, nombres de usuario de 2–50 caracteres, pestañas que coinciden con [a-z][a-z0-9_]* y los tres hosts oficiales facebook.com con cualquier subdominio, fb.watch y fb.me. Las claves de consulta de seguimiento se leen y se ignoran para el enrutamiento – la URL canónica reconstruida nunca las lleva. Las rutas sin ID como facebook.com/watch sin v o fb.watch sin código corto se rechazan.
2. Elige el tipo de plugin – post / photo / group-post van a Publicación, video / reel a Vídeo, page al plugin de página. La barra de pestañas sigue al enlace – pegar una URL de watch cambia automáticamente a Vídeo, pegar una URL de página al plugin de página – y cambiar de pestaña manualmente limpia la salida obsoleta en lugar de rebotar.
3. Recoge tus opciones – Idioma del desplegable de la pestaña, ancho y alto de los campos numéricos, casillas de página para pestañas y chrome, interruptores de vídeo para pantalla completa, reproducción automática y subtítulos. Cada cambio se ajusta al rango válido, se escribe de vuelta en el campo y se regenera de inmediato.
4. Construye el marcado oficial – tus opciones se convierten en atributos data-* en el div fb-* y, para el plugin de página, la URL del cargador lleva tu idioma como https://connect.facebook.net/{locale}/sdk.js#xfbml=1&version=v26.0. No se construye ninguna URL de iframe – el SDK consume los atributos del div al analizar.
5. Renderiza la vista previa – el generador inyecta el div más un fb-root en el host de vista previa, carga o recarga sdk.js para la configuración regional elegida, llama a FB.XFBML.parse y observa el iframe resultante. Se informan honestamente tres resultados – éxito, bloqueador de anuncios o render que no puede completarse.

Cambiar cualquier opción reconstruye toda la cadena – nuevos atributos, cuadro de código nuevo, vista previa reanalizada – así que el código que copias siempre coincide con lo que estás viendo.

Formatos de URL compatibles

El generador acepta toda forma de URL que identifique una publicación, vídeo o página públicos en los tres hosts oficiales de Facebook y rechaza todo lo demás con un mensaje específico. El esquema y www. son opcionales; los subdominios móviles se normalizan.

Formatos aceptados

La barra final, el fragmento hash y la cadena de consulta tras el ID se toleran y se descartan; los sufijos de vista como un segmento numérico de pestaña tras un nombre de usuario se tratan como vista de pestaña de página, no como recurso separado.

Formatos rechazados

El caso de fb.watch merece énfasis porque el botón para compartir de la app aún produce esa forma. El generador la rechaza deliberadamente con el mensaje dedicado de enlace corto y te pide abrir el enlace y copiar la URL completa de la publicación o el vídeo. Pegar la URL expandida tiene éxito de inmediato.

Anatomía del código de inserción

La salida es el código que documenta Facebook, con tus opciones aplicadas. Una inserción de publicación con los valores por defecto se ve así:

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

Recorriendo las partes:

• La clase del div del plugin – fb-post, fb-video o fb-page le dice al SDK qué plugin instanciar. Una clase por inserción.
• data-href – la URL canónica de la sección anterior, con ampersands escapados. Es el único atributo obligatorio para los tres plugins.
• data-width (Publicación y Vídeo) – el ancho deseado en píxeles. Publicación acepta 350–750 por defecto 500 en esta herramienta, Vídeo 220–1920 por defecto 500. El SDK de Facebook dimensiona la tarjeta a este ancho cuando es posible.
• data-show-text – presente cuando Mostrar texto de publicación está marcado. Facebook lo documenta para publicaciones y vídeos que contienen una foto; sin él el texto puede quedar oculto.
• data-lazy – presente cuando Carga diferida está marcado. Retrasa el render hasta que la inserción se acerca al scroll.
• data-allowfullscreen / data-autoplay / data-show-captions (solo Vídeo) – allowfullscreen habilita el botón de pantalla completa, autoplay inicia reproducción silenciada al cargar la página en escritorio, show-captions muestra subtítulos por defecto cuando están disponibles en escritorio. Los tres están ausentes cuando están desactivados.
• data-tabs / data-height / data-small-header / data-adapt-container-width / data-hide-cover / data-hide-cta / data-show-facepile (solo plugin de página) – tabs lista las pestañas visibles como timeline,events,messages por defecto timeline, height por defecto 500, los booleanos mapean directamente a los interruptores de chrome del plugin.
• El cargador – fb-root más sdk.js#xfbml=1&version=v26.0 desde connect.facebook.net/{locale}/. en_US es un ejemplo – tu elección de idioma escribe el segmento de configuración regional. La casilla Include the fb-root div and sdk.js loader elimina todo este bloque cuando tu sitio ya carga el SDK.

Un plugin de página con ajustes no predeterminados muestra el conjunto más completo de atributos:

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

Opciones de inserción

Cada control corresponde a un atributo. Valores por defecto entre paréntesis.

Idioma (por defecto tu idioma del sitio de Toollect – zh-hant se convierte en zh_TW, zh-hans en zh_CN, en en en_US y lo mismo para de, es, fr, it, ja, nl, pt, sv) – muestra 60 configuraciones regionales desde en_US hasta af_ZA con nombres localizados por idioma de página de Toollect. Cada selección explícita, incluido inglés, se escribe en la URL del cargador. El SDK localiza el entorno de la inserción – marcas de tiempo, etiquetas del botón Me gusta – nunca el texto de la publicación.

Ancho (Publicación 500, Vídeo 500, Página 340) – tecleado como número exacto, ajustado al rango válido en cuanto abandonas el campo. Publicación 350–750, Vídeo 220–1920, Página 180–500. Los valores fuera de rango saltan al límite más cercano – 5000 en Vídeo se convierte en 1920.

Alto (Página 500) – solo plugin de página, 70–2048. Las publicaciones y los vídeos no llevan atributo de alto – el SDK dimensiona sus tarjetas a partir del ancho y el contenido.

Mostrar texto de publicación con fotos y vídeos (desactivado) – escribe data-show-text="true" para Publicación y para Vídeo añade (solo escritorio) en la etiqueta para coincidir con la nota de Facebook de que el interruptor de texto solo afecta al render en escritorio.

Carga diferida hasta acercar scroll (desactivado, todas las pestañas) – escribe data-lazy="true".

Permitir reproducción a pantalla completa (desactivado, Vídeo) – escribe data-allowfullscreen="true".

Reproducir automáticamente al cargar la página (silenciado, solo escritorio) (desactivado, Vídeo) – escribe data-autoplay="true". Facebook lo documenta como reproducción automática silenciada solo en escritorio.

Mostrar subtítulos por defecto cuando estén disponibles (solo escritorio) (desactivado, Vídeo) – escribe data-show-captions="true", solo escritorio.

Pestañas que mostrar (Cronología, plugin de página) – tres casillas timeline / events / messages unidas como data-tabs="timeline,events,messages". Las pestañas desmarcadas simplemente no aparecen en la lista.

Usar cabecera pequeña / Adaptar al ancho del contenedor / Ocultar foto de portada / Ocultar llamada a la acción personalizada / Mostrar fotos de perfil de amigos (plugin de página) – cada uno escribe su booleano data-*. Adaptar está activado por defecto; facepile está activado por defecto.

Incluir el div fb-root y el cargador sdk.js (activado) – controla si se añade el bloque del cargador. Los sitios que ya cargan sdk.js globalmente deberían desmarcarlo.

Idioma e internacionalización

Las preguntas frecuentes de publicaciones insertadas de Facebook y la guía de internacionalización del SDK de JavaScript dicen lo mismo – el idioma de visualización de los plugins sociales proviene del segmento de configuración regional de la URL sdk.js. Esta herramienta lo hace visible.

Tu selección de idioma fluye a dos lugares:

• El código generado – https://connect.facebook.net/{locale}/sdk.js#xfbml=1&version=v26.0 con locale como en_US, zh_TW, fr_FR o ja_JP.
• La vista previa en vivo – cambiar el desplegable reconstruye el host de vista previa, elimina cualquier script SDK cargado previamente que lleve una configuración regional distinta, borra window.FB y carga la nueva configuración regional desde cero antes de llamar a FB.XFBML.parse.

El valor por defecto sigue automáticamente tu idioma del sitio de Toollect – visitar toollect.com/zh-hant/tools/facebook-embed-generator/ preselecciona zh_TW, zh-hans preselecciona zh_CN, ja preselecciona ja_JP y los idiomas europeos mapean a su forma territorial (de→de_DE, fr→fr_FR y así), recayendo en en_US en caso contrario. No hay opción Automático – Facebook exige una configuración regional explícita, así que la herramienta siempre escribe una.

Qué cambia y qué no:

Idiomas de visualización compatibles

Facebook documenta cerca de cien configuraciones regionales para el SDK. El desplegable ofrece las sesenta más usadas, con nombres localizados por idioma de página de Toollect. El conjunto completo documentado incluye:

af_ZA Afrikaans · ar_AR Árabe · az_AZ Azerbaiyano · bg_BG Búlgaro · bn_IN Bengalí · bs_BA Bosnio · ca_ES Catalán · cs_CZ Checo · da_DK Danés · de_DE Alemán · el_GR Griego · en_GB Inglés (UK) · en_US Inglés (US) · es_ES Español (España) · es_LA Español · et_EE Estonio · eu_ES Vasco · fa_IR Persa · fi_FI Finés · fr_FR Francés · gl_ES Gallego · gu_IN Gujarati · he_IL Hebreo · hi_IN Hindi · hr_HR Croata · hu_HU Húngaro · hy_AM Armenio · id_ID Indonesio · is_IS Islandés · it_IT Italiano · ja_JP Japonés · jv_ID Javanés · ka_GE Georgiano · km_KH Jemer · kn_IN Canarés · ko_KR Coreano · lo_LA Lao · lt_LT Lituano · lv_LV Letón · mk_MK Macedonio · ml_IN Malayalam · mr_IN Maratí · ms_MY Malayo · my_MM Birmano · nb_NO Noruego · ne_NP Nepalí · nl_NL Neerlandés · pa_IN Punyabí · pl_PL Polaco · pt_BR Portugués (Brasil) · pt_PT Portugués (Portugal) · ro_RO Rumano · ru_RU Ruso · si_LK Cingalés · sk_SK Eslovaco · sl_SI Esloveno · sq_AL Albanés · sr_RS Serbio · su_ID Sundanés · sv_SE Sueco · sw_KE Suajili · ta_IN Tamil · te_IN Telugu · th_TH Tailandés · tl_PH Filipino · tr_TR Turco · uk_UA Ucraniano · ur_PK Urdu · vi_VN Vietnamita · zh_CN Chino (simplificado) · zh_HK Chino (Hong Kong) · zh_TW Chino (tradicional)

Cualquier configuración regional más allá de este desplegable es válida en la URL del cargador con el mismo patrón – https://connect.facebook.net/{locale}/sdk.js – pero las sesenta anteriores cubren cada idioma que Toollect ofrece, así que raramente necesitarás editar el código tras pegarlo.

Uso

1. Pega una URL de Facebook en la entrada – cualquier formato aceptado de las tablas anteriores, incluidos m.facebook.com y enlaces cortos fb.me que resuelven a una página. Esquema y www. son opcionales.
2. Pulsa Generar o Intro. El código aparece en el cuadro de salida y la vista previa se abre automáticamente mostrando el render real del SDK. La barra de URL también dirige la pestaña – un enlace watch cambia a Vídeo, un enlace de página al plugin de página.
3. Elige la pestaña si es necesario – Publicación para publicaciones, fotos y publicaciones de grupo; Vídeo para vídeos y reels; plugin de página para páginas. Cambiar regenera con el conjunto de opciones de esa pestaña, las pestañas no coincidentes limpian la salida obsoleta.
4. Configura el idioma – el valor por defecto ya coincide con tu idioma del sitio, pero puedes elegir cualquiera de las sesenta configuraciones regionales. La URL del cargador generada y la vista previa cambian de inmediato.
5. Ajusta las opciones restantes – ancho, alto para página, interruptores de cabecera y portada, carga diferida. Cada cambio regenera; el cuadro de código y la vista previa nunca se desincronizan.
6. Revisa los diagnósticos de la vista previa – si no aparece ninguna tarjeta, la advertencia sobre la salida dice si el SDK fue bloqueado, el contenido no puede renderizarse o la URL apunta a una cronología personal en lugar de una página.
7. Copia el código y pégalo en tu página donde deba aparecer la inserción. Si tu sitio ya carga sdk.js, desmarca la inclusión del cargador para evitar duplicados.

La entrada que no coincide con ningún formato compatible limpia la salida y se explica en el área roja de error – ya sea el mensaje de enlace no válido o el mensaje de enlace corto. Borrar restablece entrada, código y vista previa en un paso.

Tutorial

Sigue un enlace real por las tres pestañas.

Paso 1 – Pega un enlace de publicación tal como lo comparte la app. Copia una URL de publicación con parámetros de seguimiento:

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

Pulsa Generar. El analizador lee más allá del subdominio m. y el seguimiento __tn__ hasta facebook, publicación pfbid0AbCdEfGhIjKlMnOpQrStUvWxYz1234567890, la pestaña permanece en Publicación y el código muestra data-width="500" con el cargador en_US porque este tutorial está en el sitio en inglés. La vista previa se abre y la tarjeta se renderiza a 500 píxeles.

Paso 2 – Cambia el idioma. Cambia el idioma de publicación a chino tradicional zh_TW. El cargador se convierte en https://connect.facebook.net/zh_TW/sdk.js#xfbml=1&version=v26.0 y la vista previa recarga el SDK – la marca de tiempo junto a la publicación cambia a su forma china mientras el texto de la publicación permanece exactamente como se escribió.

Paso 3 – Estrecha. Escribe 600 en Ancho y abandona el campo. El div gana data-width="600" y la tarjeta se encoge. Prueba a escribir 9999 y salir – el campo salta a 750, el máximo de Publicación.

Paso 4 – Cambia a Vídeo. En la entrada sustituye la URL de publicación por un vídeo:

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

Pulsa Generar. La herramienta cambia a Vídeo, el código se convierte en <div class="fb-video" data-href="https://www.facebook.com/facebook/videos/10153231379946729" data-width="500"> y el desplegable de idioma muestra el mismo valor por defecto en_US. Marca Reproducción automática y Mostrar subtítulos – cada uno escribe su data-* con la nota solo escritorio conservada en la etiqueta.

Paso 5 – Plugin de página. Pega https://www.facebook.com/facebook y pulsa Generar. La pestaña de plugin de página se abre con data-tabs="timeline" y el conjunto completo de chrome. Marca Eventos y Mensajes – el atributo se convierte en data-tabs="timeline,events,messages". Cambia Ancho a 500 y Alto a 700 – ambos atributos se actualizan. La vista previa muestra la cronología, la portada y el facepile de la página exactamente como el código en tu sitio.

Paso 6 – Copia y publica. Pulsa Copiar y pega en una página HTML simple que ya carga sdk.js – desmarca el cargador antes de copiar. Abre la página – la publicación, el vídeo y la página se renderizan cada uno en los anchos que configuraste, en los idiomas que elegiste.

Vista previa y diagnóstico

La vista previa ejecuta el sdk.js auténtico de Facebook contra tu div exacto de buildSdkCode, así que falla exactamente donde fallará tu página. El host muestra un spinner mientras se descarga sdk.js y se ejecuta FB.XFBML.parse, luego aparece uno de cuatro resultados:

Ambas advertencias temporizadas se disparan solo tras esperas generosas – veinte segundos para la descarga del SDK, quince más para el render – así que las conexiones lentas no provocan falsas alarmas. Una publicación insertable se renderiza con holgura dentro de esas ventanas y un plugin de página de perfil personal muestra la advertencia amarilla en unos tres segundos después de que el iframe permanezca en tamaño cero.

Un detalle que vale la pena saber: el generador rastrea loadedLocale. Cambiar el idioma tras un render exitoso elimina la etiqueta script sdk.js previa, limpia window.FB y carga la nueva configuración regional desde cero antes de analizar. Las tarjetas renderizadas previamente de la configuración regional anterior se eliminan del host de vista previa antes del nuevo análisis, así que la vista previa siempre coincide con la URL del cargador que copiarás.

Consejos profesionales

• Combínalo con el Analizador de URLs de Facebook. El analizador examina y limpia un enlace – tipo, nombre de usuario, ID, claves de seguimiento eliminadas – mientras este generador convierte el enlace limpio en código. Archiva con el analizador, publica con el generador.
• Un cargador, muchas inserciones. Las páginas con varias inserciones de Facebook deberían cargar sdk.js una vez – genera la primera inserción con el cargador marcado, el resto desmarcado, o carga el SDK tú mismo en la plantilla del sitio y omítelo en todas partes. El div fb-root también se necesita solo una vez por página.
• Diseña para la columna, luego fija el ancho. Las tarjetas de Facebook se limitan visualmente alrededor de los anchos de la tabla de opciones; la vista previa muestra el resultado real al tamaño de tu contenedor antes de comprometerte. Escribe un valor exacto en píxeles – 567 es válido – y el ajuste solo lo corregirá si sale del rango documentado.
• Usa el modo Vídeo para publicaciones centradas en clip. Un vídeo insertado vía el plugin de publicación se renderiza como tarjeta estática – vía fb-video se renderiza como reproductor con los controles de reproducción automática y subtítulos que documenta el plugin.
• Fija el idioma explícitamente. Dejar el chrome a merced del <html lang> de la página anfitriona hace que la salida dependa de dónde se pegue. Cada selección explícita, en_US incluido, escribe la configuración regional en el código y reproduce las mismas etiquetas sin importar el host.
• Carga diferida en páginas pesadas. Un artículo con tres cronologías de plugin de página se beneficia directamente de data-lazy – el SDK retrasa el análisis hasta que la inserción se acerca al scroll.
• Mantén mínimas las pestañas del plugin de página. Cada pestaña extra añade altura y coste de red – solo timeline es el render inicial más rápido; añade events y messages solo cuando la página realmente los use.

Alternativas

¿De qué otras formas puedes llevar contenido de Facebook a una página?

El configurador propio de Facebook es la alternativa más cercana y la fuente del mismo vocabulario data-* – pero separa publicación, vídeo y página en páginas distintas, no ofrece advertencia personal frente a página y nunca produce una unión publicación/vídeo/página con la lista completa de idiomas de la herramienta. La vía de API Graph compra control total al precio de una app, un token y revisión continua y aun así te deja el renderizado. Los servicios de terceros interponen sus propios scripts. El generador ocupa el punto medio práctico – marcado oficial, opciones completas, confirmación visual inmediata.

Frente a las APIs oficiales

Dos superficies oficiales tocan la inserción de Facebook y el generador está construido directamente sobre la más amable y sin clave.

El generador no llama a ningún endpoint de Graph. Construye el marcado de Social Plugin por regla, reflejando lo que emitiría el configurador, y se apoya en el propio FB.XFBML.parse del SDK para el renderizado. La API Graph no interviene – obtener datos de publicación a través de ella requeriría un token y aun así te dejaría el renderizado, mientras que el SDK ya renderiza la tarjeta oficial gratis.

Generador vs. Analizador de URL

Toollect ofrece dos herramientas de Facebook que aceptan los mismos enlaces y la división del trabajo merece una mirada:

El analizador es el analista; el generador es el constructor. Un flujo de publicación usa legítimamente ambos en orden – analizar para identificar y normalizar a qué apunta un enlace desordenado para compartir, luego generar para ponerlo en la página. Coinciden en gramática por construcción, así que un enlace que el analizador acepta como publicación o vídeo insertable es un enlace que este generador inserta y un enlace que este generador rechaza lo explica el analizador.

Qué no hace

Los límites, nombrados para que nunca se confíe demasiado en la herramienta:

• No inserta enlaces cortos fb.watch directamente. Un enlace corto no lleva destino hasta que Facebook redirige. Pega en su lugar la URL expandida de publicación o vídeo.
• No distingue de forma fiable una página de un perfil personal solo por la URL. Ambos comparten facebook.com/{username} y profile.php?id=.... Una lista blanca estática bloquearía páginas reales o dejaría pasar perfiles personales – ambos casos ocurren – así que la herramienta genera el código para cualquier URL con forma de página y muestra una advertencia amarilla en la vista previa solo cuando el SDK renderiza un iframe nulo o diminuto o informa de un error de render.
• No anula la privacidad o la restricción. Publicaciones privadas, publicaciones de grupo que el visor no puede ver, páginas con restricción de edad o país y autores que desactivaron la inserción producen código correcto que no renderiza nada o una vista limitada donde incluso el configurador propio de Facebook no mostraría nada.
• No obtiene ni verifica el contenido de la publicación antes del renderizado. La validación es gramatical – si el contenido existe y es insertable solo lo responde el SDK al analizar el div.
• No estiliza la tarjeta. Colores, fuentes y chrome dentro del plugin renderizado son de Facebook. Solo la presencia y el tamaño – mostrar texto, portada, facepile, carga diferida y el ancho/alto numéricos – son tuyos.
• No instala el código. Lo que copias es lo que pegas; la herramienta no puede llegar a tu CMS o constructor de páginas.

Solución de problemas

Privacidad y tratamiento de datos

Esta herramienta es honesta sobre su tráfico.

• La generación en sí es local. Analizar la URL, mapearla a una pestaña y ensamblar el div fb-* ocurre en tu navegador con operaciones de cadena de JavaScript. Ningún servidor de Toollect ve el enlace que pegas.
• La vista previa carga la maquinaria de Facebook. Renderizar la tarjeta obtiene sdk.js desde connect.facebook.net en la configuración regional que elegiste, llama a FB.init y FB.XFBML.parse y el iframe renderizado viene de facebook.com y fbcdn.net – precisamente el tráfico que el código que copias producirá en los navegadores de tus lectores.
• La selección de idioma está integrada en el código. Elegir ja_JP escribe esa configuración regional en la URL del cargador que pegas; los navegadores de tus visitantes obtendrán el SDK de esa configuración regional. Toollect no almacena ninguna preferencia.
• Sin cuenta, sin almacenamiento, sin analítica. La herramienta no mantiene estado entre visitas más allá del host de vista previa en memoria; cerrar la pestaña termina todo.
• Publicar el código significa que tus visitantes hablan con Facebook. Esa es la naturaleza de insertar contenido social de terceros – vale la pena decirlo claramente. Si necesitas un flujo de trabajo de Facebook estrictamente sin conexión, el Analizador de URLs de Facebook de este sitio realiza todo su trabajo con cero peticiones de red.

Especificaciones técnicas

Detalles:

• Salida: div SDK fb-post / fb-video / fb-page con atributos data-* documentados más fb-root y sdk.js#xfbml=1&version=v26.0 desde https://connect.facebook.net/{locale}/sdk.js; Include the fb-root div and sdk.js loader elimina el bloque del cargador cuando está desactivado
• Gramática de entrada: hosts facebook.com con cualquier subdominio, fb.watch, fb.me; nombre de usuario 2–50 caracteres [A-Za-z0-9.]; pestañas [a-z][a-z0-9_]* con segundos segmentos numéricos rechazados; IDs 5–20 dígitos o pfbid[1,200]; códigos cortos 5–40 alfanum; lista reservada 43 entradas; profile.php?id= y /username ambos enrutan a página pendiente de verificación en tiempo de render
• URLs canónicas de salida: https://www.facebook.com/{username} o profile.php?id= para páginas, .../posts/{id} / share/p/{id}/ / story.php?story_fbid=... para publicaciones, .../videos/{id} o watch/?v= para vídeos, .../reels/{id} / reel/{id} para reels, .../photo/?fbid= para fotos, .../groups/{gid}/posts/{id} para publicaciones de grupo
• Dimensiones: Publicación 350–750 por defecto 500, Vídeo 220–1920 por defecto 500, Página ancho 180–500 por defecto 340 más alto 70–2048 por defecto 500; data-width/data-height escritos directamente, sin dimensionado de iframe
• Idiomas: cualquiera de los 60 fbeLangCodes seleccionables; fbeLangDefault sigue el idioma de página de 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; configuración regional escrita en URL del cargador y respetada por recarga SDK de vista previa vía seguimiento loadedLocale
• Ciclo de vida de vista previa: renderPreview inyecta fb-root + div fb-*, loadSdkJs(locale, cb) gestiona sdk.js cacheado con recarga sensible a configuración regional (elimina script antiguo y window.FB al cambiar), FB.XFBML.parse invocado en el host, startWatcher sondea el iframe cada 500 ms hasta 30 intentos (15 s) y hasta 6 intentos de 0×0 persistente (~3 s) antes de la advertencia de perfil personal, setPreviewLoading unificado en cuatro puntos de salida, enlace fbe-fallback apunta a lastCanonical en cualquier diagnóstico
• Soporte de navegadores: todos los navegadores modernos con API de portapapeles y soporte de script async/defer; el render del SDK requiere ejecución de script de terceros y alcanzabilidad de connect.facebook.net

Características

• Genera el código oficial del SDK de JavaScript de Facebook para publicaciones, vídeos y plugins de página con un clic
• Vista previa en vivo renderizada por el propio sdk.js de Facebook antes de copiar – con diagnóstico de fallo y tiempo de espera del SDK
• Elige entre 60 idiomas de visualización – tu selección se escribe en la URL del cargador sdk.js para tus visitantes
• Ajusta cada opción oficial del plugin – ancho, pestañas de página, portada, cabecera, facepile y carga diferida
• Salida solo SDK que funciona en cualquier sitio – fb-root y cargador opcionales incluidos u omitidos según necesites
• Gratis y en el navegador – sin clave API, sin cuenta, sin proxy de servidor de Toollect

Preguntas frecuentes