PrestaShop Design & Navigation

360°-Produktansicht PrestaShop — Spin-Viewer aus Bildsequenz

Interaktive 360°-Produktansicht aus einer Bildsequenz: Dreh-Rotation per Maus und Touch, automatische Wiedergabe, Vollbild und Lazy Loading.

Lassen Sie Ihre Kunden das Produkt volle 360° drehen: ein flüssiger Spin-Viewer, aus einer einfachen Bildsequenz aufgebaut, ohne Ihr Theme anzutasten.

Auf einen Blick
  • Dreh-Rotation per Maus und Touch mit Trägheit, aus einer 360°-Bildsequenz aufgebaut
  • Automatische Wiedergabe, Vollbild, Bildzähler und Tastaturnavigation
  • Lazy Loading: Frames werden geladen, sobald der Viewer in den Bildschirm gelangt
  • Frame-Verwaltung per Drag-and-drop: Mehrfach-Upload, Neuanordnung, Vorschau, automatische Verkleinerung
  • PrestaShop 8 & 9, kein Override, eine Sequenz pro Produkt pro Shop verwaltet, Vanilla JS ohne jQuery
PrestaShop 8 & 9 Ziehen & Touch Autoplay Vollbild Lazy Loading
  • 30 Tage Rückgaberecht
  • 12 Monate Updates
  • 24-h-Support
www.datafirefly.com/de/
360°-Spin-Viewer, der ein Produkt auf einer PrestaShop-Produktseite dreht
v1.0.0 · aktualisiert 2026-07-16
Was es leistet

Die Kurzfassung.

01

Eine Drehung, die auf die Geste reagiert

Der Viewer beruht auf Pointer Events: Besucher ziehen das Produkt mit Maus oder Finger, um es zu drehen, mit einstellbarer Empfindlichkeit und natürlicher Trägheit am Ende der Bewegung. Die Drehung bleibt auf Smartphone und Desktop gleichermaßen flüssig, ohne Abhängigkeit von jQuery oder einer Drittanbieter-Bibliothek.

02

Automatische Wiedergabe und Vollbild

Die Sequenz kann von selbst in eine kontinuierliche Drehung starten, mit konfigurierbarer Geschwindigkeit, Wiedergabe-/Pause-Schaltfläche und Bildzähler. Der Vollbildmodus vergrößert das Produkt für eine detaillierte Betrachtung, und die Pfeiltasten sowie die Leertaste steuern die Drehung. Die Autoplay-Einstellung kann global sein oder Sequenz für Sequenz überschrieben werden.

03

Reibungslose Frame-Verwaltung

Im Back-Office verknüpfen Sie eine Sequenz über eine Sofortsuche mit einem Produkt und legen dann alle Ihre Bilder auf einmal in der Ablagezone ab. Sie werden nach Dateiname sortiert, in Stapeln mit Fortschrittsbalken hochgeladen, per Drag-and-drop neu anordenbar und einzeln löschbar. Eine Vorschau spielt die Drehung vor der Veröffentlichung ab.

04

Auf Tempo der Produktseite ausgelegt

Die Bilder der Sequenz werden erst geladen, wenn der Viewer den sichtbaren Bereich erreicht, dank eines Intersection Observers, mit einem Fortschrittsbalken während des Vorladens. Zu breite Frames werden beim Upload automatisch gemäß einer konfigurierbaren maximalen Breite verkleinert, für ein kontrolliertes Gewicht und eine scharfe Darstellung.

Die ausführliche Fassung

Alles, was Sie wissen sollten bevor Sie installieren.

Ein detaillierter Blick darauf, wie 360°-Produktansicht PrestaShop — Spin-Viewer aus Bildsequenz funktioniert, warum wir es so gebaut haben und der Gedanke hinter den Funktionen oben.

§ 01

Die 360°-Ansicht ohne Studio und ohne proprietäres Format

Kein 3D-Scanner und kein exotisches Dateiformat nötig: Eine 360°-Ansicht ist nur eine Reihe von Fotos, die rund um das Produkt aufgenommen werden, in der Regel auf einem Drehteller. Sie fotografieren 24, 36, 48 oder 72 gleichmäßig beabstandete Bilder im selben Ausschnitt und bei gleicher Beleuchtung, benennen sie der Reihe nach, und der Viewer rekonstruiert die Drehung. Das Modul übernimmt Import, Sortierung, Verkleinerung und Anzeige — Sie behalten die Kontrolle über die Aufnahme.

§ 02

Eine natürliche Interaktion auf jedem Bildschirm

Auf Pointer Events aufgebaut, behandelt der Viewer Maus und Touch gleich. Der Besucher greift das Produkt und dreht es in die gewünschte Richtung; am Ende der Bewegung verlängert eine Trägheit die Drehung und bremst sie dann allmählich ab. Die Empfindlichkeit lässt sich an die Anzahl der Frames Ihrer Sequenz anpassen. Über die Tastatur bewegen die Pfeiltasten Bild für Bild weiter, und die Leertaste startet oder pausiert die automatische Wiedergabe.

§ 03

Standardmäßig schnell, dezent für Ihr Theme

Bilder werden erst heruntergeladen, wenn der Viewer auf dem Bildschirm sichtbar wird, was das anfängliche Laden der Produktseite nicht belastet. Ein Fortschrittsbalken informiert den Besucher während des Vorladens, danach steht die Drehung bereit. Beim Upload wird jeder Frame, der breiter als das definierte Limit ist, serverseitig verkleinert, für ein kontrolliertes Gewicht ohne Schärfeverlust. Das Modul überschreibt kein Template: Es fügt sich über einen Anzeige-Hook ein, den Sie wählen.

§ 04

Ein auf Tempo ausgelegtes Back-Office

Über den eigenen Katalog-Tab erstellen Sie eine Sequenz, finden das Produkt über eine Sofortsuche nach Name, Referenz oder ID und legen dann alle Ihre Bilder in einer einzigen Geste ab. Sie werden nach Dateiname sortiert, um die Aufnahmereihenfolge zu wahren, in Stapeln mit Fortschrittsbalken hochgeladen und lassen sich anschließend per Drag-and-drop neu anordnen und einzeln löschen. Eine Vorschau-Schaltfläche spielt die Drehung direkt in der Verwaltung ab, bevor Sie veröffentlichen.