Si has usado Shopify, conoces el tema Dawn. Es uno de los temas gratuitos preferidos para nuevos emprendedores, y una opción muy personalizable para diseñar un escaparate único.
El tema Dawn Viene con varios módulos, como su bloque para subir video estándar y una imagen de encabezado.
La imagen de encabezado permite que haya botones y texto en primer plano, mientras que la imagen sirve de fondo. Por desgracia, el módulo de vídeo no permite tener este tipo de elementos en primer plano.
Sin embargo, hay formas de tener lo mejor de ambos, creando así vídeo de encabezado en el que el vídeo está en el fondo fondo y hay texto en primer plano.
En esta guía, ¡te enseñaremos cómo crear un vídeo de encabezado con el tema Dawn en tu página principal que llame la atención!
Descripción general del tema Dawn
El tema Dawn área tema gratuito de Shopify Que es muy usado por los minoristas de negocios electrónicos.
Con un diseño simple y una configuración sencilla, se mantiene como una elección popular para la creación de una tienda visualmente atractiva y elegante.
¿Qué es un video de fondo o encabezado y por qué deberías utilizarlo en tu página web?
Un encabezado de vídeo es un área de una página web que presenta un vídeo como trasfondo a lo ancho, junto con otros elementos en primer plano, como botones y texto.
Un módulo como un vídeo de encabezado del tema Dawn Ofrece varias ventajas para mejorar la experiencia general de los visitantes de la página web. He aquí algunas ventajas clave:
- Elementos visuales enriquecidos: Al incorporar vídeos interesantes, la página web se vuelve más atractiva visualmente, captando la atención de los visitantes.
- Contenido dinámico e interesante.: Los vídeos transmiten información de forma eficaz. Pueden mostrar las características de un producto, mostrar cómo usarlos, o contar una historia de marca cautivadora, manteniendo el interés de los visitantes.
- Mayor participación de los usuarios: Los vídeos pueden crear una impresión duradera en los visitantes. La combinación de imágenes, sonido y movimiento llama la atención y anima a los usuarios a seguir explorando.
- Comunicación de marca eficaz: Un vídeo de fondo o de encabezado puede comunicar el mensaje de la marca a los clientes. Permite a las empresas destacar su propia propuesta de valor, mostrar productos o servicios y establecer una fuerte identidad de marca.
Al aprovechar el poder de los vídeos en el diseño de tu página web, puedes hacer que sea más interesante y aumentar las conversiones.
Guía paso a paso para agregar un video de fondo o encabezado al tema Dawn
Técnicamente, hay cuatro formas de agregar un vídeo de encabezado al tema Dawn (no todas son idóneas):
- Convertir el vídeo al formato de vídeo/imagen WebP.
- Ajustar el código de Shopify de encabezado normal de imagen, para que acepte vídeo.
- Convertir el vídeo a formato GIF.
- Simplemente subir un video al bloque de video de Shopify, dejando de lado la idea de poner elementos en primer plano (por lo que no sería un encabezado real).
No es terriblemente complicado modificar el código de Shopify para una imagen de encabezado estándar, pero el proceso es innecesariamente largo teniendo en cuenta que tienes acceso al formato de archivo WebP.
Los GIF hacen que bajen excesivamente la calidad del vídeo, y la cuarta opción no nos da un vídeo de encabezado real.
Por lo tanto, recomendamos convertir cualquier formato de vídeo que tengas (.mp4, .mov, .wmv) al formato WebP. WebP combina las ventajas de las imágenes JPEG de alta resolución, los vídeos y los GIF, ya que te permite producir vídeos vistosos sin el volumen y sin perder mucha resolución, y puedes subir vídeos e imágenes en formato WebP a un encabezado de imagen de Shopify.
Aquí tienes cómo:
Paso 1: Convierte tu vídeo al formato de archivo WebP
Hay varios conversores gratuitos online para pasar de formato vídeo a formato WebP. Puedes buscar alguno online, o puedes usar alguno de los conversores que hemos probado:
Sube el vídeo al conversor gratuito y, a continuación, elige convertirlo al formato WebP. Guarde el nuevo archivo en su computadora.
Paso 2: Encuentra el Tema Dawn en Shopify
Ve un “Tienda En línea” > “Temas”.
Si aún no lo tienes, instala el tema Dawn. Si ya lo tienes, podrás encontrar el tema Dawn designado como “tema actual” de Shopify. Haga clic en el botón “Personalizar” para continuar.
Paso 3: Añadir y seleccionar el bloque de encabezado de imagen
El bloque “imagen de encabezado” se añade por defecto en el tema Dawn. Por lo tanto, podrás hacer clic en ese módulo para abrir la configuración en el panel izquierdo.
También es posible hacer clic en el propio encabezado de imagen, en la vista previa a la derecha. Utiliza el enlace “añadir Bloque” si tienes que insertar “imagen de encabezado” desde cero.
Paso 4: Subir el archivo de vídeo WebP
Haga clic en el botón “seleccionar imagen”, debajo de la sección “primera imagen”.
Esto carga un área para subir imágenes a la biblioteca multimedia de tu tienda. También es posible pegar las URL de los vídeos, pero utilizaremos la función de subir imágenes.
Selecciona el botón “Añadir imágenes” y elige el archivo WebP que crear antes. Marque el archivo recién subido con una marca de verificación y, a continuación, haga clic en el botón “Listo”.
Esto pone el archivo de vídeo WebP en la imagen de encabezado, lo que te permite editar también cualquier contenido en primer plano. Haga clic en “Guardar”.
Enhorabuena, ¡has añadido exitosamente un video de encabezado en el tema Dawn!
Paso 5: Vista previa del vídeo
Pero antes que nada, sería buena idea mirar la vista previa del vídeo en el lado del cliente para asegurarse de que se ve bien, se ejecuta sin problemas y tiene la resolución adecuada.
Vuelve a la pantalla principal de la bandeja de entrada, y haz clic en el icono de ojo para “ver tu tienda en línea". Se encuentra al lado de “tienda online”, debajo de la sección de “canales de venta”.
¡Éxito!
Personaliza tu vídeo de encabezado de tema Dawn: Haz que sea solamente tuyo
La personalización asegura que tu vídeo encaje perfectamente con tu marca y la estética de tu tienda. Así que vamos a arremangarnos ya ponernos a ello, ¿listo?
Siempre debes seleccionar la imagen de encabezado para ver su configuración. Una vez allí, puedes modificar la opacidad de la imagen superpuesta y ajustar la altura del encabezado.
A continuación, puedes modificar la posición del contenido del escritorio, cambiando dónde aparece el texto superpuesto.
Mover las posiciones del texto y los botones es útil para colocarlos en una zona del vídeo en la que se vean mejor.
Para una mayor personalización, tienes acceso a una sección de “CSS personalizado”.
Y, por supuesto, es posible seleccionar el texto del contenido o los botones para cambiar lo que dicen y el aspecto que tienen.
Consejos para optimizar tu archivo de vídeo para obtener la máxima velocidad y compatibilidad
No sirve de nada tener un vídeo maravilloso si hace que tu página web se ralentice hasta casi detenerse, o si no se muestra correctamente en algunos dispositivos.
Por eso, optimizar el archivo de vídeo para obtener la máxima velocidad y compatibilidad es una tarea indispensable.
En esta sección, compartiremos algunos consejos útiles para garantizar que tu contenido en vídeo se optimice para que cargar y se reproduzca en todos los dispositivos.
- Usos formatos de archivo de vídeo (como WebP) que generalmente son compatibles con la mayoría de los navegadores web.
- Mantenga el tamaño del archivo de vídeo lo más pequeño posible. WebP es maravilloso para comprimir los vídeos sin perder calidad.
- Ajusta la relación de aspecto del vídeo para que se adapte bien al tamaño de la pantalla.
- Elige un vídeo con colores y contrastes equilibrados que se ajusten a la personalidad de la tienda.
Cómo solucionar problemas comunes al agregar un fondo o encabezado de vídeo al tema Dawn
A veces, por muy Cuidadoso que hayas sido, pueden surgir problemas al agregar un vídeo de encabezado al tema Dawn. Aquí tienes ¡algunos consejos para solucionar los problemas que puedas encontrarte:
Problemas de incompatibilidad
Intenta convertir el vídeo a un formato de archivo compatible, como WebP, o usa el enlace de insertar vídeo.
El tamaño del vídeo es demasiado grande.
Recorta el vídeo o comprímelo para reducir el tamaño del archivo sin perder calidad.
El vídeo no se reproduce automáticamente.
¿Cómoprueba que ha activado la opción “Reproducción automática” en la configuración del tema.
Nuestra conclusión sobre cómo agregar un vídeo de encabezado al tema Dawn
Siguiendo paso a paso nuestra guía, y nuestros consejos para solucionar problemas, deberías poder agregar un vídeo de encabezado al tema Dawn de Shopify sin problemas.
¿Qué opinas? ¡Cuéntanos en los comentarios si has podido añadir un vídeo de encabezado al tema Dawn!
Comentarios Comentarios 0