logooneasesoria4

¿Necesita una consulta gratuita?

Reproducción automática de vídeos en Divi

Una de las cosas más desesperantes cuando insertas un vídeo en una página de tu web es que este no se reproduzca automáticamente, especialmente si quieres que sea un vídeo de fondo, o sirva de animación de una sección.

Si utilizas el tema Divi, por algún motivo, no tienes manera de aplicar la reproducción automática a los vídeos que subes a tu servidor, ya que no existe ningún ajuste en el maquetador para ello.

En cualquier situación en la que insertes un vídeo mediante código siempre puedes aplicar parámetros de reproducción automática, como en un módulo de texto o de código, pero no hay ninguna opción para esto en el módulo de vídeo de Divi.

Afortunadamente hay un par de soluciones que, tras mucho probar scripts de todo tipo, incluso combinaciones de JavaScript y CSS, funcionan en todos los casos, que son las que vamos a ver en esta ocasión…

No uses el módulo de vídeo de Divi

Lo primero que tienes que tener claro es que, si quieres reproducción automática de un vídeo, no utilices el módulo de vídeo de Divi. Si ya lo tenías añadido, simplemente quita el módulo, a continuación veremos cómo insertar tu vídeo, pero pudiendo aplicar la reproducción automática, y más parámetros si quieres.

Usa el vídeo de fondo de cualquier módulo de Divi

La primera posibilidad de poder mostrar tus vídeos en reproducción automática es usar la opción de vídeo de fondo, que por defecto funciona en reproducción automática, de cualquier módulo (separador, sección, texto, todos)

video fondo modulos divi

Los vídeos de fondo en Divi siempre se muestran en reproducción automática, da igual en qué módulo los añadas.

Usa el módulo de código de Divi

Si, por el motivo que sea, lo que necesitas es un vídeo que no vaya de fondo en ningún módulo, la opción que debes tomar es usar el módulo de código. Simplemente insértalo en la sección o columna donde quieras que se muestre el vídeo y añade lo siguiente:

<video width="100%" playsinline controls loop muted autoplay> 
<source src="https://midominio.com/wp-content/uploads/2023/04/mi-video.mp4" type="video/mp4"> 
</video>

En el código anterior debes sustituir la URL (src) de ejemplo por la del vídeo que quieras mostrar.  Para saber la URL del vídeo, tras haberlo subido, en la biblioteca de medios tienes un botón para copiar la URL del mismo.

copiar url archivo medios biblioteca wordpress

Una explicación rápida de los parámetros del código es la siguiente:

  • playsinline – se reproduce integrado en la web, especialmente en móviles, que tienden a abrirlos a pantalla completa
  • controls – evita que se muestren los controles (salvo que pases el cursor por encima)
  • loop – se reproduce en bucle
  • muted – se reproduce sin sonido
  • autoplay – se reproduce automáticamente, sin necesidad de clic

Puedes usarlos todos, o solo los que creas necesarios para tu vídeo.

¿Cual de los 2 métodos es mejor utilizar?

Es cierto que en realidad puedes usar cualquiera de los dos métodos (vídeo de fondo o código del vídeo) y funcionarán en cualquier parte, pero en mi opinión, salvo que realmente quieras que sea un vídeo de fondo, que delante de ese «fondo» haya otra cosa, es mejor utilizar el módulo de código por varios motivos:

  1. Te permite personalizar los parámetros de reproducción del vídeo.
  2. Se adapta automáticamente al espacio disponible (columna, sección, etc.)
  3. Puedes hacer carga diferida (lazy loading), aplazar su carga y demás optimizaciones que ofrecen los plugins de rendimiento, mientras que no siempre es posible con vídeos de fondo.
¿Te gustó este artículo?
  • Pretty sectioon oof content. I juxt stumblerd upon your blog and in accession capotal to aszsert that I gett ctually enjoyed account you log
    posts. Any way I’ll be subscribing to yojr augmeent annd
    even I achievemnt yyou accezs consistently fast.

  • I’ll immediately grasp yur rrss ffeed ass I can’t find yyour
    emaail subscription link or e-newsletter service. Do youu
    have any? Pleawse allow mee undersstand sso thgat I could
    subscribe. Thanks.

  • I don’t think the title of your article matches the content lol. Just kidding, mainly because I had some doubts after reading the article.

Déjanos tus comentarios..!

16 de abril de 2023

RECIBE

GRATIS

Recursos para tu web GRATIS.

En agradecimiento por haber leido nuestro blog te ofrecemos algúnos plugins, temas y asesoría para el desarrollo de tu sitio web.
Envía correo y espera respuesta...Gracias..!
baneranunciopluginsbest
Publicaciones Relacionadas
Abrir chat
One Asesoría
Hola 👋
¿Necesita cotizar una página o tienda online, cómo podemos ayudarle..?