VideoTextSection - Componente de Demostración

Video a la Izquierda

Ejemplo con video posicionado a la izquierda

Este es un ejemplo del componente VideoTextSection con el video alineado a la izquierda.

El componente VideoTextSection es perfecto para mostrar videos de YouTube junto con contenido descriptivo. Puedes usar HTML en el contenido para dar formato al texto.

Este componente mantiene la misma apariencia y funcionalidad que ImageTextSection pero está optimizado para videos de YouTube.

Este es un ejemplo de demostración.

Video a la Derecha

Ejemplo con fondo claro y video a la derecha

Este ejemplo muestra el video alineado a la derecha con un fondo claro.

Puedes personalizar el fondo del componente usando las diferentes opciones disponibles: default, light, dark o gradient.

El componente extrae automáticamente el ID del video de YouTube desde cualquier URL válida.

Fondo Oscuro

Ejemplo con fondo oscuro y video centrado

Este ejemplo usa un fondo oscuro para crear contraste.

El componente soporta diferentes variantes de botones y fondos para adaptarse a cualquier diseño.

También puedes proporcionar directamente el ID del video de YouTube en lugar de la URL completa.

Video con fines demostrativos.

Fondo Gradiente

Ejemplo con fondo gradiente elegante

Este ejemplo muestra un fondo gradiente sutil.

El componente VideoTextSection es completamente responsive y se adapta a diferentes tamaños de pantalla.

Incluye efectos hover suaves y transiciones elegantes para mejorar la experiencia del usuario.

El video mantiene siempre el aspect ratio correcto de 16:9.

Video no disponible

Por favor, proporciona una URL válida de YouTube

Sin Video

Ejemplo sin URL de video

Este ejemplo muestra el placeholder cuando no se proporciona un video válido.

Cuando no se proporciona una URL válida de YouTube, el componente muestra un placeholder elegante con un mensaje informativo.

Esto es útil para desarrollo o cuando el video aún no está disponible.

Placeholder de video.

WhatsApp