Koszyk ma wartość 145 zł, a sklep oferuje darmową dostawę od 200 zł. Klient powinien od razu zobaczyć komunikat: „Do darmowej dostawy brakuje Ci 55 zł”. Bez takiej informacji może zakończyć zakupy, nie wiedząc, że dodanie jeszcze jednego produktu pozwoli mu uniknąć opłaty za przesyłkę.
W sklepie opartym na WooCommerce taki komunikat można wyświetlić za pomocą wtyczki Freetop – Free Shipping Bar for WooCommerce firmy VillaTheme. Narzędzie pokazuje brakującą kwotę i pasek postępu, który zmienia się wraz z zawartością koszyka. Warunek jest jeden: wyświetlane informacje muszą odpowiadać rzeczywistym zasadom naliczania dostawy. Sam pasek nie uruchamia bezpłatnej wysyłki.
Najpierw ustaw próg darmowej dostawy w WooCommerce
Konfigurację trzeba rozpocząć od ustawień wysyłki, nie od instalowania paska. W panelu WordPress przejdź do WooCommerce → Ustawienia → Wysyłka → Strefy wysyłki. Wybierz strefę obsługującą klientów, którym chcesz zaoferować bezpłatną przesyłkę. Dla sklepu działającego na polskim rynku może to być strefa obejmująca całą Polskę.
W edycji strefy dodaj metodę Free Shipping (Darmowa dostawa). Następnie w jej ustawieniach wybierz warunek „A minimum order amount” i wpisz minimalną wartość zamówienia, np. 200 zł. Zapisz zmiany.
Przy takiej konfiguracji obliczenie jest proste:
- Próg darmowej dostawy: 200 zł.
- Wartość produktów w koszyku: 145 zł.
- Kwota brakująca do progu: 55 zł.
Przykład zakłada, że 145 zł jest kwotą produktów uwzględnianą przez WooCommerce przy sprawdzaniu progu. Koszt płatnej dostawy nie powiększa wartości zakupów uprawniającej do darmowej wysyłki. Jeżeli klient kupuje produkty za 145 zł i płaci dodatkowo 15 zł za kuriera, do progu nadal brakuje 55 zł, a nie 40 zł.
Istotne jest również ustawienie podatków. Standardowa metoda Free Shipping sprawdza wartość produktów według sposobu wyświetlania cen w koszyku WooCommerce: z podatkiem VAT albo bez niego. Dlatego w sklepie B2C, który pokazuje ceny brutto, trzeba upewnić się, że próg 200 zł jest porównywany z właściwą wartością brutto. Nie należy automatycznie utożsamiać progu z końcową sumą „Do zapłaty”, która obejmuje również inne składniki zamówienia.
Osobnej decyzji wymagają kupony rabatowe. WooCommerce udostępnia następujące warunki uruchomienia darmowej dostawy:
- Bez dodatkowych wymagań.
- Po zastosowaniu ważnego kuponu uprawniającego do darmowej wysyłki.
- Po osiągnięciu minimalnej kwoty zamówienia.
- Po spełnieniu warunku kwotowego LUB zastosowaniu kuponu.
- Po spełnieniu warunku kwotowego I zastosowaniu kuponu.
Przy warunku kwotowym dostępna jest też opcja „Apply minimum order rule before coupon discount”. Jeżeli pozostaje wyłączona, rabat pomniejsza wartość uwzględnianą przy sprawdzaniu progu. Gdy zostanie zaznaczona, WooCommerce sprawdza wartość produktów przed rabatem.
Przykład: klient ma w koszyku produkty za 205 zł i używa kuponu obniżającego ich wartość o 20 zł. Przy naliczaniu progu po rabacie pozostaje 185 zł, więc do bezpłatnej wysyłki brakuje 15 zł. Przy naliczaniu przed rabatem klient już spełnia warunek 200 zł. Zwykły kupon obniżający cenę nie zastępuje przy tym kuponu z włączonym uprawnieniem do darmowej wysyłki.
Trzeba też sprawdzić kolejność stref wysyłkowych. WooCommerce przypisuje klienta do pierwszej pasującej strefy. Jeśli sklep ma odrębną strefę dla wybranych kodów pocztowych i inną dla całej Polski, bardziej szczegółowa powinna znajdować się wyżej. Inaczej klient może zostać przypisany do strefy z niewłaściwymi warunkami.
To szczególnie ważne przed poznaniem adresu dostawy. WooCommerce może korzystać z domyślnej lokalizacji klienta, a Freetop z wybranej strefy odniesienia. Kwota pokazana na początku zakupów nie zawsze będzie więc ostateczna. Po wpisaniu adresu może zmienić się zarówno próg, jak i dostępność samej darmowej dostawy. Jeżeli zasady znacząco różnią się między regionami, lepiej pokazywać komunikat warunkowy niż obiecywać wszystkim bezpłatną przesyłkę od jednej kwoty.
Konfiguracja Freetop – jak wyświetlić brakującą kwotę
W panelu WordPress otwórz Wtyczki → Dodaj nową, wyszukaj „Freetop – Free Shipping Bar for WooCommerce” autorstwa VillaTheme, zainstaluj i aktywuj wtyczkę.
Dokumentacja VillaTheme opisuje panel ustawień jako Woo Free Shipping / Woo Free Shipping Bar. Podstawowa konfiguracja odbywa się w sekcji General, gdzie należy włączyć działanie paska za pomocą opcji „Enable” i wskazać odpowiednią strefę w polu „Free Shipping Zone”. Wtyczka powinna odwoływać się do wcześniej skonfigurowanej metody darmowej dostawy WooCommerce.
Następnie przejdź do karty Message, w której przygotowuje się komunikaty dla klientów. Najważniejszy jest tekst wyświetlany po dodaniu produktów do koszyka.
Freetop obsługuje między innymi następujące znaczniki:
{min_amount}– minimalna wartość zamówienia uprawniająca do darmowej dostawy.{missing_amount}– kwota pozostała do osiągnięcia progu.{cart_amount}– bieżąca wartość koszyka.{total_amounts}– wartość zakupów używana w komunikatach wtyczki.{checkout_page}– odnośnik do finalizacji zamówienia.{shopping}– odnośnik do strony sklepu.
Znaczniki należy zachować dokładnie w podanej postaci, razem z nawiasami klamrowymi. Wtyczka zastępuje je odpowiednimi wartościami podczas wyświetlania komunikatu. Nie trzeba ręcznie dopisywać kwoty ani tworzyć osobnego komunikatu dla każdego progu.
Przykładowe ustawienia tekstów:
Announce system:
„Darmowa dostawa przy zakupach od {min_amount}”.
Message purchased:
„Do darmowej dostawy brakuje Ci {missing_amount}. Sprawdź, co jeszcze możesz dodać do koszyka”.
Message success:
„Próg darmowej dostawy został osiągnięty! Przejdź do zamówienia i wybierz bezpłatną wysyłkę”.
Dla koszyka o wartości 145 zł i progu 200 zł drugi komunikat powinien wyświetlić brakujące 55 zł. Po dodaniu produktu za 60 zł suma wzrośnie do 205 zł i powinien pojawić się komunikat o osiągnięciu progu. Ostateczna dostępność metody nadal zależy od strefy i pozostałych warunków WooCommerce.
Nie należy dopisywać po {missing_amount} oznaczenia „zł” bez sprawdzenia podglądu. Znacznik może już zwracać sformatowaną kwotę z walutą, a wtedy na pasku pojawi się nieestetyczne „55 zł zł”.
Bezpłatna wersja Freetop pozwala wyświetlać główny pasek informacyjny, standardowy pasek postępu oraz konfigurować podstawowe komunikaty i wygląd. Pasek może znajdować się na górze lub na dole strony. Działa również w układzie mobilnym.
Nie wszystkie opcje opisane w dokumentacji VillaTheme należą jednak do wersji Free. Wersja Pro rozszerza możliwości między innymi o mniejsze paski postępu w koszyku, minikoszyku i przy finalizacji zamówienia, wykrywanie kraju klienta na podstawie IP, dodatkowe ustawienia wyglądu oraz zaawansowane reguły widoczności.
W typowym sklepie, w którym wystarczy jeden komunikat informujący o brakującej kwocie, wersja bezpłatna jest rozsądnym punktem wyjścia. Pro ma sens przede wszystkim wtedy, gdy pasek musi być osadzony w konkretnym miejscu interfejsu, np. wewnątrz wysuwanego minikoszyka, albo sklep obsługuje kilka krajów z różnymi progami dostawy.
Samo wykrywanie IP nie rozwiązuje natomiast problemu progów zależnych od polskich kodów pocztowych. Mechanizm opisany przez VillaTheme rozpoznaje lokalizację na poziomie kraju, nie konkretnego rejonu dostaw. W takim przypadku decydujący pozostaje adres podany przez klienta.
Nie przesadzaj też z widocznością komunikatu. Pasek przyklejony do górnej części ekranu bywa irytujący, jeśli zasłania menu, wyszukiwarkę albo przycisk dodawania produktu do koszyka. Lepiej mieć nieco mniej eksponowaną informację niż utrudnić samo dokonanie zakupu.
Jak sprawdzić, czy pasek poprawnie reaguje na zmiany w koszyku
Najczęstszy błąd nie polega na źle dobranym kolorze paska, lecz na rozbieżności między komunikatem a faktycznie dostępnymi metodami wysyłki. Klient widzi informację o darmowej dostawie, przechodzi do płatności i odkrywa, że WooCommerce nadal nalicza opłatę.
Dlatego przed uruchomieniem rozwiązania należy przeprowadzić testy na rzeczywistym koszyku, najlepiej w środowisku testowym sklepu.
1. Sprawdź wartości bezpośrednio przy progu. Przy limicie 200 zł przygotuj koszyki o wartościach 199,99 zł, 200,00 zł i 200,01 zł. Przy pierwszej kwocie do progu brakuje 0,01 zł. Dwie kolejne powinny spełniać warunek kwotowy, jeśli nie ma dodatkowego wymogu kuponu. Porównaj komunikat paska z metodami wysyłki dostępnymi przy składaniu zamówienia.
2. Zastosuj i usuń kupon. Przy koszyku za 205 zł sprawdź działanie rabatu 20 zł. Osobno przetestuj kupon z włączoną opcją „Allow free shipping”, jeśli sklep stosuje warunek AND lub OR. Pasek nie powinien informować, że klientowi brakuje pieniędzy do darmowej dostawy, gdy prawidłowy kupon już ją aktywował. Przy warunku AND nie wolno natomiast ogłaszać sukcesu na podstawie samej wartości koszyka.
3. Zmień zawartość koszyka. Dodaj produkt, zwiększ jego liczbę, a następnie go usuń. Sprawdź także przyciski „Dodaj do koszyka” działające bez przeładowywania strony, czyli przez AJAX. Komunikat musi odpowiadać aktualnej zawartości koszyka, również po cofnięciu wcześniej osiągniętego progu.
4. Sprawdź inną lokalizację dostawy. Jeśli sklep stosuje różne progi dla Polski i innych krajów albo wybranych regionów, zmień adres podczas finalizacji zamówienia. Porównaj pasek z metodą dostawy przy nowym adresie. Weryfikację wykonaj również w prywatnym oknie przeglądarki, bez zapisanych wcześniej danych klienta.
5. Przetestuj urządzenia mobilne, cache i bloki WooCommerce. Sprawdź widok telefonu o szerokości około 360–390 px. Następnie zweryfikuj koszyk i stronę zamówienia wykorzystujące aktualne bloki Cart i Checkout, a nie tylko klasyczne szablony WooCommerce. Historia aktualizacji Freetop obejmuje poprawki związane z blokami, ale nie oznacza to gwarancji poprawnego działania z każdym motywem i zestawem rozszerzeń.
Jeżeli pasek pokazuje nieaktualną wartość, sprawdź mechanizmy cache: WP Rocket, LiteSpeed Cache, cache serwera oraz ewentualne buforowanie przez CDN. Dane zależne od sesji klienta nie powinny być udostępniane jako jeden wspólny, zapisany komunikat. W pierwszej kolejności wyczyść cache i przetestuj aktualizację koszyka bez buforowania, zamiast od razu zmieniać próg dostawy.
Sama techniczna poprawność nie oznacza jeszcze, że pasek poprawi rentowność sklepu. Przykładowo, jeżeli klient dokłada produkt za 55 zł, na którym sklep zarabia 12 zł marży kwotowej po uwzględnieniu kosztu towaru, a darmowa przesyłka kosztuje sprzedawcę 16 zł, dodatkowy zakup nie pokrywa całego kosztu transportu. To 4 zł różnicy jeszcze przed uwzględnieniem dodatkowych kosztów obsługi.
Dlatego próg darmowej dostawy powinien wynikać z marż, przeciętnej wartości koszyka i kosztów realizacji zamówienia, a nie wyłącznie z chęci podniesienia liczby produktów kupowanych przez klienta. Warto obserwować średnią wartość zamówienia, udział koszyków osiągających próg i marżę po uwzględnieniu dostawy. Samo wdrożenie paska nie gwarantuje wzrostu sprzedaży.
FAQ – najczęstsze pytania
Czy Freetop automatycznie uruchamia darmową dostawę?
Nie. Wtyczka wyświetla informacje i postęp do progu. Darmową dostawę trzeba wcześniej skonfigurować jako metodę wysyłki w odpowiedniej strefie WooCommerce.
Jak ustawić komunikat „Brakuje 55 zł do darmowej dostawy”?
W karcie „Message” użyj znacznika {missing_amount}. Przy progu 200 zł i kwalifikującej się wartości koszyka 145 zł wtyczka powinna wyświetlić brakujące 55 zł.
Czy kupon rabatowy zmienia kwotę brakującą do darmowej dostawy?
Tak, jeżeli WooCommerce sprawdza minimalną wartość po rabacie. Po włączeniu opcji naliczania progu przed rabatem zniżka nie obniża wartości używanej do tego warunku.
Dlaczego po wpisaniu adresu zmienia się próg darmowej dostawy?
Ponieważ WooCommerce dobiera strefę wysyłkową na podstawie adresu klienta. W różnych strefach mogą obowiązywać inne metody i minimalne wartości zamówienia.
Czy darmowa wersja Freetop wystarczy do wyświetlania brakującej kwoty?
Tak. Wersja Free obsługuje podstawowe komunikaty i główny pasek postępu. Zaawansowane umiejscowienie małych pasków oraz część dodatkowych ustawień wymagają Pro.
Dlaczego pasek nie aktualizuje się po dodaniu produktu?
Najpierw sprawdź cache, sposób dodawania produktów przez AJAX oraz zgodność z używanym motywem i blokami koszyka. Samo odświeżenie strony może ukryć problem, który nadal występuje podczas zakupów bez przeładowywania widoku.
Co zrobić w pierwszej kolejności?
Otwórz ustawienia metody Darmowa dostawa
w WooCommerce i sprawdź strefę, próg oraz sposób uwzględniania rabatów. Następnie utwórz koszyk za 145 zł przy progu 200 zł i potwierdź, że po dodaniu produktów za 55 zł faktycznie pojawia się bezpłatna metoda wysyłki. Dopiero kiedy ten test przejdzie poprawnie, włącz komunikat Freetop. Najpierw poprawna reguła dostawy, później pasek informacyjny.
