Video de fondo de WordPress: agréguelo en 2 métodos diferentes
Publicado: 2023-07-25¿Está buscando hacer que su sitio web de WordPress sea más emocionante y cautivador? Una excelente manera de hacerlo es agregando un video de fondo. Es una característica interesante que capta instantáneamente la atención de las personas y hace que su sitio sea más atractivo. Pero, ¿cómo agregar un fondo de video en WordPress?
Si solicita los pasos sencillos para agregar un video de fondo de WordPress, entonces-
- Crear una publicación/editar cualquier publicación existente
- Añadir bloque de portada
- Ahora agregue el video cargándolo o desde la biblioteca de medios
- Por último, personalízalo.
Parece sencillo, pero hay algo de trabajo extra. No te preocupes; en este artículo, hemos explicado todo correctamente. Bueno, no es solo el camino; hemos agregado otra forma de agregar video como fondo del sitio web usando PostX.
Entonces, exploremos cómo agregar un fondo de video en WordPress.
Video de fondo de WordPress: cómo agregar con el editor de bloques predeterminado
Entonces, aquí estamos en el segmento principal. Es posible que no le gusten las molestias adicionales, como agregar un complemento para insertar videos como fondo de WordPress. Entonces, comencemos con el editor Gutenberg o Block predeterminado. A continuación, agregamos una guía paso a paso sobre cómo hacerlo.
Paso 1: inicie sesión y cree una publicación/página
Aquí el primer paso es tan básico. Inicie sesión en su panel de WordPress y luego coloque el cursor sobre el botón "+ Nuevo". Luego, según su preferencia, agregue una publicación o una página.
Paso 2: agregue el bloque de portada
Ahora haga clic en el botón "+" para agregar un nuevo bloque. Luego, en el cuadro de búsqueda, escriba "portada" y verá el icono del bloque de portada. Se verá como la siguiente imagen.
Paso 3: Agrega el video
Después de hacer clic en el botón de portada, aparecerá el bloque con algunas opciones. Allí tendrás dos opciones para agregar un video de fondo. Puede cargar un video desde su computadora haciendo clic en el botón "Cargar" o seleccionar un video de su "Biblioteca de medios".
Así que ahora haga clic en cualquiera de ellos y elija el video que desea usar como video de fondo de WordPress.
Paso 4: personaliza todo
La tarea que está buscando: agregar un fondo de video de WordPress ahora está lista. Pero ahora es el momento de personalizar todo. Hay muchas opciones para personalizar. A continuación, analizaremos algunas personalizaciones comunes.
Agregar título para el bloque
Lo que la mayoría de la gente hace es agregar un título sobre el video. Aquí no tendrás que hacer nada especial. Es porque, de manera predeterminada, notará "Escribir título..." Simplemente haga clic aquí y verá el cursor de escritura.
Ahora puede agregar fácilmente cualquier título/cita o lo que quiera mostrar sobre el video de fondo. Incluso encontrarás algunas opciones de personalización más, como:
- Párrafo/Encabezado
- Color de texto
- Tamano del texto
- Selector de puntos focales
Eso es todo. Has terminado de integrar un video de fondo en WordPress.
Agregar estilo al video
Bueno, solo un pie de foto no lo es todo. También puede cambiar el estilo del video de fondo. Para eso, haga clic en el botón de estilo (el botón parece un círculo medio blanco y negro) y encontrará más opciones para personalizar el video. Las opciones incluyen
- Color (Sólido y Degradado)
- Opacidad superpuesta
- Tipografía
- Altura mínima de la cubierta
Ahora incorpore el estilo de acuerdo a sus preferencias personales. Acabamos de agregar textos con diferentes tamaños y colores y los alineamos en consecuencia. Aquí está el resultado final del video de fondo de WordPress de Gutenberg.
Video de fondo de WordPress: Cómo agregar con PostX
El anterior era el método predeterminado. Sin embargo, si le encanta personalizarlo más y desea una apariencia más profesional, le sugerimos que use nuestro complemento PostX. PostX ofrece más control sobre sus videos de fondo de WordPress y le permite agregarlos fácilmente con varias opciones de personalización. Con PostX también puede mostrar videos como imágenes destacadas. Así es como puede usar PostX para agregar un video de fondo a su sitio web de WordPress:
Paso 1: instalar y activar la publicación
Primero, debe instalar y activar el complemento PostX en su sitio web de WordPress. Para hacerlo, haga clic con el cursor en la sección "Complementos" en su panel de WordPress y luego haga clic en "Agregar nuevo".
Después de eso, busque "PostX". Una vez que encuentre el complemento, haga clic en "Instalar ahora" y luego en "Activar".
Obtenga PostX Pro para desbloquear todas las funciones interesantes y crear sitios web increíbles
Paso 2: crea una publicación nueva o edita una existente
Después de activar PostX, puede crear una nueva publicación o editar una existente en la que desee agregar el video de fondo. También puede usar el complemento en páginas o cualquier otro tipo de publicación personalizada. Entonces, ahora cree una nueva publicación como lo expliqué antes.
Paso 3: agregue el bloque de fila/columna
Ahora al igual que el anterior, haga clic en el botón "+" para agregar un nuevo bloque. Luego, en el cuadro de búsqueda, escriba "Fila" y encontrará el icono de bloque PostX Fila/Columna.
NB: Es posible que vea 2 bloques diferentes llamados Fila. No se confunda; uno es del editor predeterminado y otro es de PostX. Simplemente siga la imagen de arriba y seleccione el bloque Fila/Columna sugerido.
Paso 4: elige el diseño
Después de hacer clic en el bloque de filas, verá diez diseños diferentes, como "100", "50:50", "50:25:25", etc. Elija cualquiera de ellos según sus necesidades.
Vamos con el diseño 100:00: haz clic en él.
Paso 5: Haga clic en Fondo y envoltorio
Después de optar por el diseño, notará que el bloque de filas se crea con un solo bloque dentro.
No tienes ningún trabajo ahora con el bloque incluido. En cambio, su tarea principal ahora es con el bloque Fila. Ahora haz clic en el botón "Bloquear" (lo encontrarás justo debajo del botón de publicar).
Luego verá muchas opciones para personalizar la Fila. Sin embargo, nuestra tarea principal es agregar un video de fondo de WordPress. Así que busque la opción "Fondo y envoltura" dentro del "Botón de bloqueo" y luego haga clic en él. Si no lo encuentras, solo revisa la imagen de abajo.
Paso 6: Cargue la URL del video
Ahora haga clic en el botón y encontrará 4 opciones debajo de la opción de fondo: sólido, degradado, imagen y video. Allí, seleccione "Video".
Nota: cuando usa PostX, no puede cargar un video directamente. Tendrás que compartir la URL del video. En la mayoría de los casos, es más ventajoso.
Por ejemplo, si desea agregar cualquier video de YouTube, simplemente copie la URL del video y péguela en el cuadro "URL DEL VIDEO".
Pero en el caso de cualquier video guardado, lleva un poco de tiempo. Como no existe la opción de cargar videos directos, deberá compartir una URL autohospedada. Puede cargar videos en su sitio de WordPress y agregarlos utilizando el enlace de video cargado.
Ahora, al igual que insertó el enlace del video de YouTube, inserte el enlace del video alojado en el cuadro de URL del video predeterminado.
[Nota: asegúrese de que la URL del video alojado esté disponible para el público; de lo contrario, nadie podría ver el video].
Paso 7: personaliza la configuración de video
Después de agregar el video, PostX ofrece algunos beneficios adicionales. Por ejemplo, puede ajustar el tiempo del video. Simplemente complete el cuadro de hora de inicio y hora de finalización de acuerdo con la hora y la posición en la que desea ejecutar el video.
También tiene la opción de habilitar o deshabilitar "Video Loop" y configurar la "Imagen de respaldo de video".
Paso 8: agregue elementos al bloque interior
Ya has terminado de agregar el video de fondo. Es hora de diseñarlo. Como hemos seleccionado un diseño de 100:00, puede agregar un solo elemento al diseño. Sin embargo, podemos agregar múltiples bloques debajo de esto.
También puede configurar el píxel del video de fondo. Para hacerlo, simplemente desplace el cursor sobre la esquina superior o inferior central del bloque "Fila". Tan pronto como llegue a la posición, verá un píxel dentro de la Fila. Luego puede hacer clic y arrastrarlo hacia arriba o hacia abajo para ajustar el tamaño del video de fondo.
Ahora finalmente, personalízalo según tus preferencias. Vamos a preparar un video de fondo personalizado rápido ahora. Vamos a comprobarlo paso a paso.
Guía práctica sobre la personalización del fondo de video de WordPress
Ahora crearemos un video de fondo simple que muestre un servicio turístico.
Paso 1: siga los pasos anteriores y agregue el video
Ya hemos aprendido lo básico. Simplemente siga los pasos a continuación y agregue un video de fondo de WordPress usando el bloque Fila/Columna de PostX.
Paso 2: Agregar encabezado al bloque existente
Ahora seleccionamos un diseño de 100:00. Allí puede agregar un solo elemento. Estamos agregando el bloque "Título".
Después de agregar el bloque de encabezado, agregue el eslogan/servicio que desea mostrar en el encabezado.
Paso 3: agregue un bloque de párrafo debajo del encabezado
Ahora simplemente haga clic en Intro o haga clic en el botón "+" y verá otro bloque debajo del encabezado. Es, por defecto, un bloque de párrafo. Ahora escribe lo que quieres ofrecer en el bloque de párrafos. Para una mejor visibilidad, mantenemos el color del texto "Blanco".
Paso 4: Agregar botones CTA
Ahora siguiendo de la misma manera, después de completar el bloque de párrafo, presione el botón enter y aparecerá un nuevo bloque. Ahora agregue el "Grupo de botones" de PostX.
Estamos agregando 2 botones CTA (Llamada a la acción) para atraer clientes con diferentes propósitos. Para personalizar los botones de una mejor manera, mira este video.
La creación del video de fondo ahora está completa. Veamos el resultado final.
Pautas para agregar un fondo de video en WordPress
Aquí hay algunas pautas recomendadas para agregar un fondo de video a su sitio web de WordPress:
Optimice el tamaño de los archivos sin sacrificar la resolución
Los videos e imágenes grandes pueden ralentizar el rendimiento de su sitio, por lo que es importante encontrar un
equilibrio entre el tamaño del archivo y la resolución al comprimir sus videos.
Usa videos con moderación
Evite saturar su sitio web con demasiados videos. En su lugar, úselos estratégicamente para resaltar puntos importantes o mostrar contenido relevante.
Incluir una llamada a la acción
Cuando utilice un fondo de video, asegúrese de proporcionar información adicional o un botón claro de llamada a la acción. No deje a los espectadores con ganas de más sin ofrecer un vínculo o una dirección para obtener más información.
Evite la reproducción automática con audio
Hacer que el audio se reproduzca automáticamente cuando alguien visita su sitio web puede ser molesto y perturbador. Es mejor evitar por completo la reproducción automática de audio.
Proporcionar una opción para la reproducción de audio
Si su video requiere audio, brinde a los usuarios la capacidad de controlar la reproducción de audio. Esto les permite elegir si quieren o no escuchar el audio.
Considera los subtítulos
Incluya subtítulos para videos que tienen audio. Esto ayuda a que su contenido sea accesible para todos los usuarios, incluidos aquellos que se encuentran en un lugar donde no pueden reproducir audio o tienen problemas de audición.
Aloja videos externamente
Para garantizar un rendimiento óptimo, considere usar plataformas de alojamiento de videos externas como Vimeo o YouTube. Estas plataformas están diseñadas específicamente para alojamiento y transmisión de videos.
Cumplir con los formatos y resoluciones recomendados
Al cargar videos, use el formato MP4 con una resolución mínima de 720p. Además, asegúrese de que los videos estén codificados con el códec h264, ya que brinda buena calidad y compatibilidad.
Ultimas palabras
Con suerte, ahora ha entendido correctamente cómo agregar videos de fondo de WordPress. Hemos agregado 2 métodos, y ambos métodos tienen ventajas y desventajas.
En resumen, diría que si desea agregar un video como fondo o un enlace de video, PostX es la mejor opción. Pero si desea cargar un video, entonces el bloque predeterminado es la opción más fácil para usted.
Obtenga PostX Pro para desbloquear todas las funciones interesantes y crear sitios web increíbles
Integración de PostX Beaver Builder: use bloques de Gutenberg en Beaver Builder
Cómo crear variaciones de productos de WooCommerce
PostX 2.4.9: ¡Novedades!
Personalización del menú de WordPress en el tema Twenty Twenty-two