Jak zrobić zakupy w WooCommerce jak Shopify

Czy chcesz zmienić swoje zamówienie i sprawić, by wyglądało jak Shopify? Mamy dla Ciebie idealny samouczek. W tym przewodniku pokażemy, jak dokonać zakupu WooCommerce, tak jak Shopify.

WooCommerce to jedna z najbardziej elastycznych platform eCommerce z licznymi opcjami dostosowywania. Czasami jednak wszystkie te korzyści mogą być przytłaczające dla administratorów witryny i klientów. Na przykład zauważyliśmy już, że skomplikowana strona kasy z wieloma polami może wpływać na współczynniki konwersji. Dlatego powinieneś usunąć niepotrzebne pola i zadbać o czystość i prostotę kasy.

Może to być zaletą dla innych platform, takich jak Shopify , które mają bardzo prostą stronę kasy. Mimo że możesz dostosować swoją kasę i utworzyć na przykład jednostronicową kasę, niektórzy użytkownicy nadal wolą mieć stronę kasy podobną do Shopify. Dobrą wiadomością jest to, że ogromna elastyczność WooCommerce pozwala na dokonanie płatności, takiej jak ta, którą oferuje Shopify.

Zanim zobaczymy, jak to zrobić, przyjrzyjmy się różnicom między stronami kasy WooCommerce i Shopify.

WooCommerce Checkout a Shopify Checkout

Wiesz już, że w WooCommerce możesz dodać wiele pól kasy. Ale jeśli dodasz zbyt wiele, możesz otrzymać długą i skomplikowaną stronę kasy . Może to zwiększyć porzucanie koszyka i wpłynąć na współczynnik konwersji, ponieważ wypełnianie tak wielu pól może być męczące dla użytkowników.

Z drugiej strony, jeśli spojrzysz na domyślną stronę kasy Shopify, ma ona prosty i piękny wygląd z tylko niezbędnymi polami kasy. Dla porównania, stronę kasy WooCommerce z pewnością można ulepszyć, aby była bardziej wydajna.

Dobrą wiadomością jest to, że ponieważ WooCommerce ma wiele opcji dostosowywania, możesz łatwo sprawić, by Twoja kasa WooCommerce wyglądała jak Shopify.

Jak sprawić, by WooCommerce Checkout wyglądał jak Shopify

Najłatwiejszym sposobem utworzenia kasy Shopify w WooCommerce jest użycie wtyczki . WordPress oferuje wiele wtyczek, których możesz użyć do dostosowania swojej kasy. W tej sekcji przeanalizujemy kilka najlepszych narzędzi, dzięki którym Twoja kasa WooCommerce będzie wyglądać jak Shopify.

Bloki WooCommerce

WooCommerce Blocks to darmowa wtyczka opracowana przez Automattic. Ma wiele bloków Gutenberga, które są specjalnie zaprojektowane dla WooCommerce i jeden dedykowany do kasy.

Za pomocą bloku kasy możesz łatwo sprawić, by Twoja kasa WooCommerce wyglądała jak kasa Shopify. Ma nawet domyślnie podobne układy i sekcje treści, dzięki czemu transformacja jest dość łatwa. To narzędzie zapewnia również różne opcje bloku kasy, dzięki czemu można go dostosować do własnych potrzeb.

Kluczowe cechy

• Uproszczony blok kasowy
• Wiele opcji bloków produktów
• Recenzje według kategorii i bloków produktów
• Niesamowite wsparcie

Cena £

Jest to darmowa wtyczka, którą możesz pobrać z repozytorium WordPressa.

KasaWC

CheckoutWC to jedna z najpopularniejszych wtyczek do dostosowywania kasy WooCommerce. Zawiera kilka szablonów inspirowanych Shopify, dzięki czemu możesz ich użyć, aby Twoja kasa WooCommerce wyglądała jak Shopify.

Ta wtyczka ma również responsywny projekt, a także świetne opcje kompatybilności z większością głównych wtyczek i motywów WordPress. Co więcej, oferuje wygodne opcje dla Twoich klientów, takie jak generatory haseł, funkcja autouzupełniania adresów i nie tylko.

Kluczowe cechy

• Wiele szablonów stron kasy
• W pełni responsywny projekt
• Autouzupełnianie adresu
• Edycja koszyka

Cena £

CheckoutWC to wtyczka premium, która zaczyna się od 15 USD miesięcznie lub 149 USD rocznie. Obejmuje również 30-dniową gwarancję zwrotu pieniędzy, bezpłatne aktualizacje i wsparcie dla jednej witryny.

Utwórz Shopify Checkout w WooCommerce za pomocą wtyczki

W tym samouczku użyjemy WooCommerce Blocks , aby Twoja kasa WooCommerce była taka jak Shopify. Jest to doskonała darmowa wtyczka z wieloma funkcjami do edycji sklepu WooCommerce i dedykowanym blokiem kasowym.

Zanim zaczniemy, upewnij się, że poprawnie skonfigurowałeś WooCommerce na swojej stronie. Pamiętaj również, że użyjemy motywu Divi, więc niektóre strony i opcje mogą się różnić w Twojej witrynie, jeśli użyjesz innego motywu. Jednak powinieneś być w stanie wykonać kroki bez żadnych problemów.

1. Zainstaluj i aktywuj bloki WooCommerce

Najpierw zainstaluj i aktywuj wtyczkę. W tym celu przejdź do Wtyczki> Dodaj nowy na pulpicie WordPress i wyszukaj wtyczkę WooCommerce Blocks. Gdy go znajdziesz, zainstaluj go, klikając Zainstaluj teraz .

Po zakończeniu instalacji Aktywuj wtyczkę. Jeśli potrzebujesz więcej informacji na temat tego procesu, zapoznaj się z naszym przewodnikiem, jak ręcznie zainstalować wtyczkę WordPress.

2. Skonfiguruj i dostosuj stronę kasy

Teraz wszystko, co musisz zrobić, to przejść do Stron na pulpicie nawigacyjnym, znaleźć stronę Kasy i nacisnąć Edytuj .

Następnie zobaczysz tutaj domyślny krótki kod strony kasy WooCommerce. Ponieważ chcemy, aby kasa WooCommerce wyglądała jak Shopify, musisz usunąć krótki kod. Aby go usunąć, po prostu kliknij krótki kod i otwórz opcje, naciskając trzy pionowe kropki .

Następnie kliknij Usuń blok, aby usunąć krótki kod. Alternatywnie możesz kliknąć blok, a następnie nacisnąć Ctrl + Alt + Z , jak pokazano w skrócie opcji.

Następnie kliknij ikonę „ + ” lub wpisz „ / ”, aby dodać nowy blok i wyszukaj „Do kasy ”. Wybierz blok kasy i zaktualizuj stronę. Będziesz mógł zobaczyć swoją nową stronę kasy inspirowaną Shopify w WooCommerce.

Teraz masz dwie opcje: pozostaw to bez zmian lub dostosuj. Zobaczmy, jak to edytować.

Najpierw otwórz ikonę ustawień w prawym górnym rogu ekranu. Ustawienia strony i bloku pojawią się na prawym pasku bocznym. Następnie kliknij jeden z bloków i możesz rozpocząć edycję konkretnego bloku z paska bocznego ustawień bloku .

Na przykład, jeśli chcesz edytować pola adresu wysyłki, po prostu naciśnij blok adresu wysyłki, a zobaczysz wszystkie dostępne ustawienia na prawym pasku bocznym. Stamtąd możesz pokazać lub ukryć edytory pól dla swojej strony kasy.

Po dokonaniu wszystkich niezbędnych zmian zaktualizuj stronę. Sprawdź swoją kasę w interfejsie, a zobaczysz swoją nową stronę kasy inspirowaną Spotify.

Pro Tip: Dopasuj stronę koszyka do strony kasy

Jeśli masz stronę koszyka, możesz powtórzyć powyższy proces dla strony koszyka i dopasować styl zarówno do kasy, jak i strony koszyka.

Na pulpicie WordPress po prostu przejdź do Strony , znajdź stronę Koszyk i usuń domyślny skrót kodu strony koszyka WooCommerce. Następnie dodaj nowy blok koszyka ze stroną koszyka i zaktualizuj go.

Zależy to od rodzaju posiadanego produktu lub usługi, ale z reguły zalecamy pominięcie strony koszyka, aby skrócić proces realizacji transakcji. Jeśli chcesz dowiedzieć się więcej na ten temat, zapoznaj się z naszym przewodnikiem, jak pominąć stronę koszyka w WooCommerce.

Kolejny sposób, aby Twoja kasa WooCommerce była podobna do Shopify

Jeśli uważasz, że dostosowywanie strony kasy poprzez jej edycję to zbyt dużo pracy, istnieje dla Ciebie inna alternatywa. Możesz użyć CheckoutWC , wtyczki premium, aby Twoja kasa WooCommerce wyglądała jak Shopify.

W tym celu musisz subskrybować jeden z ich planów, ponieważ jest to płatny produkt. Możesz także skorzystać z 7-dniowego bezpłatnego okresu próbnego, aby sprawdzić, czy narzędzie oferuje to, czego potrzebujesz.

Przyjrzyjmy się teraz procesowi tworzenia kasy Shopify w WooCommerce za pomocą CheckoutWC.

1. Zainstaluj i aktywuj CheckoutWC

Najpierw musisz aktywować i zainstalować wtyczkę, aby zacząć z niej korzystać. W panelu przejdź do Wtyczki > Dodaj nowy i kliknij Prześlij wtyczkę . Prześlij plik zip pobrany podczas zakupu, a po jego zakończeniu naciśnij Zainstaluj teraz .

Po zakończeniu instalacji aktywuj wtyczkę. Po raz kolejny możesz zajrzeć do naszego przewodnika, aby ręcznie zainstalować wtyczkę WordPress, jeśli masz wątpliwości co do tego procesu.

2. Wybierz szablon kasy

Główną zaletą tej wtyczki jest to, że zawiera szablony płatności zaprojektowane specjalnie z myślą o stronie płatności Shopify. Dostępne są 4 szablony, więc wybierz ten, który bardziej Ci się podoba w swoim sklepie.

Po prostu przejdź do Ustawienia > Kasa dla WooCommerce > Szablony na pulpicie WordPress, a zobaczysz cztery opcje szablonów:

• Domyślna
• Futurysta
• Kopiuj
• Szkło

Szablon Copify jest najbardziej podobny do strony kasy Shopify, ale pozostałe trzy mają również pewne elementy Shopify.

Po wybraniu szablonu nadszedł czas, aby dostosować go za pomocą swojego logo. Otwórz kartę Projekt i kliknij Prześlij logo . Po przesłaniu obrazu pamiętaj o zapisaniu zmian.

Otóż ​​to! Teraz sprawdź kasę w interfejsie, a zobaczysz stronę kasy Shopify w swoim sklepie WooCommerce .

Bonus: Usuń pola kasy WooCommerce

Na koniec zobaczmy, jak możesz usunąć niektóre pola z kasy.

Załóżmy, że nie chcesz, aby Twoja kasa WooCommerce była dokładnie taka jak Shopify, ale nadal chcesz uprościć stronę kasy i ukryć niepotrzebne pola. Ponieważ przyspiesza to proces płatności, pomoże to zwiększyć współczynniki konwersji i zmniejszyć porzucanie koszyka.

Najłatwiejszym sposobem na usunięcie kasy jest użycie wtyczki WooCommerce Checkout Manager .

To narzędzie pozwala łatwo dostosować stronę kasy, dodając, ukrywając i edytując pola kasy zgodnie z własnymi potrzebami.

Zainstaluj i aktywuj wtyczkę

Najpierw przejdź do Wtyczki> Dodaj nowy i wyszukaj wtyczkę. Następnie zainstaluj i aktywuj . Jest to narzędzie freemium, dzięki któremu możesz pobrać bezpłatną wersję lub uzyskać jeden z planów premium, które zawierają bardziej zaawansowane funkcje i zaczynają się od zaledwie 19 USD (płatność jednorazowa).

Edytuj stronę kasy

Po zainstalowaniu wtyczki przejdź do WooCommerce > Ustawienia i otwórz zakładkę Kasa . Zobaczysz wszystkie opcje edycji strony kasy WooCommerce.

Dodatkowo przejdź do zakładki Płatności, ponieważ znajduje się tam większość pól kasy. Po prostu przejdź do karty Płatności i użyj przełącznika Wyłączone , aby usunąć żądane pola kasy. Możesz również ustawić je jako obowiązkowe lub nie, używając przełącznika Wymagane .

Gdy dokonasz wyboru, nie zapomnij zapisać zmian . Następnie spójrz na kasę w interfejsie, a zobaczysz swoją nową stronę kasy.

Jeśli potrzebujesz więcej pomocy w tym procesie, zapoznaj się z naszym przewodnikiem, aby usunąć pola kasy WooCommerce. Jeśli chcesz tylko usunąć pola bez dodawania lub edytowania istniejących, możesz użyć innej wtyczki o nazwie Direct Checkout.

Wniosek

Podsumowując, domyślna płatność Shopify jest czystsza i prostsza niż ta WooCommerce. W tym przewodniku widzieliśmy, jak sprawić, by płatność WooCommerce wyglądała jak Shopify w swoim sklepie. Najwygodniejszą metodą jest użycie wtyczek, a my pokazaliśmy Ci proces za pomocą dwóch różnych narzędzi.

Bloki WooCommerce są bezpłatne i używają bloków do edycji strony kasy, podczas gdy CheckoutWC to wtyczka premium , która zawiera wiele szablonów kasy, które pomogą Ci dostosować stronę kasy. Obie wtyczki wykonują swoją pracę i są bardzo łatwe w użyciu, więc wybierz tę, która najlepiej odpowiada Twoim potrzebom.

Dodatkowo pokazaliśmy Ci również, jak usunąć pola kasy WooCommerce, aby jeszcze bardziej dostosować stronę kasy i poprawić współczynniki konwersji. Uprości to stronę kasy i przyspieszy proces kasy.

Aby dowiedzieć się więcej o tym, jak najlepiej wykorzystać kasę, zobacz, jak edytować stronę kasy WooCommerce. Jeśli podobał Ci się ten post, zapoznaj się z następującymi samouczkami:

• Jak stworzyć jednostronicową kasę WooCommerce
• Różne sposoby dodawania opłat do kasy
• Jak dodać pola warunkowe do kasy WooCommerce