Jak dostosować stronę kasy WooCommerce (w łatwy sposób)

Czy chcesz dostosować stronę kasy WooCommerce?

Domyślna strona kasy WooCommerce nie jest zoptymalizowana pod kątem konwersji. Dostosowując i optymalizując stronę realizacji zakupu, możesz zwiększyć konwersje i zwiększyć sprzedaż.

W tym artykule pokażemy, jak łatwo dostosować stronę kasy WooCommerce, krok po kroku bez pisania kodu.

How to customize WooCommerce checkout page (the easy way)

Po co dostosowywać stronę kasy WooCommerce w WordPress?

Badania pokazują, że od 70 do 85% wszystkich wózków jest porzuconych. Innymi słowy, większość użytkowników opuszcza strony kasy bez dokonania zakupu.

Tworzenie niestandardowej strony kasy WooCommerce daje ostateczną możliwość przekształcenia odwiedzającego witrynę w klienta przed opuszczeniem sklepu.

Dzięki niestandardowej stronie kasy możesz dodawać referencje / elementy dowodu społecznego, aby budować zaufanie, dodawać powiązane produkty, aby zwiększyć przychody i zoptymalizować ogólny układ strony w celu uzyskania lepszych konwersji.

Checkout page example

Wszystko to zwiększy konwersje i zwiększy prawdopodobieństwo, że odwiedzający stanie się długoterminowym klientem.

Zanim przejdziesz do przodu, możesz również dostosować stronę koszyka WooCommerce, aby poprawić konwersje tutaj.

Jeśli korzystasz ze stron koszyka i kasy WooCommerce razem, będziesz chciał, aby te strony miały podobną markę, aby zaoferować odwiedzającym wspaniałe wrażenia z realizacji transakcji.

Dostosowując je razem, możesz poprawić ogólną konwersję i zarobić więcej przychodów. Aby uzyskać więcej informacji, zobacz nasz przewodnik dotyczący tworzenia niestandardowej strony koszyka WooCommerce bez pisania kodu.

Mając to na uwadze, przyjrzyjmy się, jak łatwo dostosować stronę kasy WooCommerce i zarabiać więcej pieniędzy ze sklepu internetowego.

Jak dostosować stronę kasy WooCommerce w WordPress

SeedProd to najlepszy kreator stron typu „przeciągnij i upuść” WordPress używany przez ponad milion stron internetowych. Pozwala łatwo dostosować stronę kasy WooCommerce, aby zwiększyć sprzedaż.

Pierwszą rzeczą, którą musisz zrobić, to zainstalować i aktywować wtyczkę. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.

Uwaga: dostępna jest darmowa wersja SeedProd, ale w tym samouczku pokażemy wersję Pro, ponieważ ma wbudowane bloki WooCommerce.

Po aktywacji wtyczki przejdź do SeedProd ” Ustawienia i wprowadź swój klucz licencyjny.

SeedProd license key

Możesz znaleźć te informacje na stronie swojego konta na stronie SeedProd.

Następnie przejdź do SeedProd ” Strony a następnie kliknij przycisk „Dodaj nową stronę docelową”.

Add new SeedProd landing page

Następnie zostaniesz poproszony o wybranie szablonu strony docelowej. Istnieją dziesiątki profesjonalnie zaprojektowanych szablonów do wyboru.

Zauważysz, że szablony są filtrowane według różnych kategorii. Wybór kategorii szablonu, która pasuje do typu strony, którą chcesz utworzyć, może pomóc ci szybciej zbudować stronę.

Dzięki temu każdy szablon można w pełni dostosować, bez względu na to, który szablon wybierzesz.

W tym samouczku wybierzemy „Pusty” szablon, ponieważ pozwala nam to zbudować dokładny rodzaj strony kasy, którą chcemy.

Aby wybrać szablon, najedź na niego kursorem i kliknij ikonę „Checkmark”.

Select blank SeedProd template

Następnie zostaniesz poproszony o nadanie nazwy swojej stronie. Nazwa strony będzie również pasować do adresu URL strony realizacji zakupu.

Następnie kliknij przycisk „Zapisz i rozpocznij edycję strony”.

Name checkout page

Przeniesie cię to do edytora przeciągania i upuszczania, gdzie możesz zbudować niestandardową stronę kasy WooCommerce.

Po prawej stronie będzie podgląd strony,a po lewej stronie jest panel opcje, które pomogą Ci dostosować.

Najpierw dodamy nagłówek, abyś mógł utrzymać swoją markę.

Aby to zrobić, kliknij opcję menu „sekcje” w lewym panelu, a następnie kliknij kategorię „nagłówek”.

Insert header section

Następnie najedź kursorem na szablon „Nagłówek 1” i kliknij ikonę „Plus”.

Następnie kliknij sekcję „obraz” na swojej stronie i prześlij logo sklepu z menu po lewej stronie.

Add header logo

Następnie możesz usunąć menu nawigacyjne, najeżdżając na nie kursorem i klikając „Usuń blok”.

Usunięcie innych elementów menu zmniejsza liczbę wyjść strony i zwiększa prawdopodobieństwo, że odwiedzający sfinalizuje zakup.

Delete menu block

Gdy to zrobisz, kliknij przycisk „wezwanie do działania”.

Mamy zamiar zmienić tekst tak, że mówi „Pokaż Koszyk”.

Edit button text

Pozwala to użytkownikom wrócić do strony koszyka, aby dodać artykuły lub zmienić ilość.

Następnie dodaj adres URL strony koszyka WooCommerce do pola oznaczonego „Link”.

Możesz zrobić link nofollow lub otworzyć w nowej karcie, ale zostawimy ustawienia domyślne.

Edit button URL

Następnie kliknij zawartość i układ paska bocznego w sekcji ” Wybierz swój układ:”.

Dzięki temu możesz utworzyć sekcję dla kasy oraz sekcję polecanych produktów.

Select two column layout

Następnie znajdź blok „kasa” w sekcji WooCommerce i przeciągnij go na swoją stronę.

Możesz całkowicie dostosować wygląd kasy, w tym schemat kolorów, wybór czcionki, kolor łącza, przyciski i wiele innych.

Add checkout block

Następnie możesz dodać sekcję popularne produkty lub Polecane produkty. Pozwala to zwiększyć sprzedaż poprzez promowanie innych produktów, które mogą zainteresować kupujących.

Aby to dodać, po prostu przeciągnij blok „najlepiej sprzedające się produkty” z sekcji „WooCommerce”.

Możesz również wybrać dowolny z innych bloków produktów WooCommerce.

Add WooCommerce products block

Następnie możesz dodać nagłówek nad popularnymi produktami.

Po prostu przeciągnij blok „nagłówek” na swoją stronę nad popularnymi produktami. Możesz dostosować czcionkę, rozmiar, tekst, kolor i inne.

Add product headline block

Gdy to zrobisz, możesz dodać blok referencji. Działa to jako dowód społeczny i zapewnia odwiedzających, że podejmują właściwą decyzję.

Znajdź blok „Referencje” i przeciągnij go pod popularne produkty.

Add testimonials block

Blok referencji można całkowicie dostosować.

Możesz dodać zdjęcie klienta, stanowisko i inne.

Customize testimonials block

Kolejną rzeczą, którą możesz zrobić, aby jeszcze bardziej poprawić dowód społeczny, jest dodanie gwiazdki tuż pod swoim świadectwem.

Po prostu wybierz blok „gwiazdki” i przeciągnij go pod swoją opinię.

Add star rating block

Po zakończeniu dostosowywania strony kasy WooCommerce możesz ją uruchomić, klikając strzałkę rozwijaną obok przycisku „Zapisz” i wybierz „Publikuj”.

Publish checkout page

Teraz, zamiast domyślnej kasy WooCommerce, utworzyłeś stronę kasy WooCommerce o wysokiej konwersji.

Możesz nadal dostosowywać stronę i testować różne elementy, sekcje i bloki.

WooCommerce checkout page example

Pro tip: możesz śledzić wydajność strony kasy WooCommerce, aby sprawdzić, czy Twoje dostosowania poprawiają przychody. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak skonfigurować śledzenie konwersji WooCommerce.

Przypisz stronę kasy do WooCommerce

Po zakończeniu dostosowywania strony kasy i uruchomieniu jej, musisz zmienić domyślne ustawienia adresu URL WooCommerce.

Zmiana adresu URL sprawia, że klienci automatycznie przechodzą do nowej strony kasy WooCommerce, zamiast opcji domyślnej.

Najpierw przejdź do WooCommerce ” Ustawienia i kliknij kartę „Zaawansowane”.

Change WooCommerce cart URL

Następnie wybierz nowy adres URL strony kasy WooCommerce z rozwijanego menu.

Pamiętaj, aby kliknąć „Zapisz zmiany” u dołu ekranu.

Teraz, gdy użytkownik kliknie „przejdź do kasy”, zostanie przeniesiony do nowej, wysokiej konwersji strony, którą właśnie zbudowałeś.

Niektóre motywy WooCommerce dają nawet klientom możliwość przejścia bezpośrednio do strony kasy.

Direct to checkout example

Jak zmniejszyć opuszczanie strony kasy

Rezygnacja ze strony kasy ma miejsce, gdy klient rozpoczyna proces realizacji transakcji, ale nie kończy płatności. Jest to podobne do porzucenia koszyka, ale to jeszcze jeden krok w kierunku zakończenia płatności i stania się klientem.

Dostosowanie strony kasy za pomocą powyższego samouczka znacznie ułatwi optymalizację strony kasy pod kątem konwersji.

Istnieje jednak kilka rzeczy, które możesz zrobić, aby jeszcze bardziej ograniczyć porzucanie kasy.

Zmniejsz Wszelkie Opłaty Za Zakup Dodatku

Gdy klienci dotrą do koszyka, oczekują, że całkowita cena będzie podobna do całkowitej ceny produktu.

Jeśli dostaną się do kasy i zobaczą podatki, wysokie koszty wysyłki i inne dodatkowe opłaty, istnieje duża szansa, że nie sfinalizują zakupu.

Added fees example

Klient może kontynuować zakup, jeśli uzna, że koszty są uzasadnione. Jednak najlepszą rzeczą do zrobienia jest być z góry z cenami.

Jeśli masz wiele dodatkowych opłat za realizację swoich produktów, dodaj je do całkowitych cen produktów. Lub wyjaśnić przyczynę dodatkowych kosztów.

Amazon był w stanie zdominować przestrzeń eCommerce, oferując bezpłatną wysyłkę 2-dniową.

Rozważ oferowanie bezpłatnej wysyłki swoich produktów lub oferowanie bezpłatnej wysyłki do zamówień powyżej określonej kwoty.

Tworzenie konta jest opcjonalne lub prostsze

Wymaganie rejestracji konta przed dokonaniem zakupu może prowadzić do rezygnacji. Może to zwiększyć liczbę subskrybentów poczty e-mail, ale zwiększa tarcie w procesie zakupu.

Możesz zezwolić swoim użytkownikom na utworzenie konta, ale nie musisz stawiać tego wymogu.

Zamiast tego możesz skonfigurować formularz rejestracyjny, aby powiększyć listę e-mail po zakończeniu zakupu przez użytkownika.

Możesz również uprościć wymagane pola na stronie realizacji zakupu. Jeśli chcesz zebrać więcej informacji, możesz to zrobić po kasie.

Celem powinno być wyeliminowanie jak największej liczby pól (punktów tarcia) z drogi użytkownika, aby mógł on dokonać zakupu.

Oferuj Więcej Opcji Płatności Przy Kasie

Innym powodem, dla którego odwiedzający nie będą realizować procesu realizacji zakupu, jest to, że nie oferujesz wystarczających opcji płatności.

Twój sklep internetowy powinien zapewnić najczęstsze opcje płatności.

Payment options example

Twoi klienci będą korzystać z metody płatności, która jest dla nich najwygodniejsza.

Aby uzyskać więcej informacji, zobacz naszą listę najlepszych bramek płatności WooCommerce dla WordPress.

Mamy nadzieję, że ten artykuł pomógł Ci łatwo dostosować stronę kasy WooCommerce. Możesz również zobaczyć nasze eksperckie typy najlepszego hostingu WooCommerce i naszą listę najlepszych wtyczek WooCommerce dla Twojego sklepu.

Jeśli podoba Ci się ten artykuł, zasubskrybuj nasz kanał YouTube dla samouczków wideo WordPress. Znajdziesz nas również na Twitterze i Facebooku.

You May Also Like

Jak naprawić nieprawidłowy błąd JSON w WordPress (Przewodnik dla początkujących)

W artykule: Co powoduje błąd „nieprawidłowa odpowiedź JSON” w WordPress?1. Sprawdź adresy…

Jak zmienić kolor linku w WordPress (poradnik dla początkujących)

W artykule: Dlaczego Linki Są Ważne?Jak dodawać linki w postach i stronach…

Jak naprawić błąd krytyczny w WordPress (krok po kroku)

W artykule: Co To jest błąd krytyczny w WordPress?Co powoduje krytyczny błąd…

WordPress Pingbacks & Trackbacks: Ultimate A-Z Guide

W artykule: Czym są Pingbacks i Trackbacks? Plus, dlaczego są ważneCzym Są…