DF Swipe Gallery — Produktnavigation per Swipe

Überblick

DF Swipe Gallery verwandelt die Kategorieseiten Ihres PrestaShop-Shops in ein Vollbild-Kartendeck im Tinder-Stil. Der Besucher entdeckt die Produkte einzeln: Swipe nach rechts zum Liken (Wunschliste), nach links zum Überspringen, nach oben für den Warenkorb. Eine Fortschrittsleiste im Stories-Stil zeigt den Fortschritt an, ein Abschlussbildschirm fasst die Favoriten der Session zusammen. Alle Interaktionen fließen in ein Analytics-Dashboard im Back Office.

Installation

1. Öffnen Sie im Back Office Module → Modul-Manager → Modul hochladen.
2. Laden Sie dfswipegallery.zip hoch und klicken Sie auf Installieren.
3. Das Modul erstellt automatisch seine beiden Tabellen (df_swipegallery_like und df_swipegallery_stat), registriert seine Hooks und fügt den Tab Katalog → Swipe Gallery hinzu.

Es ist keine Theme-Anpassung nötig: Start-Button und Overlay werden über den Hook displayFooterAfter eingebunden, unabhängig von Ihrem Template.

Konfiguration

Öffnen Sie Module → DF Swipe Gallery → Konfigurieren. Verfügbare Optionen:

• Enable swipe gallery — aktiviert oder deaktiviert das Modul global.
• Mobile devices only — beschränkt den schwebenden Button auf Bildschirme unter 992 px (standardmäßig aktiviert). Deaktivieren Sie die Option, um das Deck auch am Desktop anzubieten.
• Maximum products per deck — Karten pro Session, von 5 bis 100 (Standard: 30).
• Deck order — Kartenreihenfolge: Kategorieposition, zufällig (für die Entdeckung empfohlen) oder Neuheiten zuerst.
• Swipe up adds to cart — aktiviert den Super-Like: ein Swipe nach oben legt das Produkt in den Warenkorb.
• Hide already liked products — schließt bereits gelikte Produkte aus neuen Decks aus.
• Show price on cards — zeigt oder verbirgt den Preis auf den Karten (im Katalogmodus automatisch ausgeblendet).
• Launcher button position — Position des schwebenden Buttons: unten rechts, unten links oder unten mittig.

Nutzung im Shop

Auf jeder Kategorieseite erscheint ein schwebender „Swipe mode“-Button. Beim Antippen öffnet sich das Deck im Vollbild:

• Swipe nach rechts (oder Herz-Button) — Like: das Produkt wird auf die Wunschliste gesetzt.
• Swipe nach links (oder Kreuz-Button) — springt zum nächsten Produkt.
• Swipe nach oben (oder Warenkorb-Button) — legt das Produkt in den Warenkorb.
• Tap auf „Produkt ansehen“ — öffnet die Produktseite.

Am Desktop bilden die Pfeiltasten die Gesten ab (→ Like, ← überspringen, ↑ Warenkorb), Escape schließt das Deck. Auf kompatiblen Geräten begleitet haptisches Feedback jeden Swipe, und die Animation wird deaktiviert, wenn der Besucher prefers-reduced-motion aktiviert hat.

Am Ende des Decks listet ein Abschlussbildschirm die gelikten Produkte mit Preis und direktem Link zu jeder Produktseite auf, plus einen Button für eine neue Session.

Wunschliste, Kunden und Gäste

Jeder Like wird in der eigenen Tabelle des Moduls gespeichert, egal ob er von einem eingeloggten Kunden oder einem Gast stammt (zugeordnet über dessen id_guest). Ein Unique Key verhindert Duplikate.

Ist das offizielle Modul blockwishlist installiert und der Kunde eingeloggt, wird das Produkt zusätzlich seiner Standard-Wunschliste hinzugefügt — die automatisch erstellt wird, falls sie noch nicht existiert. Es ist keine Konfiguration nötig: die Anbindung arbeitet still und schlägt nie laut fehl.

Warenkorb per Swipe

Der Swipe nach oben fügt das Produkt serverseitig hinzu: der Warenkorb wird bei Bedarf angelegt, die Mindestmenge des Produkts wird berücksichtigt und das Warenkorb-Badge des Themes wird über das Standard-Event prestashop.emit('updateCart') aktualisiert. Nicht bestellbare Produkte werden sauber mit einer Meldung abgewiesen.

Back-Office-Analytics

Der Tab Katalog → Swipe Gallery zeigt das Dashboard:

• Globale Zähler: angesehene Karten, Likes, Skips, Warenkorb-Zugänge.
• Globale Like-Rate: Likes / (Likes + Skips).
• Top 20 der Produkte nach Likes, mit Aufrufen, Skips, Warenkörben und Like-Rate pro Produkt.

Diese Daten sind ein direktes Merchandising-Signal: Produkte mit hoher Like-Rate verdienen mehr Sichtbarkeit, stark übersprungene Produkte brauchen vielleicht ein besseres Foto oder eine Neupositionierung. Die Statistiken eines gelöschten Produkts werden automatisch bereinigt.

Multishop und Mehrsprachigkeit

Likes und Statistiken werden pro Shop erfasst (id_shop). Die Texte des Decks (Like, Überspringen, Produkt ansehen, Abschlussbildschirm …) laufen über das native Übersetzungssystem von PrestaShop: übersetzen Sie sie unter International → Übersetzungen → Übersetzungen installierter Module.

Fehlerbehebung

• Der Button erscheint nicht — prüfen Sie, ob das Modul aktiviert ist, ob Sie sich auf einer Kategorieseite befinden und ob die Nur-Mobil-Option deaktiviert ist, wenn Sie am Desktop testen.
• Das Deck ist leer — die Kategorie enthält kein aktives sichtbares Produkt, oder alle Produkte werden durch die Option „Hide already liked products“ ausgeschlossen.
• Das Warenkorb-Badge aktualisiert sich nicht — Ihr individuelles Theme hört möglicherweise nicht auf das Event updateCart; passen Sie den Listener in Ihrem Theme an oder kontaktieren Sie den Support.
• Darstellungskonflikt — das Overlay nutzt einen z-index von 1060; erhöhen Sie ihn per CSS, falls ein Theme-Element darüber liegt.

Changelog

• 1.0.0 (2026-07-16) — Erstveröffentlichung: Vollbild-Swipe-Deck, Wunschliste per Swipe nach rechts mit blockwishlist-Anbindung, Warenkorb per Swipe nach oben, Gast-Unterstützung, Analytics-Dashboard, Stories-Fortschrittsleiste, Barrierefreiheit, Kompatibilität mit PrestaShop 8 & 9 und Multishop.