Zamiana Przycisku Dodaj do Koszyka na Listach Produktów PrestaShop: instalacja i konfiguracja

Opis

Moduł zastępuje przycisk Dodaj do koszyka w miniaturach produktów (strony kategorii, wyszukiwarka, strona główna, karuzele, produkty powiązane) przyciskiem prowadzącym do karty produktu. Tam klient wybiera wagę, rozmiar lub format przed dodaniem do koszyka. Definiujesz reguły: których produktów to dotyczy, jaki tekst ma przycisk i czy najniższa cena kombinacji jest pokazywana z przedrostkiem „Od”.

Instalacja

1. W Moduły > Menedżer modułów kliknij Załaduj moduł i wyślij plik dflistingbutton-1.0.0.zip.
2. Moduł tworzy tabele ps_dflb_rule, ps_dflb_rule_lang, ps_dflb_rule_shop, ps_dflb_rule_category i ps_dflb_rule_product oraz dodaje menu Katalog > Przyciski na listach produktów.
3. Tworzona jest wyłączona reguła przykładowa „Przykład: wszystkie produkty z kombinacjami”. Możesz ją włączyć bez zmian lub usunąć.
4. Po utworzeniu lub włączeniu reguły otwórz stronę kategorii w sklepie. Jeśli przycisk się nie pojawia, wyczyść pamięć podręczną w Zaawansowane > Wydajność.

Tworzenie reguły

W Katalog > Przyciski na listach produktów kliknij Dodaj regułę. Formularz ma trzy bloki.

Reguła i zakres

• Nazwa reguły: nazwa wewnętrzna, niewidoczna dla klientów.
• Aktywna: wyłączona reguła jest pomijana.
• Priorytet: gdy kilka reguł pasuje do produktu, wygrywa ta z najniższą liczbą. Wartość domyślna: 10.
• Dotyczy: Wszystkie produkty, Kategorie lub Wybrane produkty.
• Kategorie: drzewo pól wyboru z polem filtra. Przy tym typie reguły wymagana jest co najmniej jedna kategoria.
• Uwzględnij podkategorie: obejmuje również produkty ze wszystkich podkategorii zaznaczonych kategorii.
• Dopasowanie kategorii: Produkt jest w jednej z kategorii (liczą się wszystkie kategorie przypisane do produktu) lub Tylko kategoria domyślna produktu.
• Produkty: dla typu Wybrane produkty, wyszukiwanie po nazwie, indeksie lub ID.
• Warunek: Brak warunku, Produkty z kombinacjami lub Produkty korzystające z grupy atrybutów. Przy warunku Produkty z kombinacjami produkty proste z tej samej kategorii zachowują przycisk Dodaj do koszyka.
• Grupa atrybutów: dla ostatniego warunku, np. Waga lub Rozmiar. Obejmuje tylko produkty, których kombinacja korzysta z tej grupy.
• Wykluczone produkty: te produkty nigdy nie dostają przycisku z tej reguły, niezależnie od zakresu.
• Przypisanie do sklepu: w trybie multisklepu wybierz sklepy, w których działa reguła.

Przycisk

• Tekst przycisku: jeden tekst na język, np. „Zobacz wszystkie warianty wagi”. Pusty język przejmuje pierwszy wpisany tekst.
• Styl: Główny przycisk motywu (klasy btn btn-primary), Przycisk konturowy motywu (btn btn-outline-primary) lub Własne kolory, z kolorem tła, kolorem tekstu i podglądem.
• Ikona: strzałka, opcje, waga, oko lub brak.
• Pełna szerokość: przycisk zajmuje całą szerokość miniatury.
• Dodatkowe klasy CSS: dodawane do przycisku, przydatne do użycia klasy z Twojego motywu.
• Ukryj wybór ilości: ukrywa pole ilości, które niektóre motywy pokazują na listach.

Cena na listach

Ten blok dotyczy tylko produktów z co najmniej dwiema kombinacjami.

• Pokaż najniższą cenę kombinacji: PrestaShop oblicza cenę każdej kombinacji (z podatkami, grupą klienta, cenami specyficznymi i rabatami). Jeśli najniższa różni się od ceny pokazanej przez motyw, zastępuje ją, a przekreślona stara cena i etykieta rabatu miniatury zostają ukryte.
• Dodaj przedrostek „Od”: dodawany przed ceną tylko wtedy, gdy ceny kombinacji się różnią, a wyświetlana cena jest najniższa. Jeśli wyłączysz poprzednią opcję, a kombinacja domyślna nie jest najtańsza, przedrostek się nie pojawia, aby nie podawać błędnej ceny.
• Tekst przedrostka: jeden tekst na język („Od”, „From”, „Desde” itd.).

Przykład: sery i wędliny sprzedawane na wagę

1. Nazwa: Sery na wagę. Dotyczy: Kategorie. Zaznacz Sery i wędliny i zostaw Uwzględnij podkategorie.
2. Warunek: Produkty korzystające z grupy atrybutów, grupa Waga.
3. Tekst przycisku: „Zobacz wszystkie warianty wagi” po polsku, „Ver todas las opciones de peso” po hiszpańsku.
4. Zostaw włączone Pokaż najniższą cenę kombinacji i Od, a potem zapisz.

W kategorii każdy ser sprzedawany po 250 g, 500 g i 1 kg pokazuje „Od” z ceną za 250 g oraz przycisk do swojej karty. Produkt sprzedawany na sztuki, bez kombinacji wagi, zachowuje przycisk Dodaj do koszyka.

Ustawienia ogólne

Strona konfiguracji modułu (przycisk Ustawienia nad listą reguł) zawiera:

• Włącz moduł: wyłącza wszystkie reguły bez ich usuwania.
• Wykrywanie motywu: Automatycznie (zalecane), Zawsze używaj zapytania AJAX lub Tylko hooki. Zobacz następną sekcję.
• Wyłącz również natywny link dodawania do koszyka: czyści po stronie serwera adres URL dodawania do koszyka dla objętych produktów, przez hook actionPresentProductListing. Niektóre motywy pokazują wtedy własny link „Zobacz produkt”: jeśli pojawią się dwa przyciski, pozostaw tę opcję wyłączoną.
• Ukryj przycisk Szybki podgląd: tylko przy objętych produktach.
• Pomijaj niedostępne kombinacje przy najniższej cenie: działa, gdy zarządzanie stanami jest włączone, a produkt nie przyjmuje zamówień przy braku stanu. Jeśli wszystkie kombinacje są niedostępne, brane są pod uwagę wszystkie.

Zgodność z motywem

Jak moduł rozpoznaje produkty

Podczas wyświetlania miniatury moduł działa w hookach displayProductPriceBlock i displayProductListReviews, wywoływanych przez motyw Classic, Hummingbird i większość motywów. Dla każdego objętego produktu wypisuje niewidoczny znacznik. Skrypt modułu znajduje miniaturę ze znacznikiem, ukrywa przycisk koszyka, otaczający go formularz koszyka i wybór ilości, a następnie wstawia nowy przycisk w miejsce ukrytego.

Jeśli motyw nie pokazuje przycisku koszyka na listach (jak motyw Classic), przycisk jest wstawiany zaraz po bloku ceny.

W trybie Automatycznie, jeśli żadna miniatura na stronie nie wywołała tych hooków, skrypt wysyła ID widocznych produktów do kontrolera modułu, który zwraca te objęte regułami (maksymalnie 60 produktów na zapytanie, tylko aktywne i widoczne). Miniatury dodane po filtrze fasetowym, sortowaniu lub nieskończonym przewijaniu są obsługiwane automatycznie.

Selektory CSS

Blok Zgodność z motywem (selektory CSS) w konfiguracji zawiera selektory używane przez skrypt:

• Kontener miniatury produktu: blok obejmujący jeden produkt (.product-miniature, .ajax_block_product itd.).
• Przycisk Dodaj do koszyka: zastępowane elementy (.add-to-cart, [data-button-action="add-to-cart"] itd.).
• Wybór ilości, Cena, Stara cena i rabat, Miejsce wstawienia, Przycisk Szybki podgląd.

Dopisz klasy swojego motywu do listy, oddzielając je przecinkami. Przycisk Przywróć domyślne selektory przywraca pierwotne wartości.

Dostosowanie stylu

Przycisk ma klasę .dflb-btn, a także .dflb-full przy pełnej szerokości i .dflb-style-custom przy własnych kolorach (zmienne --dflb-bg i --dflb-color). Przedrostek ceny ma klasę .dflb-from, a obsłużona miniatura otrzymuje .dflb-has-btn.

Czego moduł nie zmienia

• głównego produktu karty produktu i jego szybkiego podglądu;
• koszyka, procesu zamówienia i konta klienta;
• plików rdzenia i motywu (bez override, bez zmian w szablonach).

Znane ograniczenia

• Moduł zmienia wygląd list produktów. Nie blokuje dodania do koszyka innym sposobem (bezpośredni link, moduł zewnętrzny).
• Najniższa cena i przedrostek są nakładane w przeglądarce. Oryginalny HTML i dane strukturalne motywu zachowują cenę kombinacji domyślnej.
• Powyżej 150 kombinacji jednego produktu do obliczenia najniższej ceny używanych jest tylko pierwszych 150.