PrestaShop Diseño & Navegación

Vista de Producto 360° PrestaShop — Visor Spin por Secuencia de Imágenes

Vista de producto 360° interactiva a partir de una secuencia de imágenes: rotación por arrastre de ratón y táctil, reproducción automática, pantalla completa y lazy loading.

Deja que tus clientes giren el producto 360° completos: un visor spin fluido, construido a partir de una simple secuencia de imágenes, sin tocar tu tema.

De un vistazo
  • Rotación por arrastre de ratón y táctil con inercia, construida a partir de una secuencia de imágenes 360°
  • Reproducción automática, pantalla completa, contador de imágenes y navegación con teclado
  • Lazy loading: los fotogramas se cargan cuando el visor entra en la pantalla
  • Gestión de fotogramas por arrastrar y soltar: subida múltiple, reordenación, vista previa, redimensionado automático
  • PrestaShop 8 & 9, sin override, una secuencia por producto gestionada por tienda, vanilla JS sin jQuery
PrestaShop 8 & 9 Arrastre y táctil Reproducción autom. Pantalla completa Lazy loading
  • Reembolso de 30 días
  • 12 meses de actualizaciones
  • Soporte 24h
www.datafirefly.com/es/
Visor 360° que gira un producto en una ficha de PrestaShop
v1.0.0 · actualizado 2026-07-16
Qué hace

La versión corta.

01

Una rotación que responde al gesto

El visor se basa en los Pointer Events: el visitante arrastra el producto con el ratón o el dedo para girarlo, con sensibilidad ajustable e inercia natural al final del gesto. La rotación se mantiene fluida tanto en móvil como en escritorio, sin dependencia de jQuery ni de ninguna biblioteca de terceros.

02

Reproducción automática y pantalla completa

La secuencia puede empezar a girar sola en rotación continua, a una velocidad configurable, con botón de reproducción / pausa y contador de imágenes. El modo de pantalla completa amplía el producto para una inspección detallada, y las flechas del teclado y la barra espaciadora controlan la rotación. El ajuste de reproducción automática puede ser global o sobrescribirse secuencia por secuencia.

03

Gestión de fotogramas sin fricción

En el back office, asocias una secuencia a un producto mediante una búsqueda instantánea, luego sueltas todas tus imágenes de una vez en la zona de depósito. Se ordenan por nombre de archivo, se suben por lotes con barra de progreso, se reordenan arrastrando y soltando y se eliminan una a una. Una vista previa reproduce la rotación antes de publicar.

04

Pensado para la velocidad de la ficha de producto

Las imágenes de la secuencia solo se cargan cuando el visor entra en la zona visible, gracias a un observador de intersección, con una barra de progreso durante la precarga. Los fotogramas demasiado anchos se redimensionan automáticamente al importar según una anchura máxima configurable, para un peso controlado y un render nítido.

La versión larga

Todo lo que querrías saber antes de instalar.

Una mirada detallada a cómo funciona Vista de Producto 360° PrestaShop — Visor Spin por Secuencia de Imágenes, por qué lo construimos así y la lógica detrás de las características anteriores.

§ 01

La vista 360° sin estudio ni formato propietario

No hace falta un escáner 3D ni un formato de archivo exótico: una vista 360° no es más que una serie de fotos tomadas alrededor del producto, normalmente en un plato giratorio. Tomas 24, 36, 48 o 72 imágenes igualmente espaciadas, con el mismo encuadre e iluminación, las nombras en orden y el visor reconstruye la rotación. El módulo se encarga de la importación, el orden, el redimensionado y la visualización — tú mantienes el control sobre la sesión de fotos.

§ 02

Una interacción natural en cualquier pantalla

Construido sobre los Pointer Events, el visor trata el ratón y el táctil de la misma forma. El visitante agarra el producto y lo gira hacia donde quiere; al final del gesto, una inercia prolonga la rotación y luego la ralentiza progresivamente. La sensibilidad se ajusta para adaptarse al número de fotogramas de tu secuencia. Con el teclado, las flechas avanzan fotograma a fotograma y la barra espaciadora inicia o pausa la reproducción automática.

§ 03

Rápido por defecto, discreto para tu tema

Las imágenes solo se descargan cuando el visor se vuelve visible en pantalla, lo que evita sobrecargar la carga inicial de la ficha de producto. Una barra de progreso informa al visitante durante la precarga, y después la rotación queda disponible. Al importar, cada fotograma más ancho que el límite definido se redimensiona en el servidor, para un peso controlado sin degradar la nitidez. El módulo no sobrescribe ninguna plantilla: se inserta mediante un hook de visualización que tú eliges.

§ 04

Un back office pensado para ir rápido

Desde la pestaña dedicada del catálogo, creas una secuencia, encuentras el producto mediante una búsqueda instantánea por su nombre, referencia o identificador, y luego sueltas todas tus imágenes de un solo gesto. Se ordenan por nombre de archivo para respetar el orden de la toma, se suben por lotes con una barra de progreso, y luego se reordenan arrastrando y soltando y se eliminan una a una. Un botón de vista previa reproduce la rotación directamente en la administración antes de que publiques.