Los diseños Idea, Bahia y Amazonas están especialmente adaptados a 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. 

Por este motivo, es importante que tu carrusel de imágenes muestre imágenes e información importante y que los textos que tengan estas imágenes estén centrados y se vean completos en mobile. Para garantizar esto, te sugerimos usar la herramienta de texto editable dentro del Administrador Nube, que te permite agregarle el texto a la imagen sin editarla previamente. 

1. 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 1500px de ancho por 770px de alto, ya que estas dimensiones son las adecuadas para dispositivos con pantallas grandes como computadoras de escritorio y notebooks.

Pero 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 lo que 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.

Por eso, te sugerimos que no incluyas información destacada o textos cerca de los bordes, además de que la imagen se pueda entender si está cortada.

Para esto te sugerimos que, por un lado, pruebes la imagen en la visualización "mobile" para ver cómo quedaría. 

Por otro lado, si querés mostrar un título, texto o botón para el carrusel, tenés dos opciones:  

  • Si ya los tenés incluidos en la imagen, te sugeriamos ubicarlos de forma central en un ancho menor a 400px, para que en dispositivos móviles se vea de forma completa. 
  • La mejor opción es incluir los textos y botón directamente desde tu Administrador nube, como explicamos más abajo en este tutorial.

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

Pero deberías ubicar título, texto y botón 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:

2. Cómo cargar las imágenes al carrusel de tu tienda

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?

¿Cómo agregar texto a las imágenes del carrusel?

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.

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, Bahia y Amazonas.

Ahora veamos los pasos para usarlo:

1. Cuando cargues la imágenes en el carrusel, dentro de la sección "Carrusel de imágenes", hacer clic en el botón de edición “🖉” arriba de la imagen cargada a la que querés agregarle texto.

2. Vas a ver un formulario donde podés:

  • Agregar un link: para llevar a tus clientes a algún sitio en particular cuando hacen clic en la imagen.
  • Agregar un título: podría ser el nombre de tu marca o algún mensaje para promocionar tus productos, como "Rebajas".
  • Agregar una descripción: podría ser tu slogan o alguna información sobre las características de tus productos. 
  • Agregar un botón: agregar un texto corto que invite a tus productos a hacer clic, como "Comprar" o "Ver más".
  • Color de los textos: podés elegir que sean del mismo color que los demás textos de tu tienda, o del 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. Finalmente, hacer clic en "Guardar cambios" y verificar cómo quedó en tu tienda.

¿Encontró su respuesta?