PrestaShop Design & Navigation

Vue Produit 360° PrestaShop — Visionneuse Spin par Séquence d’Images

Vue produit 360° interactive par séquence d'images : rotation au drag souris et tactile, lecture automatique, plein écran et lazy loading.

Laissez vos clients tourner le produit à 360° : une visionneuse spin fluide, montée depuis une simple séquence d'images, sans toucher à votre thème.

En un coup d'œil
  • Rotation au drag souris et tactile avec inertie, montée depuis une séquence d'images 360°
  • Lecture automatique, plein écran, compteur d'images et navigation au clavier
  • Lazy loading : les frames se chargent quand la visionneuse entre dans l'écran
  • Gestion des frames en glisser-déposer : import multiple, réordonnancement, aperçu, redimensionnement auto
  • PrestaShop 8 & 9, aucun override, une séquence par produit gérée par boutique, vanilla JS sans jQuery
PrestaShop 8 & 9 Drag & tactile Autoplay Plein écran Lazy loading
  • Remboursement 30 jours
  • 12 mois de mises à jour
  • Support 24h
www.datafirefly.com/
Visionneuse 360° faisant pivoter un produit sur une fiche PrestaShop
v1.0.0 · mis à jour 2026-07-16
Ce que ça fait

La version courte.

01

Une rotation qui répond au geste

La visionneuse s'appuie sur les Pointer Events : le visiteur fait glisser le produit à la souris ou au doigt pour le faire tourner, avec une sensibilité réglable et une inertie naturelle en fin de geste. La rotation reste fluide sur mobile comme sur ordinateur, sans dépendance à jQuery ni à une bibliothèque tierce.

02

Lecture automatique et plein écran

La séquence peut démarrer seule en rotation continue, à une vitesse configurable, avec bouton lecture / pause et compteur d'images. Le mode plein écran agrandit le produit pour une inspection détaillée, et les flèches du clavier comme la barre d'espace pilotent la rotation. Le réglage de lecture automatique peut être global ou surchargé séquence par séquence.

03

Gestion des frames sans friction

Dans le back-office, vous rattachez une séquence à un produit via une recherche instantanée, puis déposez toutes vos images d'un coup dans la zone de dépôt. Elles sont triées par nom de fichier, importées par lots avec barre de progression, réordonnables en glisser-déposer et supprimables à l'unité. Un aperçu rejoue la rotation avant publication.

04

Pensé pour la vitesse de la fiche produit

Les images de la séquence ne sont chargées que lorsque la visionneuse entre dans la zone visible, grâce à un observateur d'intersection, avec une barre de progression pendant le préchargement. Les frames trop larges sont redimensionnées automatiquement à l'import selon une largeur maximale configurable, pour un poids maîtrisé et un rendu net.

La version longue

Tout ce que vous voudriez savoir avant d'installer.

Un regard détaillé sur le fonctionnement de Vue Produit 360° PrestaShop — Visionneuse Spin par Séquence d'Images, pourquoi nous l'avons conçu ainsi, et la réflexion derrière les fonctionnalités ci-dessus.

§ 01

La vue 360° sans studio ni format propriétaire

Pas besoin d'un scanner 3D ni d'un format de fichier exotique : une vue 360° n'est qu'une série de photos prises tout autour du produit, généralement sur un plateau tournant. Vous shootez 24, 36, 48 ou 72 images régulièrement espacées, dans le même cadrage et le même éclairage, vous les nommez dans l'ordre, et la visionneuse reconstitue la rotation. Le module gère l'import, le tri, le redimensionnement et l'affichage — vous gardez le contrôle sur la prise de vue.

§ 02

Une interaction naturelle sur tous les écrans

Construite sur les Pointer Events, la visionneuse traite de la même façon la souris et le tactile. Le visiteur attrape le produit et le fait tourner dans le sens qu'il veut ; à la fin du geste, une inertie prolonge la rotation puis la ralentit progressivement. La sensibilité se règle pour coller au nombre de frames de votre séquence. Au clavier, les flèches avancent image par image et la barre d'espace lance ou met en pause la lecture automatique.

§ 03

Rapide par défaut, discrète pour votre thème

Les images ne se téléchargent que lorsque la visionneuse devient visible à l'écran, ce qui évite d'alourdir le chargement initial de la fiche produit. Une barre de progression informe le visiteur pendant le préchargement, puis la rotation devient disponible. À l'import, chaque frame plus large que la limite définie est redimensionnée côté serveur, pour un poids maîtrisé sans dégrader la netteté. Le module n'écrase aucun template : il s'insère via un hook d'affichage que vous choisissez.

§ 04

Un back-office pensé pour aller vite

Depuis l'onglet dédié du catalogue, vous créez une séquence, retrouvez le produit par une recherche instantanée sur son nom, sa référence ou son identifiant, puis déposez toutes vos images d'un seul geste. Elles sont triées par nom de fichier pour respecter l'ordre de prise de vue, importées par lots avec une barre de progression, puis réordonnables en glisser-déposer et supprimables à l'unité. Un bouton d'aperçu rejoue la rotation directement dans l'administration avant que vous ne publiiez.