Un cliente que selecciona el color verde y sigue viendo las fotos del modelo rojo no tiene ninguna razón para confiar en lo que está pidiendo. El comportamiento esperado es evidente, pero PrestaShop no lo produce por sí solo.
Cómo asocia PrestaShop imágenes y variantes
El mecanismo existe de forma nativa. En la pestaña de combinaciones de un producto, cada combinación puede asociarse a una o varias imágenes de la ficha.
Dos límites explican por qué esto no funciona como se espera en muchas tiendas.
La asociación es puramente manual, imagen por imagen y combinación por combinación. En un producto con quince variantes y doce fotos, el ejercicio es largo y nadie lo hace en todo el catálogo.
Sobre todo, la asociación no determina el comportamiento de la galería. Según el tema, seleccionar una variante puede filtrar las imágenes, cambiar solo una o no hacer nada. Lo decide el tema, no la asociación.
Los tres comportamientos posibles
No cambiar nada. Todas las imágenes siguen visibles sea cual sea la selección. Es el comportamiento más frecuente y el peor: el cliente debe adivinar cuáles corresponden a su elección.
Cambiar la imagen principal. La foto de portada pasa a la de la variante, las miniaturas no cambian. Comportamiento intermedio, aceptable en productos con pocas fotos.
Filtrar la galería. Solo quedan visibles las imágenes asociadas a la variante seleccionada. Es el comportamiento que esperan los clientes y el que reduce las devoluciones.
Un cuarto comportamiento merece considerarse: filtrar dejando al final de la galería las imágenes comunes a todas las variantes, del tipo esquema técnico o foto de detalle del material.
Galería de Producto PrestaShop — Zoom HD, Pantalla Completa y VariantesGalería de producto de nueva generación: zoom HD, miniaturas verticales, pantalla completa móvil con pellizco y filtrado de imágenes por combinación.€69,00
El caso de las variantes sin imagen
Situación sistemática en cuanto el catálogo crece: se crea un color nuevo antes de hacer las fotos.
El filtrado estricto produce entonces una galería vacía, mucho peor que la ausencia de filtrado. El comportamiento de repliegue debe ser explícito: si ninguna imagen está asociada a la variante seleccionada, la galería muestra todas las imágenes del producto.
Prevea también un control en el back-office que liste las combinaciones sin imagen asociada. Es una tarea de mantenimiento de cinco minutos al mes que evita semanas de fichas degradadas.
La trampa de los atributos múltiples
Punto de diseño que decide la viabilidad del ejercicio.
Un producto con cinco colores y seis tallas tiene treinta combinaciones. Sin embargo, las fotos solo varían según el color: la talla M y la talla L del modelo verde usan los mismos visuales.
Asociar las imágenes a las treinta combinaciones equivale a repetir cinco veces el mismo trabajo por color. El enfoque correcto consiste en asociar las imágenes al atributo visual en lugar de a la combinación completa, y dejar que el sistema resuelva.
En concreto, la regla útil es: identifique el atributo o los atributos que cambian el aspecto, normalmente el color y a veces el material, y asocie solo sobre esos.
La coherencia en las demás ubicaciones
La galería de la ficha no es el único sitio afectado, y es lo que más se olvida.
En el listado de categoría, si ofrece muestras de color al pasar el ratón, la imagen de la miniatura debe seguir el color señalado.
En la vista rápida, el comportamiento debe ser idéntico al de la ficha, si no el cliente detecta una incoherencia entre ambas vistas.
En el carrito y los emails de pedido, la imagen debe ser la de la variante pedida, no la de portada del producto. Es un detalle que evita reclamaciones del tipo «esto no es lo que pedí».
El rendimiento
Filtrar las imágenes en el navegador supone haberlas cargado todas. En un producto con cuarenta fotos repartidas en ocho colores, eso representa un peso importante para un cliente que solo verá cinco.
Dos soluciones. La carga diferida de las imágenes no mostradas, que solo las descarga cuando pasan a ser visibles. O la carga bajo demanda al cambiar de variante, que ahorra más pero añade una latencia perceptible.
En la mayoría de catálogos, la carga diferida basta y es más sencilla de mantener.
El zoom y la pantalla completa
Último punto de coherencia: la vista ampliada debe filtrarse igual que la galería. Un cliente que abre la pantalla completa en un color y desplaza hasta ver todos los demás pierde la confianza que el filtrado acababa de construir.
El módulo Galería de Producto para PrestaShop cubre esta cadena en PrestaShop 8 y 9: filtrado de las imágenes según la variante seleccionada con repliegue cuando no hay imagen asociada, coherencia entre galería, zoom y pantalla completa, y carga diferida de los visuales no mostrados.