Zaufane samouczki WordPress, kiedy ich najbardziej potrzebujesz.
Przewodnik dla początkujących po WordPressie
WPB Cup
25 milionów+
Witryny korzystające z naszych wtyczek
16+
Lata doświadczenia z WordPressem
3000+
Samouczki WordPress od ekspertów

Jak łatwo dodać wysuwany boczny koszyk w WooCommerce

Jednym z największych wyzwań, z jakimi borykają się właściciele sklepów WooCommerce, jest porzucanie koszyka.

Klienci przeglądają Twoje produkty, dodają przedmioty do koszyka, a następnie znikają, gdy zostaną przekierowani na stronę koszyka. Dzieje się to częściej niż myślisz.

Prosty sposób na poprawę tego doświadczenia to dodanie wysuwanego koszyka bocznego.

Dzięki temu klienci pozostają na tej samej stronie, jednocześnie pozwalając im przeglądać koszyk w małym panelu, który wysuwa się z boku. Jest to szybsze, mniej inwazyjne i usprawnia proces zakupu.

Widzieliśmy wielu właścicieli sklepów używających go do usprawnienia procesu realizacji zakupu i zwiększenia sprzedaży.

W tym przewodniku pokażemy Ci, jak dodać przesuwający się boczny koszyk do Twojego sklepu WooCommerce za pomocą łatwych metod, które nie wymagają umiejętności technicznych.

Jak dodać wysuwany koszyk boczny w WooCommerce

💡Szybka odpowiedź: Jak dodać wysuwany koszyk boczny

Najprostszym sposobem na dodanie wysuwanego koszyka bocznego do Twojego sklepu WooCommerce jest użycie darmowej wtyczki. Proces jest prosty i nie wymaga żadnego kodu.

  1. Zainstaluj i aktywuj darmową wtyczkę Sliding WooCommerce Cart By FunnelKit.
  2. Z pulpitu WordPress przejdź do FunnelKit » Koszyk.
  3. Dostosuj wygląd i zachowanie koszyka za pomocą dostępnych ustawień.
  4. Kliknij przełącznik „Włącz koszyk” u góry strony, aby Twój nowy wysuwany koszyk stał się aktywny.

Dlaczego warto dodać przesuwany boczny koszyk w WooCommerce?

Dodanie wysuwanego koszyka bocznego to jeden z najlepszych sposobów na zmniejszenie porzuceń koszyka i poprawę doświadczenia klienta w Twoim sklepie WooCommerce.

Umożliwiając kupującym przeglądanie swojego koszyka bez przekierowywania na osobną stronę, usuwasz przeszkody z procesu zakupu i ułatwiasz im dokończenie transakcji.

Wysuwany koszyk boczny to panel, który pojawia się zazwyczaj po prawej stronie ekranu, gdy klient dodaje produkt do swojego koszyka. Mogą go również otworzyć w dowolnym momencie, klikając ikonę koszyka.

Przykład przesuwnego koszyka w WooCommerce

Z tego panelu kupujący mogą często dodawać lub usuwać produkty, stosować kody kuponów i widzieć, jak ich suma częściowa aktualizuje się w czasie rzeczywistym.

Dzięki temu pozostają na stronie produktu lub sklepu, zachęcając ich do dalszych zakupów lub przejścia bezpośrednio do kasy.

Mając to na uwadze, przyjrzyjmy się, jak możesz dodać przesuwany boczny koszyk w WooCommerce. Skorzystaj z poniższych szybkich linków, aby przejść bezpośrednio do wybranej metody.

Zacznijmy!

Metoda 1. Jak dodać przesuwany boczny koszyk w WooCommerce za pomocą darmowej wtyczki

Najszybszym i najłatwiejszym sposobem na stworzenie przesuwnego bocznego koszyka jest użycie Przesuwnego koszyka WooCommerce od FunnelKit. Ta darmowa wtyczka pozwala dodać ikonę koszyka do Twojego sklepu internetowego.

Klienci mogą kliknąć przycisk, aby otworzyć przesuwany koszyk boczny.

Przykład przesuwnego bocznego koszyka w WooCommerce

Możesz zmienić kolory koszyka, obramowania, przyciski, komunikaty i inne.

Istnieje mnóstwo opcji, dzięki czemu możesz stworzyć koszyk, który idealnie pasuje do każdej motywu WordPress.

Wysuwany koszyk boczny WooCommerce

Ponadto nasze testy wykazały, że możesz wyświetlać przycisk koszyka na całej swojej stronie, ograniczyć go tylko do stron WooCommerce lub dodać przycisk do określonych stron i wpisów za pomocą krótkiego kodu.

Krok 1: Zainstaluj i aktywuj wtyczkę FunnelKit

Najpierw musisz zainstalować i aktywować wtyczkę Sliding WooCommerce Cart By FunnelKit. Jeśli potrzebujesz pomocy, zapoznaj się z naszym przewodnikiem jak zainstalować wtyczkę WordPress.

Krok 2: Skonfiguruj podstawowe ustawienia koszyka

Po aktywacji przejdź do FunnelKit » Koszyk. Zobaczysz podgląd przesuwnego koszyka bocznego po prawej stronie ekranu.

Podgląd koszyka FunnelKit

Teraz możesz dostosować koszyk, aby lepiej odpowiadał Twoim potrzebom.

Na początek możesz zdecydować, czy chcesz wyświetlać ikonę koszyka na całej swojej witrynie, czy tylko na stronach WooCommerce.

Jeśli wybierzesz „Cała witryna”, kupujący będą mogli otworzyć przesuwany koszyk z każdej strony, więc jest to dobry wybór dla rynków internetowych i sklepów.

Dodawanie ikony koszyka do Twojej strony WordPress

Jednak Twoja witryna może zawierać wiele treści niezwiązanych z e-commerce. Na przykład, możesz prowadzić popularnego bloga WordPress, ale używać WooCommerce do sprzedaży gadżetów swoim fanom.

Wyświetlanie przycisku koszyka na każdym poście na blogu może być irytujące. W takim przypadku możesz zaznaczyć przycisk radiowy „Strony WooCommerce”.

Dodawanie ikony koszyka do stron WooCommerce

Inną opcją jest „Brak”, która całkowicie ukrywa ikonę koszyka.

Jeśli wybierzesz opcję „Brak”, możesz dodać ikonę do dowolnej strony, wpisu lub obszaru gotowego na widżety za pomocą krótkiego kodu. Możesz również dodać ikonę do swojego menu nawigacyjnego.

Pokażemy Ci, jak to zrobić później w poście, ale możesz wybrać „Brak”, jeśli planujesz dodać ikonę koszyka ręcznie.

Po podjęciu tej decyzji wybierz „Dół po lewej” lub „Dół po prawej” w zależności od tego, gdzie chcesz wyświetlić przycisk koszyka. Tutaj może pomóc sprawdzenie, jak przycisk będzie wyglądał w Twoim sklepie internetowym, wybierając „Podgląd na stronie”.

Podgląd koszyka przesuwnego FunnelKit

Domyślnie wtyczka wyświetla „Przejrzyj swój koszyk” na górze wysuwanego koszyka bocznego.

Możesz zastąpić tę wiadomość własną, wpisując ją w polu „Nagłówek koszyka”.

Dodawanie nagłówka do koszyka Twojego sklepu internetowego

Jeśli nie chcesz wyświetlać nagłówka, po prostu pozostaw pole puste.

Domyślnie FunnelKit wyświetla ikonę koszyka, zanim klient doda produkty do swojego koszyka.

Jeśli wolisz, możesz ukryć ikonę, dopóki odwiedzający nie zacznie dodawać produktów. Po prostu kliknij przełącznik „Ukryj ikonę koszyka”, aby zmienił kolor na niebieski.

Ukrywanie koszyka WooCommerce

To wszystko, czego potrzebujesz, aby stworzyć podstawowy, przesuwany koszyk boczny, ale istnieją ustawienia, które mogą przynieść Ci jeszcze więcej sprzedaży. Mając to na uwadze, przyjrzyjmy się bardziej zaawansowanym funkcjom FunnelKit.

Krok 3: Włącz kupony w przesuwającym się koszyku

Kupony to świetny sposób na zwiększenie sprzedaży i budowanie lojalności klientów.

Przesuwany koszyk pozwala klientom na bezpośrednie wpisywanie kodów kuponów. Ta funkcja działa ze standardowymi kuponami, które można tworzyć w WooCommerce. Jest również kompatybilna z wtyczkami takimi jak Advanced Coupons, jeśli chcesz tworzyć bardziej złożone oferty.

Dodawanie kodów kuponów do wysuwanego bocznego koszyka w WooCommerce

Kiedy klient kliknie „Zastosuj”, przesuwany koszyk pokaże, ile zaoszczędził.

Pokazując klientom zniżkę od razu, możesz zmniejszyć wskaźnik porzucania koszyka i zachęcić ich do dodania większej liczby produktów do koszyka.

Jak akceptować kody kuponów w wysuwanym koszyku bocznym

Możesz tworzyć te kody, korzystając z wbudowanej funkcji kuponów WooCommerce lub z wtyczki do kodów kuponów.

Aby dodać pole kuponu, kliknij przełącznik „Włącz pole kuponu”, który zmieni go z szarego (wyłączony) na niebieski (włączony).

Akceptowanie kuponów w Twoim sklepie internetowym

Następnie możesz przełączać się między układami „Minimalny” i „Rozszerzony”.

Po prostu zaznacz odpowiednie pole obok opcji „Wyświetl”.

Wybieranie różnych układów strony przesuwnego koszyka

Zminimalizowany zajmuje mniej miejsca, dzięki czemu mniej rozprasza, ale klienci będą musieli rozwinąć sekcję kuponów, zanim będą mogli wpisać jakiekolwiek kody.

Na poniższym obrazku widać zminimalizowany układ:

Przykład zminimalizowanego układu kodów kuponów i rabatów

Po wybraniu układu możesz zmienić tekst, którego FunnelKit używa dla nagłówka pola kuponu, tekstu zastępczego rabatu i tekstu przycisku.

Krok 4: Dostosuj podsumowanie koszyka

Podsumowanie koszyka pokazuje klientom, ile będzie kosztował ich zakup. Pomaga to zmniejszyć wskaźnik porzucania koszyka, ponieważ przy kasie nie ma nieprzyjemnych niespodzianek.

Dostosowywanie podsumowania koszyka WooCommerce

Z tego powodu zalecamy włączenie przełącznika „Pokaż sumę”.

Jednak jeśli chcesz uprościć boczny koszyk, możesz kliknąć, aby wyłączyć przełącznik „Pokaż sumę”.

Wyświetlanie sumy częściowej na stronie koszyka Twojego sklepu eCommerce

Możesz również pokazać wszelkie oszczędności, do których klient się zakwalifikował, w tym rabaty z zastosowanych kuponów.

W ten sposób możesz wykorzystać FOMO do zwiększenia konwersji, zwłaszcza jeśli oszczędności są ograniczone czasowo.

Na przykład możesz zaplanować kupony w WooCommerce, aby klient mógł ich używać tylko przez ograniczony czas.

Wyświetlanie oszczędności i rabatów na Twojej stronie e-Commerce

Jeśli wolisz usunąć te informacje z przesuwnego koszyka bocznego, możesz wyłączyć przełącznik „Wyświetl oszczędności”.

Możesz również zastąpić „Tekst oszczędności” i „Tekst wysyłki” własnymi niestandardowymi komunikatami.

Dostosowywanie wiadomości na ekranie wysuwnego koszyka bocznego
Krok 5: Dostosuj wezwanie do działania koszyka

Wysuwany koszyk boczny ma domyślny przycisk realizacji zakupu, ale możesz dostosować ten przycisk wezwania do działania, aby uzyskać więcej konwersji. Aby rozpocząć, możesz dodać ikonę realizacji zakupu za pomocą przełącznika „Włącz ikonę przycisku”.

Ustawienia koszyka FunnelKit

Może to być szczególnie przydatne, jeśli tworzysz wielojęzyczną stronę WordPress.

Możesz również dodać cenę koszyka do przycisku płatności, korzystając z przełącznika „Włącz cenę koszyka”.

Dostosowywanie przycisku realizacji zamówienia w WooCommerce

Pomoże to klientom śledzić koszt koszyka, zwłaszcza jeśli usunąłeś sumę częściową z sekcji podsumowania koszyka.

Domyślnie FunnelKit dodaje link „Kontynuuj zakupy” na dole wysuwanego bocznego koszyka. Możesz zastąpić ten tekst własnym komunikatem, wpisując go w polu „Tekst kontynuacji zakupów”.

Dostosowywanie tekstu „Kontynuuj zakupy”

Następnie wybierz, czy ten link po prostu zamknie panel koszyka bocznego, czy przekieruje klienta na stronę Twojego sklepu WooCommerce.

Większość klientów będzie oczekiwać opuszczenia wysuwanego koszyka, dlatego zalecamy wybranie przycisku „Zamknij koszyk boczny”.

Zamykanie wysuwanego koszyka bocznego w WooCommerce

Jeśli wybierzesz opcję „Przekieruj do sklepu”, możesz chcieć zmienić tekst „Tekst kontynuuj zakupy”, aby było jasne, co się stanie, gdy klienci klikną link.

Krok 6: Utwórz niestandardowy ekran pustego koszyka

Możliwe jest ukrycie przycisku koszyka, dopóki kupujący nie doda co najmniej jednego produktu do swojego koszyka, postępując zgodnie z powyższym procesem. Jednak jeśli nie ukryjesz przycisku, klienci czasami mogą zobaczyć pusty ekran koszyka.

Ekran „Pusty koszyk”

Możesz zmienić tytuł, opis i tekst przycisku, korzystając z ustawień w sekcji „Pusty koszyk”. Zazwyczaj będziesz chciał zachęcić klientów do rozpoczęcia zakupów. Na przykład możesz wspomnieć o oferowanych przez Ciebie rzeczach, takich jak darmowa wysyłka lub gwarancja zwrotu pieniędzy.

Możesz nawet podarować kupującemu kod kuponu, taki jak rabat kup jeden, drugi gratis.

Dodanie CTA do ekranu „pustego koszyka”.

Możesz również wybrać, czy kliknięcie przycisku „Kup teraz” przeniesie klienta na stronę sklepu WooCommerce, czy po prostu zamknie panel boczny.

Zalecamy wybranie opcji „Przekieruj do sklepu”, ponieważ ułatwi to klientom dodawanie produktów do koszyka.

Włączanie opcji „przekieruj do sklepu” wtyczki FunnelKit WordPress
Krok 7: Dodaj ikonę koszyka w dowolnym miejscu na swojej stronie

Jeśli chcesz mieć większą kontrolę nad tym, gdzie pojawia się ikona koszyka, możesz dodać ją do dowolnej strony, wpisu lub obszaru gotowego na widżety za pomocą krótkiego kodu (krótki fragment kodu w nawiasach kwadratowych, który dodaje dynamiczną zawartość do Twojej strony).

Możesz również dodać ją do menu swojej strony. Jest to świetna opcja, jeśli wybrałeś „Brak” w ustawieniach „Widoczność ikony” zgodnie z opisanym powyżej procesem.

Ustawienia „widoczności ikony” w FunnelKit

Jeśli wybrałeś „Strony WooCommerce”, istnieje również sposób na dodanie ikony koszyka do innych ważnych obszarów Twojej witryny. Na przykład możesz dodać ikonę do swojej niestandardowej strony głównej lub formularza kontaktowego.

Na początek możesz wybrać opcję „Menu koszyka”, a następnie włączyć przełącznik „Włącz menu koszyka”.

Włączanie ikony koszyka w WordPressie

Teraz możesz zmienić wygląd ikony, wybierając jeden z szablonów ikon i decydując, czy chcesz wyświetlać liczbę produktów i łączną kwotę koszyka jako część ikony. Te informacje mogą pomóc odwiedzającym śledzić swoje koszyki.

Możesz również zmienić rozmiar ikon i tekstu. W miarę wprowadzania zmian, mała podgląd będzie się automatycznie aktualizować, dzięki czemu możesz wypróbować różne ustawienia, aby zobaczyć, co wygląda najlepiej.

Jak utworzyć niestandardową ikonę koszyka dla WordPressa

Gdy będziesz zadowolony z wyglądu ikony przesuwnego koszyka bocznego, kliknij przycisk „Zapisz”.

Teraz możesz dodać ikonę do dowolnej strony, wpisu lub obszaru gotowego na widżety, używając kodu obok opcji „Osadź krótki kod”.

Jak dodać ikonę koszyka za pomocą kodu krótkiego

Aby uzyskać więcej informacji na temat umieszczania skróconego kodu, zapoznaj się z naszym przewodnikiem jak dodać skrócony kod w WordPress.

Inną opcją jest dodanie ikony do menu nawigacyjnego Twojej witryny. W ten sposób wysuwany boczny koszyk jest zawsze łatwo dostępny, nie odwracając uwagi od głównej zawartości strony.

Jak dodać ikonę koszyka do menu nawigacyjnego

Aby to zrobić, otwórz menu rozwijane „Dodaj do menu” i wybierz menu, którego chcesz użyć.

Następnie po prostu kliknij przycisk „Zapisz”.

Dodawanie ikony koszyka do menu WordPress

Teraz, jeśli odwiedzisz swoją stronę WordPress, zobaczysz ikonę koszyka w menu nawigacyjnym.

Krok 8: Dodaj własne kolory i branding

Możesz chcieć zmienić kolory przesuwnego bocznego koszyka, aby lepiej pasowały do Twojego motywu WooCommerce lub brandingu.

Aby zmienić kolor tekstu, kolor przycisku, kolor linku i inne, kliknij „Stylizacja”.

Dodawanie własnego brandingu do koszyka WooCommerce

A aby zmienić dowolny z domyślnych kolorów, po prostu kliknij. Otworzy się okno, w którym możesz wypróbować różne kolory.

Na przykład na poniższym obrazku dostosowujemy obramowanie.

Jak dodać niestandardowe kolory do sklepu WooCommerce

Inną opcją jest wpisanie kodu szesnastkowego w polu „Hex”. Jest to idealne rozwiązanie, jeśli masz już na myśli konkretny odcień.

Jeśli nie wiesz, jakiego kodu szesnastkowego użyć, pomocne może być skorzystanie z witryny takiej jak HTML Color Codes. Tutaj możesz przeglądać różne kolory, a następnie uzyskać kod, który możesz po prostu wkleić do wtyczki FunnelKit.

Jeśli nadal nie masz pewności, jakich kolorów użyć, zapoznaj się z naszym przewodnikiem na temat jak wybrać idealną paletę kolorów dla Twojej witryny WordPress.

Pamiętaj, że ostateczny wygląd może się różnić w zależności od Twojego motywu WordPress, ale możesz użyć tych opcji stylizacji, aby uzyskać idealne dopasowanie.

Krok 9: Utwórz responsywny przesuwany boczny koszyk

Zgodnie z naszym raportem o użytkowaniu Internetu, ponad 90% globalnej populacji internetowej korzysta z urządzeń mobilnych, aby połączyć się z siecią. Mając to na uwadze, upewnij się, że wysuwany boczny koszyk wygląda równie dobrze na smartfonach i tabletach, jak i na komputerach stacjonarnych.

Tutaj może pomóc zmiana szerokości koszyka, aby nie wypełniał całkowicie małego ekranu urządzenia mobilnego. Aby to zrobić, otwórz zakładkę „Stylizacja”, a następnie poszukaj opcji „Szerokość podglądu koszyka na urządzeniach mobilnych”.

Utwórz responsywną stronę koszyka mobilnego

Możesz spróbować wpisać różne wartości w to pole. Jeśli zmienisz domyślne ustawienia, dobrym pomysłem jest sprawdzenie wersji mobilnej swojej witryny WordPress z poziomu pulpitu, aby upewnić się, że jesteś zadowolony z wyników.

Będąc na tym ekranie, możesz również zmienić szerokość wysuwanego koszyka bocznego na komputerze. Aby to zrobić, po prostu zmień liczbę w polu „Szerokość podglądu koszyka na komputerze”.

Krok 10: Opublikuj swój przesuwany boczny koszyk

Gdy będziesz zadowolony z konfiguracji przesuwnego bocznego koszyka, czas go uruchomić. Po prostu kliknij suwak „Włącz koszyk”, aby zmienił kolor na niebieski.

Jak włączyć wysuwany koszyk w Twoim sklepie WooCommerce

Teraz, jeśli odwiedzisz swój sklep internetowy, zobaczysz przesuwający się koszyk na żywo.

Jeśli chcesz usunąć przesuwany koszyk boczny w dowolnym momencie, wróć do FunnelKit » Koszyk w panelu administracyjnym WordPress. Następnie kliknij, aby wyłączyć suwak „Włącz koszyk”.

Jak wyłączyć wysuwany koszyk w Twoim sklepie WooCommerce

Metoda 2. Dodaj zaawansowany przesuwany koszyk boczny (z ofertami dodatkowymi, krzyżowymi i nagrodami)

Jeśli chcesz zwiększyć średnią wartość zamówienia w swoim sklepie, możesz dodać potężne funkcje upsell, cross-selling i nagród do przesuwnego koszyka. Te zaawansowane opcje są dostępne w wersji premium FunnelKit Cart.

Dzięki tej wtyczce możesz polecać powiązane produkty, gdy klient dodaje przedmiot do swojego koszyka.

Zwiększ sprzedaż dzięki promocjom upsell i cross-sell

Możesz również tworzyć unikalne nagrody, takie jak kody kuponów i darmowe prezenty, a następnie promować je w przesuwającym się koszyku.

FunnelKit może nawet śledzić, ile więcej klient musi wydać, aby odblokować kolejną nagrodę.

Oferowanie dodatkowych nagród klientom
Krok 1: Zainstaluj i aktywuj wtyczki FunnelKit Pro

Aby uzyskać te zaawansowane możliwości, będziesz potrzebować pakietu FunnelKit Funnel Builder Pro (plan Plus lub wyższy). Pakiet ten zawiera trzy oddzielne wtyczki, które współpracują ze sobą i musisz zainstalować wszystkie z nich:

  • FunnelKit Funnel Builder: To jest podstawowa wtyczka.
  • FunnelKit Funnel Builder Pro: To jest dodatek premium, który odblokowuje funkcje upsell, nagrody i inne.
  • FunnelKit Cart: To jest specyficzny moduł, który zasila przesuwany boczny koszyk.

Po zakupie planu zaloguj się na swoje konto FunnelKit, aby pobrać trzy wtyczki. Następnie możesz je zainstalować i aktywować. Jeśli potrzebujesz pomocy, zapoznaj się z naszym przewodnikiem jak zainstalować wtyczkę WordPress.

Krok 2: Aktywuj swój klucz licencyjny

Po aktywacji przejdź do FunnelKit » Ustawienia i dodaj swój klucz licencyjny w polu „FunnelKit Funnel Builder Pro”.

Dodawanie licencji FunnelKit

Te informacje znajdziesz, logując się na swoje konto na stronie FunnelKit. Po wykonaniu tej czynności kliknij „Aktywuj”.

Następnie po prostu przejdź do FunnelKit » Koszyk.

Dodawanie zaawansowanego wysuwanego koszyka bocznego do sklepu internetowego

Teraz możesz skonfigurować i dostosować boczny koszyk, postępując zgodnie z tym samym procesem opisanym w metodzie 1. Gdy będziesz zadowolony z konfiguracji przesuwającego się bocznego koszyka, będziesz gotowy do dodania upsells, cross-sells i nagród.

Krok 3: Włącz upsell i cross-sell

Kiedy klienci otworzą przesuwany koszyk boczny, możesz wyświetlać im unikalne promocje upsell i cross-sell w oparciu o przedmioty w ich koszyku.

Dodawanie promocji upsell i cross-sell do WooCommerce

Upselling to zachęcanie klientów do zakupu produktu droższego zamiast tego, który już mają w swoim koszyku.

Na przykład wyobraź sobie klienta dodającego do koszyka wodoodporną kurtkę. Możesz zaproponować kurtkę wyższej jakości, która jest bardziej wytrzymała, wszechstronna i dostępna w różnych kolorach.

Cross-selling (sprzedaż krzyżowa) polega na promowaniu produktu powiązanego z tym, co klient już kupuje. Na przykład, jeśli klient doda do koszyka kartkę z życzeniami, możesz zachęcić go do zakupu czekoladek lub kwiatów.

WooCommerce posiada funkcję powiązanych produktów, która pozwala na tworzenie ofert sprzedaży dodatkowej i krzyżowej. Więcej informacji znajdziesz w naszym przewodniku jak oferować produkty dodatkowe w WooCommerce.

Możesz jednak tworzyć upsell i cross-sell bezpośrednio z pulpitu FunnelKit. Jest to najszybsza opcja, więc właśnie jej będziemy używać w tym przewodniku.

Aby rozpocząć, musisz kliknąć opcję „Upsells”, a następnie wybrać „Enable Cart Upsells”.

Jak dodać upsell i cross-sell do WooCommerce
Krok 4: Przypisz upsell i cross-sell do produktów

Po tym przewińmy do sekcji „Upsells and Cross-Sells”.

Tutaj zobaczysz wszystkie produkty w swoim sklepie internetowym.

Jak tworzyć powiązane produkty w WooCommerce

Po prostu kliknij element, do którego chcesz dodać jeden lub więcej powiązanych produktów.

Następnie możesz kliknąć „Dodaj Upsell” lub „Dodaj Cross Sell” w zależności od rodzaju promocji, którą chcesz utworzyć.

Zaawansowane funkcje konwersji FunnelKit

W oknie podręcznym zacznij wpisywać produkt, którego chcesz użyć jako upsell lub cross-sell. Gdy pojawi się właściwy produkt, po prostu kliknij go.

Aby zaoferować wiele produktów, po prostu postępuj zgodnie z opisanym powyżej procesem.

Dodawanie powiązanego produktu w Twoim sklepie internetowym

Po wykonaniu tej czynności po prostu kliknij przycisk „Dodaj”.

Możesz teraz tworzyć unikalne kampanie cross-sell i upsell dla każdego produktu w swoim sklepie, po prostu postępując zgodnie z tym samym procesem opisanym powyżej.

Przykład skutecznego, przesuwnego koszyka w sklepie internetowym
Krok 5: Dostosuj wyświetlanie upsell i cross-sell

Teraz jesteś gotowy, aby dostosować wygląd promocji upsell i cross-sell na swoim wysuwanym bocznym koszyku.

Na początek spróbuj przełączać się między różnymi stylami, klikając przyciski radiowe obok opcji „Wyświetl”.

Dostosowywanie promocji upsell i cross-sell w WooCommerce

Podgląd na żywo będzie się automatycznie aktualizował, dzięki czemu możesz wypróbować różne style, aby zobaczyć, który najbardziej Ci się podoba.

Domyślnie FunnelKit będzie wyświetlał zarówno upsell, jak i cross-sell w wysuwanym koszyku bocznym. Jeśli wolisz, możesz wyświetlić tylko upsell lub tylko cross-sell, używając przycisków radiowych w „Typ rekomendacji produktu”.

Ustawienia rekomendacji produktów w FunnelKit

Następnie możesz zmienić nagłówek, który FunnelKit wyświetla nad promocją upsell lub cross-sell, wpisując go w polu „Nagłówek”.

Pamiętaj tylko, że FunnelKit użyje tego samego nagłówka dla obu typów promocji.

Dodawanie promocji do przesuwnego koszyka bocznego

Następnie możesz ustawić maksymalną liczbę sugerowanych produktów, które FunnelKit wyświetli, wpisując ją w polu „Pokaż maksymalne upsell”.

Gdziekolwiek to możliwe, dobrym pomysłem jest tworzenie unikalnych promocji upsell i cross-sell dla każdego produktu. Jednakże, jeśli Twój sklep internetowy ma wiele produktów, może to nie być możliwe.

Mając to na uwadze, możesz ustawić domyślny produkt dodatkowy, który FunnelKit będzie promował, gdy nie będą dostępne żadne powiązane produkty. Aby to zrobić, po prostu wpisz nazwę produktu w polu „Domyślne produkty dodatkowe”. Gdy pojawi się właściwy produkt, po prostu kliknij go.

Ustawianie domyślnego powiązanego produktu

Gdy będziesz zadowolony z utworzonych promocji upsell i cross-sell, nie zapomnij kliknąć „Zapisz”, aby zachować zmiany.

Krok 6: Twórz i konfiguruj odblokowywane nagrody

Dając klientom powód do wydawania więcej, często można zwiększyć średnią wartość zamówienia. FunnelKit pozwala tworzyć różne nagrody, które klienci odblokowują, gdy suma ich koszyka osiągnie określoną kwotę.

Na przykład możesz zaoferować darmową wysyłkę, jeśli klient przekroczy minimalną kwotę wydatków. FunnelKit pokaże nawet klientom, ile jeszcze muszą wydać, aby odblokować nagrodę.

To prosty sposób na zwiększenie sprzedaży i budowanie lojalności klientów za pomocą grywalizacji.

FunnelKit pozwala oferować trzy różne nagrody: darmową wysyłkę, zniżkę i darmowy prezent.

Aby zaoferować bezpłatną wysyłkę, musisz już skonfigurować wysyłkę w swoim sklepie WooCommerce. Instrukcje krok po kroku znajdziesz w naszym przewodniku WooCommerce w pigułce.

Tymczasem nagroda „zniżka” automatycznie stosuje kupon, gdy klient osiągnie minimalną kwotę wydatków. Jeśli chcesz zaoferować tę nagrodę, musisz utworzyć kupon zniżki procentowej, korzystając z wbudowanej funkcji kuponów WooCommerce lub wtyczki do kuponów WordPress.

Instrukcje krok po kroku znajdziesz w naszym przewodniku jak tworzyć inteligentne kupony.

Następnie jesteś gotowy do utworzenia nagrody, wybierając „Nagrody” w ustawieniach FunnelKit, a następnie klikając „Utwórz nagrodę”.

Jak zwiększyć sprzedaż dzięki nagrodom

Teraz możesz otworzyć menu rozwijane „Typ” i wybrać rodzaj nagrody, którą chcesz utworzyć: Darmowa wysyłka, Rabat lub Darmowy prezent.

Niezależnie od tego, co wybierzesz, możesz zmienić tekst, który FunnelKit wyświetla klientom, wpisując go w polu „Wiadomość”.

Jeśli dokonujesz jakichkolwiek zmian, uważaj, aby nie edytować {{remaining_amount}}, ponieważ pozwala to FunnelKit pokazać, ile więcej klient musi wydać.

Dodawanie zachęt do Twojego sklepu WooCommerce

Jeśli oferujesz zniżkę, upewnij się, że zmienisz komunikat, aby pokazać, ile klient zaoszczędzi.

Po wykonaniu tej czynności wpisz liczbę w polu „Kwota do otrzymania nagrody”. Tyle muszą wydać kupujący, aby odblokować nagrodę.

Oferowanie klientom nagród i zachęt

Jeśli oferujesz zniżkę procentową, musisz określić, który kupon FunnelKit powinien automatycznie zastosować.

W polu „Kupon” zacznij wpisywać kupon, którego chcesz użyć. Gdy pojawi się właściwy kod, kliknij go.

Dodawanie oferty rabatowej do Twojej witryny eCommerce

Teraz FunnelKit automatycznie zastosuje kupon, gdy ktoś spełni minimalny próg wydatków.

Oferujesz darmowy prezent zamiast tego? W takim razie możesz zacząć wpisywać nazwę prezentu w polu „Produkt”.

Oferowanie klientom darmowego prezentu

Gdy pojawi się właściwy produkt, kliknij go.

Teraz FunnelKit doda ten produkt do koszyka klienta, gdy tylko spełni on minimalny próg wydatków.

Jak zaoferować kupującym darmowy prezent

Aby dodać więcej nagród, po prostu kliknij „Utwórz kolejną nagrodę”.

Możesz teraz skonfigurować rabat, darmowy prezent lub darmową wysyłkę, postępując zgodnie z tym samym procesem opisanym powyżej.

Zwiększ sprzedaż, oferując kupującym nagrodę

Domyślnie FunnelKit wyświetli następującą wiadomość, gdy klient zakwalifikuje się do wszystkich nagród: „Gratulacje! Odblokowałeś wszystkie nagrody”.

Aby wyświetlić inną wiadomość, po prostu wpisz ją w polu „When All Rewards Unlocked”. Możesz nawet zaoferować klientowi specjalny bonus za odblokowanie wszystkich nagród, taki jak ekskluzywny kod kuponu do wykorzystania przy następnym zakupie.

Oferowanie odwiedzającym nagrody

Gdy będziesz zadowolony z konfiguracji nagród, kliknij przycisk „Zapisz”.

Krok 7: Opublikuj swój zaawansowany przesuwany boczny koszyk

Gdy będziesz gotowy, aby przesuwany boczny koszyk był aktywny, po prostu kliknij przełącznik „Włącz koszyk”.

Publikowanie przesuwnego koszyka bocznego w Twoim sklepie internetowym

Jeśli chcesz w dowolnym momencie usunąć przesuwany koszyk boczny, po prostu wróć do sekcji FunnelKit » Koszyk w panelu administracyjnym WordPress. Następnie kliknij, aby wyłączyć przełącznik „Włącz koszyk”.

Samouczek wideo

Zanim przejdziesz dalej, możesz zapoznać się z naszym samouczkiem wideo na temat dodawania wysuwanego koszyka do Twojego sklepu WooCommerce.

Subskrybuj WPBeginner

Najczęściej zadawane pytania dotyczące dodawania przesuwnego koszyka w WooCommerce

Oto kilka pytań, które nasi czytelnicy często zadawali przed dodaniem przesuwnego koszyka do swoich sklepów WooCommerce:

Czy przesuwany boczny koszyk zastępuje domyślną stronę koszyka WooCommerce?

Nie, nie zastępuje domyślnej strony koszyka. Przesuwany boczny koszyk stanowi alternatywę, wygodniejszy sposób dla klientów na przeglądanie i zarządzanie koszykiem z dowolnej strony.

Główna strona koszyka (twojastrona.com/cart) nadal będzie istnieć, a większość przesuwanych koszyków zawiera przycisk, który do niej linkuje dla użytkowników, którzy chcą ją zobaczyć.

Czy dodanie wtyczki przesuwnego bocznego koszyka spowolni moją stronę internetową?

Dobrze napisana wtyczka, taka jak FunnelKit, jest zoptymalizowana pod kątem wydajności i nie powinna mieć zauważalnego wpływu na szybkość Twojej witryny. Te wtyczki są zaprojektowane tak, aby efektywnie ładować swoje skrypty.

Jednakże, jako najlepsza praktyka, zawsze warto przetestować szybkość swojej witryny przed i po dodaniu nowej wtyczki, aby mieć pewność.

Czy warto uaktualnić do FunnelKit Pro tylko ze względu na funkcje przesuwnego koszyka?

To, czy uaktualnienie jest tego warte, zależy od Twoich celów biznesowych. Jeśli Twoim głównym celem jest zwiększenie średniej wartości zamówienia (AOV), funkcje Pro są bardzo potężne.

Możliwość wyświetlania ukierunkowanych ofert upsell, cross-sell i nagród w formie grywalizacji (takich jak „Brakuje Ci 10 USD do darmowej wysyłki!”) bezpośrednio w koszyku może znacząco zwiększyć sprzedaż.

Co jeśli przesuwany boczny koszyk będzie kolidował z moim motywem WordPress?

Konflikty z nowoczesnymi, dobrze napisanymi motywami są rzadkie, ale mogą się zdarzyć. Jeśli zauważysz jakiekolwiek problemy z wyświetlaniem, pierwszym miejscem do sprawdzenia są ustawienia „Stylizacja” wtyczki, ponieważ często można tam rozwiązać drobne problemy.

Jeśli problem będzie się utrzymywał, najlepszym rozwiązaniem jest skontaktowanie się z zespołem wsparcia wtyczki w celu uzyskania pomocy.

Mamy nadzieję, że ten artykuł pomógł Ci dodać przesuwany boczny koszyk w WooCommerce. Możesz również zapoznać się z naszym przewodnikiem na temat tworzenia wyskakującego okienka WooCommerce w celu zwiększenia sprzedaży oraz naszym wyborem najlepszych wtyczek WooCommerce dla Twojego sklepu.

Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.

Ujawnienie: Nasze treści są wspierane przez czytelników. Oznacza to, że jeśli klikniesz w niektóre z naszych linków, możemy otrzymać prowizję. Zobacz jak finansowany jest WPBeginner, dlaczego to ważne i jak możesz nas wesprzeć. Oto nasz proces redakcyjny.

Ostateczny zestaw narzędzi WordPress

Uzyskaj BEZPŁATNY dostęp do naszego zestawu narzędzi – kolekcji produktów i zasobów związanych z WordPress, które powinien mieć każdy profesjonalista!

Interakcje czytelników

1 CommentLeave a Reply

  1. „Dlaczego by tego nie dodać tam” lol.
    Właściwie to jest wnikliwy post, który pomaga zoptymalizować wszystkie części WooCommerce pod kątem sprzedaży i stworzyć wysuwany koszyk do dowolnego motywu.
    Dzięki za ten przewodnik. Potrzebuję tego wysuwanego koszyka.

Zostaw odpowiedź

Dziękujemy za pozostawienie komentarza. Pamiętaj, że wszystkie komentarze są moderowane zgodnie z naszą polityką komentowania, a Twój adres e-mail NIE zostanie opublikowany. Prosimy NIE używać słów kluczowych w polu nazwy. Prowadźmy osobistą i znaczącą rozmowę.