Ir al contenido principal

Cómo personalizar un widget de bsport con CSS

Esta guía te muestra cómo añadir CSS personalizado a nuestros widgets desde el backoffice.

BrandedApp avatar
Escrito por BrandedApp
Actualizado ayer

⚠️ Después de activar reCAPTCHA en el widget de Lead Acquisition, puede que tengas que ajustar un poco el CSS para que se vea como quieres.

El reCAPTCHA puede verse diferente según:

  • El widget de newsletter actual

  • Cómo está integrado el widget en el CMS del cliente

  • Estilos que ya tenga aplicados el CMS

👩🏻‍💻 Si necesitas ayuda con la personalización o con el diseño, contacta a tu Account Manager.

1. Ve a Configuración > Widgets

Clic aquí para ir a la página de widgets

2. Selecciona la pestaña CSS

Elige la pestaña con las clases del widget que quieres modificar. Puedes añadir reglas CSS en cualquier pestaña, que sirve solo de guía para facilitar la personalización. Revisa siempre la vista previa del widget.

⚠️ No pongas !important en cada regla.
Por qué:

  • Inyección automática: Nuestro sistema añade !important automáticamente.

  • Posibles conflictos: Si el cliente también lo añade, puede duplicarse y romper el estilo.

3. Guarda los cambios

Una vez que hayas terminado de añadir tus reglas CSS personalizadas, no olvides guardar los cambios.

4. ¡Listo!

Los widgets bsport ahora se mostrarán con tu CSS personalizado.

⚠️ Si la vista previa no coincide con el sitio, activa el Modo Compatibilidad.

¿Ha quedado contestada tu pregunta?