Seleccionar página
Hola, me llamo Antonio Mtz, soy el iniciador de Divicon que hace referencia a (DIVI y CONferencias). Soy diseñador gráfico, con especialidad en imagen corporativa, me gusta mucho la ilustración, el 3D, Motion graphic, fotografía, tipografía. jajaja bueno todo lo que se refiere al diseño.

Divi Tutorial – YouTube autoplay Video Background Hero Section Divi wordpress

En este tutorial aprenderemos añadir un video con reproducción automática (autoplay) de youtube como fondo de sección apantalla completa en divi y wordpress.


Actualmente es más frecuente ver videos en las páginas web gracias a nuestro internet que es más rápido desde 5 mb a 100 mb incluso he escuchado que hay personas que tienen un internet superior

Pero por que añadir un video en mi página web.
Con un video, los beneficios de esto son: atraer la atención y retener al visitante (si es que tiene un internet rápido).

Los vídeos permiten personalizar la información de tu web, así como representar productos y servicios de forma mucho más detallada y precisa que simplemente con imágenes y texto.

Hay tres formas de insertar un video en nuestra página web creada con divi o wordpress, en este caso lo usaremos con divi themes como Background Hero Section Divi :

  • Por un lado, están los incrustados de YouTube que usamos, por ejemplo, como parte del contenido de un artículo o como fondo de la sección hero.
  • La otra forma es emplear los vídeos como parte de nuestro diseño como un elemento más de la interfaz, con el módulo de insertar video en divi themes y queda como ventana
  • Podemos utilizar HTML 5 para insertar nuestro video en nuestra página wordpress con divi themes

A nosotros nos interesa la parte de youtube donde podemos colocar el Video Background Hero Section Divi con autoplay en wordpress


Explicación de los controles
del IFRAME YOUTUBE


Autoplay:

Valores: 0 o 1. El valor predeterminado es 0. Define si el video inicial se reproduce automáticamente o no cuando se carga el reproductor.

Controls:

Valores: 0, 1 o 2. El valor predeterminado es 1. Este parámetro indica si se muestran o no los controles del reproductor de video.

Loop:

Valores: 0 o 1. El valor predeterminado es 0. Si solo hay un reproductor de video y se establece un valor de 1, el reproductor reproduce el video inicial una y otra vez.

List:

El parámetro list, junto al parámetro listType, identifica el contenido que se cargará en el reproductor.


DEMOSTRACIÓN Video
Background Hero Section Divi


Con esto lograremos añadir un video de youtube en divi themes .


  • Crearemos una sección a tamaño completo/fullwidth en divi
  • Añadiremos un módulo de código de divi y colocaremos el iframe de youtube el módulo que creamos.
  • Insertamos otro módulo de header pantalla completa /header fullwidth en este añadiremos un poco de css
  • Una vez que tengamos todo configurado, vamos a opciones menu y haremos unos ajustes de transparencia (opcional)
  • En medio moviles tenemos que modificar o cambiar el video por una imagen o configuramos nuestra header / header fullwidth
    para tener una mejor practica


10% de descuento en su tema Divi

ÚNETE A NUESTRO GRUPO DE FACEBOOK

¿Te parece interesante este artículo?
Puntaje
[Total: 0 Average: 0]

Suscríbete a nuestro boletín.

Recibe notificaciones cuando publiquemos algo nuevo.

Gracias por suscribirte

Pin It on Pinterest

Shares