DF Swipe Gallery: przeglądanie produktów gestem swipe

Prezentacja

DF Swipe Gallery zamienia strony kategorii sklepu PrestaShop w pełnoekranową talię kart w stylu Tindera. Odwiedzający odkrywa produkty jeden po drugim: swipe w prawo, aby polubić (lista życzeń), swipe w lewo, aby pominąć, swipe w górę, aby dodać do koszyka. Pasek postępu w stylu stories pokazuje zaawansowanie, a ekran końcowy podsumowuje ulubione produkty sesji. Wszystkie interakcje zasilają dashboard statystyk w panelu administracyjnym.

Instalacja

1. W panelu administracyjnym otwórz Moduły → Menedżer modułów → Zainstaluj moduł.
2. Wgraj plik dfswipegallery.zip i kliknij Zainstaluj.
3. Moduł automatycznie tworzy dwie tabele (df_swipegallery_like i df_swipegallery_stat), rejestruje hooki i dodaje zakładkę Katalog → Swipe Gallery.

Żadna modyfikacja motywu nie jest potrzebna: przycisk uruchamiający i overlay są wstrzykiwane przez hook displayFooterAfter, niezależnie od szablonu.

Konfiguracja

Otwórz Moduły → DF Swipe Gallery → Konfiguruj. Dostępne opcje:

• Enable swipe gallery: globalnie włącza lub wyłącza moduł.
• Mobile devices only: ogranicza pływający przycisk do ekranów poniżej 992 px (włączone domyślnie). Wyłącz, aby udostępnić talię także na desktopie.
• Maximum products per deck: liczba kart na sesję, od 5 do 100 (domyślnie 30).
• Deck order: kolejność kart: pozycja w kategorii, losowa (zalecana do odkrywania) lub najpierw nowości.
• Swipe up adds to cart: włącza super-like: swipe w górę dodaje produkt do koszyka.
• Hide already liked products: wyklucza z nowych talii produkty już polubione przez odwiedzającego.
• Show price on cards: pokazuje lub ukrywa cenę na kartach (automatycznie ukryta w trybie katalogu).
• Launcher button position: pozycja pływającego przycisku: dół po prawej, dół po lewej lub dół na środku.

Użycie po stronie sklepu

Na każdej stronie kategorii pojawia się pływający przycisk „Swipe mode”. Po tapnięciu talia otwiera się na pełnym ekranie:

• Swipe w prawo (lub przycisk serca): like, produkt zapisuje się na liście życzeń.
• Swipe w lewo (lub przycisk krzyżyka): przejście do następnego produktu.
• Swipe w górę (lub przycisk koszyka): dodaje produkt do koszyka.
• Tap na „Zobacz produkt”: otwiera kartę produktu.

Na desktopie strzałki klawiatury odtwarzają gesty (→ like, ← pomiń, ↑ koszyk), a klawisz Escape zamyka talię. Każdemu swipe’owi towarzyszy wibracja haptyczna na zgodnych urządzeniach, a animacja jest wyłączana, gdy odwiedzający ma aktywne prefers-reduced-motion.

Na końcu talii ekran podsumowujący wymienia polubione produkty z ceną i bezpośrednim linkiem do każdej karty, plus przycisk do rozpoczęcia nowej sesji.

Lista życzeń, klienci i goście

Każdy like jest zapisywany w natywnej tabeli modułu, niezależnie od tego, czy pochodzi od zalogowanego klienta, czy od gościa (powiązanego z jego id_guest). Unikalny klucz zapobiega duplikatom.

Jeśli oficjalny moduł blockwishlist jest zainstalowany, a klient zalogowany, produkt jest dodatkowo dodawany do jego domyślnej listy życzeń, tworzonej automatycznie, jeśli jeszcze nie istnieje. Żadna konfiguracja nie jest wymagana: pomost działa po cichu i nigdy nie zgłasza głośnych błędów.

Dodawanie do koszyka gestem swipe

Swipe w górę dodaje produkt po stronie serwera: koszyk jest tworzony w razie potrzeby, minimalna ilość produktu jest respektowana, a znaczek koszyka motywu jest odświeżany przez standardowe zdarzenie prestashop.emit('updateCart'). Produkty niedostępne do zamówienia są odrzucane w kontrolowany sposób z komunikatem.

Statystyki w panelu administracyjnym

Zakładka Katalog → Swipe Gallery prezentuje dashboard:

• Liczniki globalne: obejrzane karty, like’i, pominięcia, dodania do koszyka.
• Globalny współczynnik like’ów: like’i / (like’i + pominięcia).
• Top 20 produktów według like’ów, z wyświetleniami, pominięciami, koszykami i współczynnikiem like’ów per produkt.

Te dane to bezpośredni sygnał merchandisingowy: produkty z wysokim współczynnikiem like’ów zasługują na wyeksponowanie, a masowo pomijane na lepsze zdjęcie lub repozycjonowanie. Statystyki usuniętego produktu są czyszczone automatycznie.

Multisklep i wielojęzyczność

Like’i i statystyki są zapisywane per sklep (id_shop). Teksty talii (Like, Pomiń, Zobacz produkt, ekran podsumowania…) korzystają z natywnego systemu tłumaczeń PrestaShop: przetłumacz je w Międzynarodowy → Tłumaczenia → Tłumaczenia zainstalowanych modułów.

Rozwiązywanie problemów

• Przycisk się nie pojawia: sprawdź, czy moduł jest włączony, czy jesteś na stronie kategorii i czy opcja mobile-only nie jest aktywna, jeśli testujesz na desktopie.
• Talia jest pusta: kategoria nie zawiera żadnego aktywnego widocznego produktu albo wszystkie produkty wyklucza opcja „Hide already liked products”.
• Znaczek koszyka się nie aktualizuje: Twój niestandardowy motyw może nie nasłuchiwać zdarzenia updateCart; dostosuj listener w motywie lub skontaktuj się z pomocą.
• Konflikt wyświetlania: overlay używa z-index 1060; zwiększ go w CSS, jeśli element Twojego motywu wchodzi nad niego.

Changelog

• 1.0.0 (2026-07-16): Wersja początkowa: pełnoekranowa talia swipe, lista życzeń przez swipe w prawo z pomostem blockwishlist, dodawanie do koszyka przez swipe w górę, obsługa gości, dashboard statystyk, pasek postępu w stylu stories, dostępność, zgodność z PrestaShop 8 i 9 oraz multisklepem.