Módulo Carrusel de Imágenes: guía paso a paso para tu tienda

Módulo: Carrusel de Imágenes

Paso a Paso

1- Definiciones Básicas - Introducción

1. ¿Qué es el Carrusel de Imágenes?

Es un módulo que permite mostrar un slider de imágenes rotativas en la página principal de la tienda online (generalmente en el home). Se utiliza para destacar promociones, productos estrella o campañas visuales con alto impacto.

2. ¿Para qué sirve?

• Resaltar productos destacados o de temporada.
• Mostrar promociones visuales con banners llamativos.
• Mejorar la estética de la tienda con imágenes dinámicas.
• Guiar al cliente hacia secciones importantes con enlaces.

3. Beneficios de tenerlo activo

• Impacto visual inmediato: es lo primero que el cliente ve al entrar.
• Versatilidad: cada imagen puede dirigir a categorías, productos o páginas específicas.
• Mejora la conversión: banners bien diseñados aumentan clics y ventas.
• Fácil actualización: podés cambiar imágenes según campañas (ejemplo: Hot Sale, Navidad).

4. Acceso al módulo

• Ingresar al Panel de Administración de PrestaShop.
• Ir a Módulos > Módulos instalados.
• Buscar Carrusel de imágenes.
• Hacer clic en Configurar.

5. Configuración (paso a paso)

• Dentro del módulo, hacer clic en Añadir nueva imagen.
• Completar los campos:

• Imagen: subir banner optimizado (tamaño recomendado: 1200 × 400 px aprox., peso < 200 KB).
• Título: breve texto interno para identificar la imagen.
• URL de destino (opcional): enlace a una categoría, producto o página.
• Orden: elegir la posición en la secuencia del carrusel.
• Estado: activar o desactivar la imagen.

• Guardar.
• Repetir para cada imagen que quieras incluir.

6. Subir imágenes para PC y Mobile

El módulo permite cargar imágenes diferentes según el dispositivo para garantizar que se vean correctamente en desktop y en mobile.

• Lista de diapositivas DESKTOP: imágenes para computadoras o notebooks. Recomendación de tamaño: 1200 × 400 px aprox., proporción panorámica. Ideal para banners más amplios con detalles visuales.
• Lista de diapositivas MOBILE: imágenes optimizadas para celulares. Recomendación de tamaño: 600 × 800 px aprox., proporción vertical. Importante: no usar el mismo diseño de desktop porque puede cortarse en pantallas chicas.

Subir imágenes al Carrusel de Imágenes – Versión Desktop (PC)

1. Ubicación

Dentro del módulo Carrusel de Imágenes, ir a la sección: Lista de diapositivas DESKTOP.

2. Añadir nueva imagen

• Hacer clic en el ícono “+” (Agregar nueva diapositiva).
• Se abrirá un formulario para cargar la información de la imagen.

3. Completar los campos

• Imagen: subir el banner en formato JPG o PNG. Tamaño recomendado: 1200 × 400 px aprox. (formato horizontal). Peso máximo recomendado: 200 KB.
• Título: nombre interno para identificar la diapositiva (ejemplo: Promoción Verano 2025).
• URL de destino (opcional): si querés que la imagen dirija a una categoría, producto o página específica. Ejemplo: /remeras-verano o /ofertas.
• Orden: número que define en qué posición aparece la imagen dentro del carrusel. Ejemplo: 1 = primera, 2 = segunda, etc.
• Estado: activar o desactivar la diapositiva.

4. Guardar la diapositiva

Una vez completados los campos, hacer clic en Guardar. La nueva imagen aparecerá en la lista de diapositivas DESKTOP.

Subir imágenes al Carrusel de Imágenes – Versión Mobile

1. Ubicación

Dentro del módulo Carrusel de Imágenes, ir a la sección: Lista de diapositivas MOBILE.

Importante: asegurate de que esté seleccionada la pestaña MOBILE antes de subir la imagen. Si cargás en la sección Desktop, la imagen no se verá bien en celulares.

2. Añadir nueva imagen

• Hacer clic en el ícono “+” (Agregar nueva diapositiva) dentro de la lista MOBILE.
• Se abrirá un formulario para completar la información.

3. Completar los campos

• Imagen: subir la versión optimizada para celulares. Tamaño recomendado: 600 × 800 px aprox. (formato vertical). Peso máximo recomendado: 150 KB.
• Título: nombre interno para identificar la diapositiva (ejemplo: Promo Verano Mobile 2025).
• URL de destino (opcional): podés redirigir al usuario a una categoría, producto o página (ejemplo: /ofertas o /nueva-coleccion).
• Orden: definir el lugar de la diapositiva en la secuencia.
• Estado: activar o desactivar la diapositiva.

4. Guardar la diapositiva

Una vez completados los campos, hacer clic en Guardar. La imagen aparecerá en la lista de diapositivas MOBILE.

5. Recomendaciones

• Usar banners diseñados específicamente para pantallas horizontales (desktop) y verticales (mobile); no recortes improvisados.
• Incluir poco texto y siempre un call to action (ejemplo: “Comprá ahora”).
• Revisar cómo se ve en la tienda (Front Office) después de guardar y también en un celular real.
• Mantener coherencia visual entre la versión Desktop y Mobile, aunque las proporciones sean distintas.

Recomendaciones de uso

• Usar un máximo de 3 a 5 imágenes para no saturar al usuario.
• Diseñar banners claros, con poco texto y CTA visible (“Comprá ahora”, “Descubrí más”).
• Mantener peso liviano y tamaño uniforme en todas las imágenes para que el carrusel cargue rápido.
• Cambiar las imágenes según campañas o temporadas (verano/invierno, fechas especiales).