Cómo agregar videos de YouTube como fondo de pantalla completa en WordPress

Publicado: 2023-06-10

¿Está buscando una manera de agregar videos de YouTube como fondos de pantalla completa en WordPress?

Cuando se usan con cuidado, los videos de fondo pueden captar instantáneamente la atención de un visitante y mantenerlo en su sitio web. Esto los convierte en una excelente opción para páginas de destino y páginas de ventas.

En este artículo, le mostraremos cómo agregar un video de YouTube como fondo de pantalla completa en su sitio web de WordPress.

How to add YouTube video as fullscreen background in WordPress

¿Por qué usar un video de YouTube como fondo de pantalla completa?

Cuando los visitantes llegan por primera vez a su sitio web de WordPress, solo tiene unos segundos para captar su atención y hacer que se queden.

Un fondo de video atractivo y llamativo es una excelente manera de mantener a los visitantes en su sitio. Además, hay muchos temas diferentes de WordPress que admiten fondos de video.

Sin embargo, cargar y alojar un video en WordPress puede requerir mucho ancho de banda. Dependiendo de su plan de alojamiento de WordPress, es posible que incluso tenga que comprar almacenamiento adicional.

Una solución es agregar un video de YouTube como fondo de pantalla completa. De esta manera, puede destacarse de sus competidores sin ralentizar su sitio web ni ocupar espacio de almacenamiento adicional.

Dicho esto, veamos cómo puede agregar un video de YouTube como fondo de pantalla completa en su sitio web de WordPress.

Cómo agregar videos de YouTube como fondo de pantalla completa en WordPress

La forma más fácil de agregar un video de YouTube como fondo de pantalla completa es usar Fondos avanzados de WordPress. Este complemento agrega un nuevo bloque de fondo que le permite crear un fondo de pantalla completa usando cualquier color, imagen o video, incluidos los videos de YouTube.

An example of a YouTube video background in WordPress

Primero, deberá instalar y activar el complemento. Si necesita ayuda, consulte nuestra guía sobre cómo instalar un complemento de WordPress.

Tras la activación, simplemente diríjase a la página o publicación donde desea agregar un video de YouTube como fondo de pantalla completa. A continuación, puede continuar y hacer clic en el botón '+'.

En la ventana emergente que aparece, comience a escribir 'Background AWB'. Cuando aparezca el bloque correcto, dale un clic para agregarlo a la página.

How to add a fullscreen video to a WordPress blog post or page

En el menú de la izquierda, verá tres pestañas para los diferentes tipos de fondos de pantalla completa que puede crear: Color, Imagen y Video.

Como desea agregar un video de YouTube, haga clic en la pestaña 'Video'.

Este complemento le permite usar un video autohospedado como fondo. Sin embargo, los videos ocupan mucho espacio de almacenamiento y ancho de banda, por lo que nunca debes subir un video a WordPress.

Dicho esto, seleccione la pestaña 'YouTube / Video'.

How to add a YouTube video as a fullscreen background in WordPress

Ahora, necesitará la URL del video de YouTube que desea usar en su blog de WordPress.

En una nueva pestaña, simplemente ve al video y copia el enlace en la barra de direcciones.

Getting the URL for a YouTube video

Una vez hecho esto, vuelva a su panel de control de WordPress y pegue la URL en la pestaña 'URL de video'.

Ahora, el editor de bloques de WordPress mostrará una vista previa de cómo se verá este fondo. Fondos avanzados de WordPress cambia el tamaño del video según el contenido que agrega encima, así que no se preocupe si el video actualmente se ve un poco pequeño.

How to customize a YouTube background video in WordPress

Antes de comenzar a agregar contenido, es una buena idea configurar los ajustes del fondo.

De manera predeterminada, el fondo de video está deshabilitado en dispositivos móviles. Los teléfonos inteligentes y las tabletas suelen tener pantallas más pequeñas y menos potencia de procesamiento en comparación con las computadoras de escritorio. Con eso en mente, es una buena idea dejar el fondo de video deshabilitado en el móvil.

Sin embargo, si desea mostrar el fondo del video en dispositivos móviles, haga clic para activar la opción 'Habilitar en dispositivos móviles'.

Showing a YouTube background on mobile devices

Fuera de la caja, el bloque reproducirá todo el video de YouTube en un bucle.

Otra opción es reproducir una parte específica del video escribiendo las horas exactas en los cuadros 'Hora de inicio' y 'Hora de finalización'.

How to add a YouTube background video to a website

También puede evitar que el video se reproduzca en un bucle desactivando el interruptor 'Bucle'.

De forma predeterminada, el video solo se reproducirá cuando el visitante pueda verlo en su navegador. Esto ayuda a aumentar la velocidad y el rendimiento de WordPress, por lo que, por lo general, querrás dejar la opción "Reproducir siempre" desactivada.

Cuando agrega el video por primera vez, se muestra con una opacidad del 100%, por lo que se ve sólido.

Según el diseño de su sitio, es posible que desee experimentar con un fondo de video semitransparente arrastrando el control deslizante "Opacidad de la imagen". Esta puede ser una forma de crear un fondo de video de YouTube más sutil.

Changing the opacity settings for a YouTube video

Si experimenta con la opacidad, también puede intentar agregar una superposición de color.

Simplemente haga clic para expandir la sección 'Color de superposición' y luego use la configuración para crear superposiciones de diferentes colores.

Adding an overlay to a video background

El complemento Advanced WordPress Backgrounds admite algunos efectos de paralaje diferentes. Esta es una técnica moderna de diseño web en la que el elemento de fondo se desplaza más lentamente que el contenido de primer plano, lo que a menudo agrega profundidad al diseño de la página.

Para probar los diferentes efectos de paralaje, haga clic para expandir la sección 'Paralaje' y luego elija una opción del menú desplegable.

Adding parallax effects to a WordPress website

Después de elegir un estilo de paralaje, obtendrá acceso a algunas configuraciones adicionales donde puede cambiar la velocidad. También puede habilitar y deshabilitar el efecto de paralaje en dispositivos móviles.

Del mismo modo, puede experimentar con diferentes efectos de paralaje del mouse, que hacen que el fondo se desplace más lentamente cuando el visitante mueve el mouse.

Para echar un vistazo a estas configuraciones, haga clic para expandir la sección 'Mouse Parallax'.

Adding mouse parallax effects to a background video

Cuando esté satisfecho con la configuración del fondo de video de YouTube, es hora de comenzar a agregar contenido como texto, enlaces e imágenes.

Para comenzar, haga clic en el ícono '+' en el medio del bloque Fondo (AWB).

Adding blocks to a YouTube background video

Esto abre una ventana emergente donde puede elegir el bloque que desea agregar. El complemento Fondos avanzados de WordPress funciona con todos los bloques estándar de WordPress, por lo que puede agregar cualquier contenido que desee.

Después de configurar el primer bloque, simplemente haga clic en el botón '+' nuevamente y luego agregue el siguiente bloque que desea usar.

Adding a RafflePress giveaway block to a video background

Simplemente siga repitiendo este proceso para crear la publicación o el diseño de la página.

Cuando esté satisfecho con su apariencia, haga clic en el botón 'Actualizar' o 'Publicar' para que la página esté activa. Ahora, si visita su sitio web de WordPress, verá el fondo del video en acción.

An example of a YouTube video background in WordPress

Bono: Cómo agregar un feed de video de YouTube en WordPress

Un fondo de video puede captar la atención de los visitantes y, al mismo tiempo, promocionar su canal de YouTube. Sin embargo, si realmente desea obtener más visitantes y suscriptores en YouTube, es posible que desee agregar más videos a su sitio web.

Ahí es donde entra Smash Balloon.

Smash Balloon YouTube Feed Pro es el mejor complemento de galería de YouTube del mercado. Muestra automáticamente todos los videos más recientes de su canal de YouTube, para que los visitantes siempre vean el contenido más reciente.

Embedding a YouTube playlist using Smash Balloon

Simplemente cree un feed de YouTube usando el sencillo editor de Smash Balloon, y luego agréguelo a cualquier página o publicación usando un código abreviado o el bloque listo para usar del complemento.

También puede usar Smash Balloon para incrustar listas de reproducción, favoritos y transmisiones en vivo de YouTube en su sitio web de WordPress.

Creating a YouTube feed using the Smash Balloon social media plugin

Lo mejor de Smash Balloon es que no ralentiza tu sitio. La función de almacenamiento en caché de YouTube incorporada del complemento se asegurará de que su sitio siempre se cargue rápido, lo cual es excelente para SEO.

Esperamos que este artículo te haya ayudado a aprender cómo agregar un video de YouTube como fondo en WordPress. También puede consultar nuestra guía sobre cómo crear una página de destino con WordPress y nuestras selecciones de expertos para los mejores complementos de la galería de videos de YouTube.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para videos tutoriales de WordPress. También puede encontrarnos en Twitter y Facebook.