Antes de empezar
Genera el código de tu widget en el back office de bsport: Settings → Widgets, elige el tipo de widget, configura tus opciones y, a continuación, desplázate hacia abajo y copia el código. Cada vez que cambias una configuración se genera un código nuevo, y tienes que pegar la nueva versión en tu sitio para que el cambio surta efecto.
Método 1 — Elemento Embed (recomendado)
Abre la página en el Webflow Designer
Haz clic en el panel Add (+) y busca Embed dentro de Components
Arrástralo a la página en el lugar donde quieras que aparezca el widget
Pega el código de tu widget en el editor de código y haz clic en Save & Close
Haz clic en Publish
⚠️ El widget no se mostrará en el Designer. Webflow muestra ahí un marcador de posición gris en su lugar. Esto es normal: publica el sitio o usa el icono de vista previa (el ojo) para ver el widget real.
Hay dos cosas que conviene configurar en el propio elemento Embed:
Asigna a su contenedor principal un ancho del 100% para que el widget tenga espacio para ser responsivo
Deja la altura en auto en lugar de fijarla, para que el widget pueda expandirse según su contenido
Método 2 — Código personalizado de página o de sitio
Usa este método cuando el mismo widget deba aparecer en todas las páginas, o cuando necesites que el script se cargue antes de que se renderice la página.
Una página: Page Settings (el icono de engranaje junto al nombre de la página) → Custom Code → Before </body> tag
Todo el sitio: Project Settings → Custom Code → Footer Code
El código a nivel de sitio se aplica a todas las páginas publicadas, así que es preferible usar la opción a nivel de página salvo que realmente lo necesites en todas partes.
Solución de problemas
El widget se muestra en el sitio publicado pero no en el Designer.
Es el comportamiento esperado. Webflow nunca ejecuta los scripts insertados en el lienzo del Designer.
Los cambios hechos en el back office no se reflejan.
La configuración no se actualiza automáticamente en tu sitio. Copia el código recién generado y sustituye por completo el anterior, luego vuelve a publicar.
El widget se ve diferente a la vista previa del back office.
Es posible que la hoja de estilos de tu sitio lo esté afectando. Activa el modo de compatibilidad en la configuración de tu widget y luego copia y pega el código nuevo.
El editor de código no acepta el código.
El elemento Embed de Webflow tiene un límite de 50 000 caracteres. El código del widget de bsport está muy por debajo de este límite, así que si lo alcanzas, comprueba que no se haya pegado algo más junto a él.
El widget se ve cortado o apretado.
Revisa el ancho del contenedor principal y cualquier max-width que tenga configurado, y comprueba los puntos de ruptura (breakpoints) para móvil por separado en el Designer.
No aparece nada en absoluto.
Confirma que el sitio se haya publicado desde que añadiste el código; los cambios en Webflow no están activos hasta que publicas.
¿Sigues atascado? Contacta con nuestro equipo de soporte indicando la URL de la página y una captura de pantalla, y lo revisaremos.