Koszty dostawy na karcie produktu w Shoper — jak je pokazać krok po kroku (Storefront i RWD)

Adrian Zblewski · Founder GrowCommerce · Platynowy Partner Shoper

Klient, który nie widzi kosztu dostawy przy produkcie, często dowiaduje się o nim dopiero w koszyku. W sklepie Shoper pokażesz koszt dostawy na karcie produktu: w szablonie Storefront modułem Koszty dostawy, a w starszym szablonie RWD opcją w ustawieniach skórki. Poniżej oba sposoby krok po kroku i to, jak połączyć tę informację z progiem darmowej dostawy.

Jak ustalić same stawki i próg darmowej dostawy, opisujemy w przewodniku „Koszty dostawy i darmowa dostawa w sklepie Shoper”.

Dlaczego koszt dostawy powinien być widoczny przy produkcie

Koszt dostawy to jedna z pierwszych rzeczy, o które klient pyta przed zakupem. Gdy widzi go dopiero w koszyku albo w zamówieniu, część osób rezygnuje. Informacja na karcie produktu odpowiada na to pytanie wcześniej, bez szukania regulaminu i cennika dostaw.

Więcej o tym, gdzie sklep traci klientów między kartą produktu a zamówieniem, piszemy w tekście „Lejek sprzedażowy w sklepie Shoper”.

Storefront: moduł Koszty dostawy krok po kroku

W szablonie Storefront koszt dostawy to osobny moduł. Umieścisz go w dowolnym miejscu karty produktu, na przykład pod ceną albo obok przycisku dodania do koszyka. Moduł pokazuje najtańszą formę dostawy dla danego produktu. Po kliknięciu w nią klient widzi w nowym oknie wszystkie pozostałe formy dostawy z cenami.

Krok 1: otwórz edycję szablonu

W panelu administracyjnym przejdź do Wygląd i treści > Wygląd sklepu > Edycja szablonu graficznego. W starszej wersji panelu ta sama opcja nazywa się Obecny szablon graficzny.

Krok 2: uruchom edytor układu

Kliknij Edytuj układ i styl szablonu. Otworzy się edytor, w którym przeciągasz moduły na poszczególnych stronach sklepu.

Krok 3: dodaj moduł na stronie produktu

Przejdź do edycji strony Produkt, odszukaj moduł Koszty dostawy i przeciągnij go w wybrane miejsce. Najlepiej blisko ceny i przycisku zakupu, bo tam klient podejmuje decyzję. O układzie treści na karcie produktu piszemy w poradniku „Karta produktu: zakładki i układ treści”.

Krok 4: zapisz i opublikuj

Kliknij Zapisz i opublikuj zmiany w układzie. Potem otwórz kilka kart produktów na komputerze i na telefonie i sprawdź, czy moduł pokazuje właściwą najtańszą stawkę. Jeśli dopiero przenosisz sklep na Storefront, zobacz „Migracja z RWD na Storefront”.

Starszy szablon RWD: opcja Koszt dostawy

W szablonach w starszej technologii koszt dostawy na karcie produktu wyświetla się dynamicznie od wersji oprogramowania 5.20.1. Wystarczy włączyć jedną opcję w ustawieniach skórki.

Przejdź do Wygląd i treści > Wygląd sklepu > Bieżąca skórka i kliknij Szczegóły produktu. W sekcji Informacje o produkcie zaznacz opcję Koszt dostawy i zapisz zmiany.

Lista dostaw pojawi się pod opisem produktu albo w zakładce, jeśli karta ma widok z zakładkami. Formy dostawy są posortowane od najtańszej do najdroższej, a odbiór osobisty jest zawsze na końcu listy. Sklep liczy koszt dla produktu lub jego wariantu na podstawie dostępnych form dostawy. Same stawki zmieniasz w edycji danej formy dostawy.

Na co uważać

Najważniejsza pułapka: minimalny koszt dostawy nie zawiera kosztów płatności. Jeśli klient wybierze pobranie, dopłatę zobaczy dopiero przy zamówieniu. Napisz o tym krótko przy formach płatności albo w opisie dostawy, żeby nie zaskoczyć klienta w ostatnim kroku. Zaskoczenie kosztami to częsty powód porzuconych koszyków, o czym piszemy w tekście „Porzucone koszyki w Shoper”.

Połącz koszt dostawy z progiem darmowej dostawy

Koszt dostawy na karcie produktu mówi klientowi, ile zapłaci. Pasek darmowej dostawy w koszyku pokazuje, ile brakuje, żeby nie płacić wcale. GrowCart wyświetla w koszyku Shoper pasek z kwotą brakującą do progu i produkty do dokupienia jednym kliknięciem. Za wyższy próg możesz dać prezent albo kod rabatowy.

Konfigurację paska opisujemy w poradniku „Pasek darmowej dostawy w Shoper”. Jeśli chcesz pokazać też, do której godziny zamówić, żeby paczka wyszła dziś, użyj scenariusza godziny wysyłki w GrowTimer.

Checklista: koszt dostawy na karcie produktu

• Wiem, czy sklep używa szablonu Storefront, czy RWD.
• Moduł Koszty dostawy stoi blisko ceny i przycisku zakupu.
• Zmiany w układzie są zapisane i opublikowane.
• W RWD opcja Koszt dostawy jest włączona w Szczegółach produktu.
• Najtańsza stawka zgadza się z cennikiem dostaw dla tej kategorii i wagi.
• Sprawdziłem kartę produktu na telefonie.
• Klient wie o dopłacie za pobranie przed zamówieniem.
• Pasek darmowej dostawy w koszyku pokazuje, ile brakuje do progu.

Najczęstsze pytania

Jak pokazać koszt dostawy na karcie produktu w Shoperze?

W szablonie Storefront dodaj moduł Koszty dostawy na stronie Produkt w edytorze układu i opublikuj zmiany. W szablonie RWD włącz opcję Koszt dostawy w Wygląd i treści, Wygląd sklepu, Bieżąca skórka, Szczegóły produktu.

Jaką dostawę pokazuje moduł Koszty dostawy?

Moduł pokazuje najtańszą formę dostawy dostępną dla produktu. Po kliknięciu klient widzi wszystkie pozostałe formy dostawy z cenami.

Czy koszt dostawy na karcie produktu zawiera opłatę za pobranie?

Nie. Minimalny koszt dostawy nie zawiera kosztów płatności, więc dopłata za pobranie pojawi się dopiero przy zamówieniu.

Gdzie jest odbiór osobisty na liście dostaw?

W szablonie RWD lista jest posortowana od najtańszej do najdroższej formy dostawy, a odbiór osobisty jest zawsze na końcu.

Jak zmienić koszt dostawy widoczny przy produkcie?

Koszt pochodzi z ustawień form dostawy. Zmienisz go w edycji danej formy dostawy w panelu sklepu, a karta produktu pokaże nową stawkę.

Adrian ZblewskiFounder GrowCommerce — Platynowy Partner ShoperFounder GrowCommerce — Platynowego Partnera Shoper z 8-letnim doświadczeniem i ponad 1020 wdrożeniami. GrowCommerce tworzy szablony rodziny Modern (Modern 3.0 Storefront), aplikacje GrowX i GrowMail — e-mail marketing dla Shopera.Wszystkie wpisy autora