Los diseños Idea, Bahia, Cubo y Amazonas están especialmente adaptados para pantallas de dispositivos móviles; es por eso que el carrusel de imágenes funciona de forma tal que, en celulares, se adapta para mostrarse más grande y ocupa casi toda la pantalla. 

Para garantizar que tus clientes tengan una experiencia de navegación óptima al navegar tu tienda desde el celular, es importante que utilices las herramientas disponibles en el Administrador nube a la hora de configurar el texto y los botones de tus banners.

A continuación, te enseñaremos cómo preparar las imágenes que estarán visibles en tu carrusel siguiendo estos pasos:

  • Preparar las imágenes para el carrusel
  • Cómo cargar y editar las imágenes en el carrusel

Preparar las imágenes para el carrusel

Como bien menciona la recomendación en el Administrador de tu Tiendanube, proponemos que subas imágenes de 1580px de ancho por el alto sugerido, ya que estas dimensiones son las adecuadas para dispositivos con pantallas grandes como computadoras de escritorio y notebooks.

Sin embargo, hoy en día el mayor tráfico en tu tienda, así como la mayoría de tus ventas, son realizadas desde dispositivos móviles, y esta tendencia va en aumento.

Por eso, no tenés que perder de vista cómo se van a mostrar estas imágenes en los celulares. Es más, recomendamos que la imagen sea principalmente contemplada para celulares y que se adapte de forma correcta en pantallas más grandes.

Algunas recomendaciones para tener en cuenta:

  • Te sugerimos probar la imagen en la visualización "mobile" o celular para ver cómo quedaría en tu tienda. Esto podés hacerlo después de subir la imagen en tu administrador nube, presionando el botón en la parte superior de la pantalla.
  • Si tenés tu título o botón incluido en la imagen, te sugerimos ubicarlos de forma central en un ancho menor a 400px, para que en dispositivos móviles se vea de forma completa. 
  • Sin embargo, la mejor opción es incluir los textos y el botón directamente desde tu Administrador nube, como explicamos más abajo en este tutorial.

💡TIP: Te sugerimos no incluir información destacada o textos cerca de los bordes, y que la imagen se pueda entender si está cortada.

Veamos un ejemplo:

Para una imagen de 1580px de ancho, tendrías un área (remarcada en celeste) donde podrías ubicar información importante para usuarios que visiten la tienda desde computadoras.

Pero, si dentro de la imagen querés agregar un título, texto y botón, deberías ubicarlos en el área central de 400px de ancho, para que tus clientes que visiten la tienda desde sus celulares puedan ver todo el contenido.

Te mostramos un ejemplo de una buena utilización de la imagen, en donde el contenido principal del banner se puede entender desde cualquier dispositivo:

Cómo cargar y editar las imágenes en el carrusel

A continuación, te vamos a mostrar cómo realizar las configuraciones de tu carrusel de imágenes directamente desde el Administrador nube.

Cargar las imágenes del carrusel

Cada imagen que vas a incluir representará uno de tus banners dentro del carrusel. Es posible cargar la cantidad que quieras, sin embargo, recomendamos que no agregar más de cinco, para que tu tienda no quede sobrecargada.

Para este paso, podés seguir el tutorial general para todos los diseños 👉¿Cómo agregar un carrusel de imágenes en mi tienda?.

Agregar un link, texto, título, descripción, botón y color a las imágenes

Este contenido va a aparecer por encima de la imagen, de forma central y se va a ajustar para que siempre esté visible en cualquier dispositivo, tanto en celulares como en computadoras.

Utilizar el texto editable sobre las imágenes del carrusel tiene varias ventajas:

  • El texto se va a ajustar a la resolución de la pantalla del usuario
  • Es más fácil: el texto se agrega directamente en tu administrador sin la necesidad de editar la imagen
  • El contenido editable es detectado e indexado en los buscadores (es SEO friendly), contrariamente al caso de que el texto sea parte de la imagen
  • Podés editar el texto de forma fácil y rápida.

📌Aclaración: Como menciona el nombre de este tutorial, esta posibilidad solo existe en los diseños: Idea, Bahía, Cubo y Amazonas.

¡Vamos a los pasos!

1. Para comenzar a editar tus banners, es necesario hacer clic en los íconos de "Link" o "Texto" que se encuentran arriba de la imagen de previsualización, como en este ejemplo:

2. Al hacer clic en el botón "Link" o "Texto", se abrirá automáticamente una nueva sección donde podés realizar las configuraciones que prefieras.

  • Agregar un link: hacer clic en el ícono del link (🔗) para adicionar una URL para llevar a tus clientes a una página específica cuando hagan click en la imagen.
  • Ingresar título: puede ser el nombre de tu marca o alguna palabra clave para informar a tus visitantes acerca de promociones o lanzamientos.
  • Ingresar descripción: podés agregar más detalles sobre lo que querés informar en tu banner, como las características do tu producto, el porcentaje de descuento, etc.
  • Agregar un botón: además, podés agregar un botón con un texto corto que invite a tus clientes a hacer clic en el botón, como "Comprar" o "Ver más".
  • Color del texto: vas a poder elegir si el color del texto de tu banner tendrá el mismo color de los demás textos de tu tienda, o si será igual al color de fondo.

💡 TIP: Podés ver fácilmente cómo queda tu imagen con los textos y botón en un celular desde el Administrador Nube, haciendo clic en el ícono de celular 📱 que está arriba en el menú.

3. Cuando termines de completar toda la información en esta sección, podés hacer clic en "Guardar borrador", para publicarlo después, o "Publicar" para que se muestre inmediatamente en tu tienda.

¡Listo! Una vez que finalices las configuraciones, tu banner será cargado en el diseño de tu Tiendanube.

¿Encontró su respuesta?