Korzystanie z listy życzeń

Ten przewodnik prowadzi od świeżej instalacji do działającej listy życzeń: przycisk w pętlach, miejsce dla klientów na podgląd zapisanych pozycji oraz listy gości, które trwają do logowania.

1. Włącz i wybierz umiejscowienia

Otwórz menu Shortlist, potwierdź, że Włącz listę życzeń jest aktywne, i wybierz umiejscowienia — pętla sklepu, karta produktu, zakładka Moje konto. Większość sklepów włącza wszystkie trzy. Jeśli chcesz, by wylogowani klienci zachowali listę, pozostaw Pozwól gościom włączone; wyłącz, aby kierować ich do logowania.

2. Ustaw etykiety i podpowiedź wariantu

Ustaw etykiety przycisku dodawania i usuwania w języku swojego sklepu. Ustaw też podpowiedź wariantu — na produktach z wariantami przycisk pozostaje nieaktywny z tą podpowiedzią, dopóki klient nie wybierze opcji, więc zapisuje dokładny wariant, a nie ogólny produkt.

3. Daj liście życzeń miejsce

Klienci potrzebują miejsca na podgląd swojej listy. Masz dwie opcje, które działają razem:

• Zakładka Moje konto → Lista życzeń (włącz umiejscowienie), opcjonalnie z licznikiem pozycji na żywo obok etykiety menu.
• Dedykowana strona listy życzeń — wybierz istniejącą stronę z listy rozwijanej lub kliknij Utwórz stronę listy życzeń, aby opublikować stronę z shortcode’em [shortlist] jednym kliknięciem.

4. Sprawdź na sklepie

1. Otwórz Sklep i kliknij Dodaj do listy życzeń na prostym produkcie — przycisk przełącza się w stan usuwania, a zmiana jest ogłaszana przez aria-live. Każdy przycisk tego produktu na stronie pozostaje zsynchronizowany.
2. Otwórz produkt z wariantami — przycisk pokazuje podpowiedź i pozostaje nieaktywny, dopóki nie wybierzesz opcji, a potem zapisuje ten wariant.
3. Otwórz zakładkę Moje konto lub dedykowaną stronę — zapisane pozycje pojawiają się w siatce z włączonymi przez Ciebie kolumnami.

5. Przetestuj scalanie list gości

Jeśli goście są dozwoleni, wyloguj się, zapisz produkt, a potem zaloguj ponownie. Lista gościa, przechowywana w ciasteczku, scala się z kontem automatycznie — bez ręcznego importu dla klientów.

Shortcode i blok

Pokaż listę bieżącego klienta w dowolnym miejscu shortcode’em:

[shortlist]

Blok Shortlist Wishlist daje ten sam wynik renderowany po stronie serwera w edytorze bloków. Jeśli Twoja dedykowana strona już zawiera [shortlist], wyłącz Pokaż listę na stronie, aby siatka nie pojawiła się dwa razy.

Jak zachowuje się przełącznik

Przycisk przełącza przynależność przez AJAX bez przeładowania strony. Zalogowani klienci są identyfikowani przez ID użytkownika; goście przez ciasteczko sesji. Przełącznik to prawdziwy <button> z aria-pressed, więc jego stan jest jasny dla technologii wspomagających, a wszystkie przyciski tego samego produktu aktualizują się razem po przełączeniu.

Uwagi o wydajności i dostępności

Własny front-end Shortlist to czysty JavaScript, odroczony i ładowany w stopce — bez jQuery. Przycisk przełącznika rezerwuje miejsce, więc przejście między stanem dodawania a usuwania nigdy nie przebudowuje strony: zero Cumulative Layout Shift. Zmiany listy życzeń i licznik Moje konto są ogłaszane czytnikom ekranu i aktualizują się na żywo, a pusta lista pokazuje przyjazny stan z linkiem Przeglądaj produkty zamiast pustego panelu.