Jak dostosowujemy strony logowania WooCommerce (3 metody)

Jeśli chcesz zapewnić klientom płynniejsze doświadczenie w Twoim sklepie WooCommerce, stworzenie niestandardowej strony logowania jest świetnym punktem wyjścia.

Domyślna strona logowania WordPress wygląda prosto i nie pasuje do brandingu Twojego sklepu. Dostosowując ją, możesz sprawić, że proces logowania będzie bardziej profesjonalny i zgodny z marką.

W WPBeginner pomogliśmy wielu użytkownikom w tworzeniu niestandardowych stron logowania, a najłatwiejszym sposobem jest użycie konstruktora stron, takiego jak SeedProd, lub wtyczki do formularzy, takiej jak WPForms.

W tym samouczku pokażę Ci, jak zaprojektować całkowicie niestandardową stronę logowania WooCommerce i udostępnię potężne narzędzie, którego możesz również użyć do dostosowania strony logowania przy kasie.

Dlaczego warto stworzyć niestandardową stronę logowania klienta WooCommerce?

Dostosowywanie stron logowania WooCommerce pozwala na dodanie logo i zmianę projektu, aby pasował do Twojej strony. Dzięki temu Twoja witryna wygląda bardziej profesjonalnie i zapewnia lepsze wrażenia użytkownika.

Pozwala również na dodawanie większej liczby pól formularza, a nawet umożliwia promowanie konkretnych produktów lub wyświetlanie specjalnych ofert klientom.

W przeciwnym razie, gdy klienci zalogują się do Twojego sklepu WooCommerce, zobaczą domyślną stronę logowania WordPress z tylko logo i brandingiem WordPress.

Ta strona jest w porządku, jeśli chcesz po prostu uzyskać dostęp do panelu administracyjnego swojej witryny. Jednak klienci mogą być zniechęceni prostym projektem i uznać za podejrzane, że strona logowania nie pasuje do wyglądu Twojej witryny.

Biorąc to pod uwagę, zobaczmy, jak możesz stworzyć niestandardową stronę logowania klienta w WooCommerce.

Poniższe szybkie linki pozwalają przejść do różnych metod w naszym samouczku:

• Metoda 1: Utwórz całkowicie niestandardową stronę logowania WooCommerce za pomocą SeedProd
• Metoda 2: Dostosuj formularz logowania klienta WooCommerce za pomocą WPForms
• Dodatkowa wskazówka: Dostosuj stronę logowania do realizacji zakupu w WooCommerce
• Często zadawane pytania dotyczące stron logowania WooCommerce

Metoda 1: Utwórz całkowicie niestandardową stronę logowania WooCommerce za pomocą SeedProd

Najlepszym sposobem na stworzenie niestandardowej strony logowania klienta WooCommerce jest użycie SeedProd. Jest to najlepszy kreator stron docelowych i motywów WordPress, a jego użycie jest niezwykle proste.

Możesz użyć kreatora przeciągnij i upuść SeedProd, aby dostosować projekt i układ strony lub motywu WordPressa bez dotykania ani jednej linii kodu.

Aby dowiedzieć się więcej, zapoznaj się z naszą szczegółową recenzją SeedProd.

Najpierw musisz zainstalować i aktywować wtyczkę SeedProd. Jeśli potrzebujesz pomocy, zapoznaj się z naszym przewodnikiem jak zainstalować wtyczkę WordPress.

Po aktywacji zobaczysz ekran powitalny SeedProd.

Wpisz swój klucz licencyjny i kliknij przycisk „Zweryfikuj klucz”. Klucz licencyjny znajdziesz w obszarze konta SeedProd.

Następnie możesz utworzyć niestandardową stronę logowania dla swojego sklepu WooCommerce.

Po prostu przejdź do SeedProd » Strony docelowe z panelu administracyjnego WordPress i kliknij przycisk „Ustaw stronę logowania”.

Następnie SeedProd pokaże Ci wiele szablonów. Możesz szybko wybrać jeden i dostosować go do swoich potrzeb. Pomaga to zaoszczędzić czas, a możesz użyć istniejącego projektu do stworzenia własnej strony logowania WooCommerce.

Wtyczka pozwala również na stworzenie strony logowania od podstaw przy użyciu pustego szablonu.

Po wybraniu szablonu otworzy się okno podręczne.

Wpisz nazwę swojej strony i kliknij przycisk „Zapisz i rozpocznij edycję strony”.

Następnie zobaczysz kreator stron metodą przeciągnij i upuść.

Teraz możesz dostosować stronę logowania, dodając nowe bloki do szablonu z menu po lewej stronie.

SeedProd oferuje standardowe bloki dla nagłówków, tekstów, obrazów, przycisków i innych.

Oprócz nich możesz dodać zaawansowane bloki, takie jak konkurs, formularz kontaktowy, przyciski udostępniania w mediach społecznościowych, formularz zapisu i inne.

Istnieją również bloki WooCommerce, takie jak ostatnie produkty, polecane produkty i najlepiej sprzedające się produkty, które można dodać do szablonu strony logowania.

Korzystając z bloków WooCommerce, możesz łatwo polecać swoje najlepsze produkty i promować oferty rabatowe, aby uzyskać więcej konwersji.

Poza tym SeedProd pozwala również na dalsze dostosowywanie każdej sekcji na stronie logowania. Po prostu kliknij sekcję, a zobaczysz więcej opcji, takich jak edycja etykiety, koloru, czcionki i odstępów.

Po zakończeniu dostosowywania strony logowania WooCommerce, nie zapomnij kliknąć przycisku „Zapisz” na górze.

Następnie możesz przejść do zakładki „Ustawienia strony” i kliknąć przełącznik „Status strony”, aby zmienić ją z wersji roboczej na opublikowaną. Następnie możesz kliknąć przycisk „Zapisz” i zamknąć kreator stron.

Stąd wszystko, co pozostało, to sprawić, aby Twoja nowa niestandardowa strona logowania WooCommerce wyświetlała się użytkownikom. Aby to zrobić, przejdź do SeedProd » Strony docelowe w panelu administracyjnym WordPress.

Po prostu kliknij przełącznik pod „Strona logowania”, aby był zielony i wyświetlał „Aktywny”.

Po włączeniu tej opcji Twoja nowa strona logowania pojawi się na Twojej stronie internetowej WordPress!

Możesz odwiedzić swój sklep e-commerce, aby zobaczyć go w akcji.

Metoda 2: Dostosuj formularz logowania klienta WooCommerce za pomocą WPForms

Czy chcesz utworzyć formularz logowania, który pasuje również do Twojego motywu strony internetowej i oferuje więcej pól formularza?

Domyślny formularz logowania WordPress pozwala użytkownikom jedynie na wprowadzenie adresu e-mail lub nazwy użytkownika wraz z hasłem.

Główną zaletą korzystania z wtyczki formularzy jest elastyczność. Pozwala ona umieścić formularz logowania w dowolnym miejscu sklepu internetowego, na przykład w pasku bocznym lub na stronie produktu, co jest wygodne dla klientów.

Najlepszym sposobem na to jest użycie WPForms. Jest to najlepszy konstruktor formularzy WordPress, który jest przyjazny dla początkujących. Ponad 6 milionów stron internetowych używa WPForms do tworzenia inteligentniejszych formularzy.

W WPBeginner użyliśmy jej do tworzenia formularzy kontaktowych i corocznych ankiet i bardzo nam się podoba. Aby dowiedzieć się więcej, zapoznaj się z naszą pełną recenzją WPForms.

Możesz łatwo stworzyć niestandardowy formularz logowania WooCommerce i wyświetlić go w dowolnym miejscu swojego sklepu internetowego, na przykład w pasku bocznym lub na stronie produktu.

Najpierw musisz zainstalować i aktywować wtyczkę WPForms. Jeśli potrzebujesz pomocy, zapoznaj się z naszym przewodnikiem jak zainstalować wtyczkę WordPress.

Po aktywacji możesz przejść do WPForms » Ustawienia z poziomu panelu administracyjnego WordPress i wprowadzić klucz licencyjny. Klucz licencyjny znajdziesz w obszarze konta WPForms.

Następnie musisz przejść do sekcji WPForms » Dodatki w panelu administracyjnym WordPress.

Następnie przewiń w dół do „Dodatku do rejestracji użytkowników”, a następnie kliknij przycisk „Zainstaluj dodatek”.

Teraz jesteś gotowy do stworzenia niestandardowego formularza logowania dla WooCommerce. Po prostu przejdź do WPForms » Dodaj nowy, aby uruchomić kreator formularzy.

Na następnym ekranie możesz wprowadzić nazwę swojego formularza na górze. Następnie wyszukaj szablon „User Login Form” i kliknij przycisk „Use Template”.

Następnie możesz dostosować szablon formularza logowania użytkownika za pomocą kreatora przeciągnij i upuść. WPForms bardzo ułatwia dodawanie różnych pól do formularza lub zmianę kolejności istniejących pól w szablonie.

Na przykład, możesz dodać zaawansowane pola, takie jak numery telefonów, przeciągając je z menu po lewej stronie i upuszczając na szablonie.

Możesz dalej dostosowywać każde pole formularza w szablonie. Po prostu kliknij na dowolne pole i edytuj jego etykietę, dodaj opis i oznacz je jako pole wymagane w formularzu.

Następnie możesz przejść do zakładki „Ustawienia” w kreatorze formularzy. W sekcji Ustawienia ogólne możesz zmienić „Tekst przycisku wysyłania” na „Zaloguj”.

Następnie możesz przejść do zakładki „Potwierdzenia”, aby zmienić to, co stanie się po pomyślnym zalogowaniu użytkownika.

Po prostu kliknij menu rozwijane „Typ potwierdzenia” i wybierz opcję. Możesz wyświetlić klientom komunikat, pokazać stronę lub przekierować ich na określony adres URL.

Na przykład możesz dodać formularz logowania WooCommerce do strony produktu i pozwolić klientom szybko się zalogować, aby kupić Twój produkt.

Po zakończeniu po prostu kliknij przycisk „Zapisz” u góry.

Następnie musisz dodać formularz logowania klienta WooCommerce do strony w swojej witrynie.

Po prostu kliknij przycisk „Osadź” u góry kreatora. Następnie możesz wybrać, czy umieścisz formularz na istniejącej stronie, czy utworzysz dla niego nową.

Na razie wybierzmy opcję „Utwórz nową stronę”.

Następnie musisz wprowadzić nazwę swojej strony i kliknąć przycisk „Zaczynajmy!”.

Następnie zobaczysz formularz logowania WPForms w obszarze treści WordPress.

Stąd możesz dostosować i stylizować swój formularz logowania, otwierając panel bloków po prawej stronie ekranu. W sekcji „Szablony” możesz wybierać spośród ponad 40 gotowych szablonów, aby nadać swojemu formularzowi logowania unikalny wygląd.

Możesz również zmienić styl i rozmiar pól formularza, etykiet, przycisków i innych elementów.

Gdy będziesz zadowolony z projektu, możesz podglądnąć swój formularz, opublikować nową stronę i wyświetlić niestandardowe logowanie WooCommerce dla swoich klientów.

Możesz również dodać swój formularz logowania WooCommerce do paska bocznego swojego sklepu. W ten sposób Twój formularz będzie pojawiał się na każdej stronie produktu i pozwoli klientom szybko się zalogować.

Po prostu przejdź do Wygląd » Widżety z panelu administracyjnego WordPress. Następnie kliknij przycisk „+” i dodaj blok widżetu WPForms.

Następnie możesz wybrać formularz logowania z menu rozwijanego i wprowadzić tytuł.

Po zakończeniu kliknij przycisk „Aktualizuj”.

Teraz możesz odwiedzić swój sklep internetowy, aby zobaczyć formularz logowania w pasku bocznym.

Aby uzyskać więcej sposobów na stworzenie niestandardowej strony logowania klienta WooCommerce, zapoznaj się z naszym przewodnikiem jak stworzyć niestandardową stronę logowania WordPress.

Dodatkowo możesz zapoznać się z naszym samouczkiem jak dodać menu nawigacyjne w WordPress, aby móc dodać swoją stronę logowania WooCommerce do nawigacji witryny.

Dodatkowa wskazówka: Dostosuj stronę logowania do realizacji zakupu w WooCommerce

WooCommerce pozwala powracającym odwiedzającym zalogować się podczas strony realizacji zakupu. Jednak ogólny lub nieporęczny formularz logowania na stronie realizacji zakupu może zakłócić proces zakupu i prowadzić do utraty sprzedaży.

Tworząc płynne, spójne z marką doświadczenie logowania na tym kluczowym etapie, możesz zmniejszyć liczbę porzuconych koszyków i zbudować większe zaufanie wśród klientów.

Najlepszym sposobem na to jest użycie potężnego wtyczki do tworzenia lejków, takiej jak FunnelKit.

Jest wyposażony w profesjonalnie zaprojektowane szablony, które zastępują domyślną stronę realizacji zakupu, zapewniając powracającym klientom znacznie lepsze i łatwiejsze doświadczenie logowania. Pomaga to zmniejszyć tarcie i zwiększa prawdopodobieństwo, że dokonają zakupu.

Masz również możliwość testowania A/B wielu lejków, stron sprzedaży i ofert upsell.

FunnelKit zapewnia szczegółowe analizy każdego etapu Twojego lejka WooCommerce.

Zawiera również potężny dodatek do automatyzacji marketingu, FunnelKit Automations.

Pozwala na dostosowywanie e-maili WooCommerce, wysyłanie powiadomień e-mailowych w WooCommerce o porzuconych koszykach, serie powitalne i wiele więcej.

Jeśli poważnie myślisz o rozwoju swojego sklepu WooCommerce, to jest to jedno z narzędzi, które polecamy.

Często zadawane pytania dotyczące stron logowania WooCommerce

Oto kilka pytań, które nasi czytelnicy często zadają na temat tworzenia stron logowania WooCommerce w WordPress:

Czy mogę używać tych niestandardowych stron logowania również dla zwykłych użytkowników WordPressa?

Tak, absolutnie. Metoda wykorzystująca SeedProd zastępuje domyślną stronę logowania WordPress dla wszystkich użytkowników, w tym administratorów i redaktorów. Metoda WPForms pozwala umieścić formularz logowania w dowolnym miejscu, który może być również używany przez każdą rolę użytkownika.

Czy muszę znać się na kodowaniu, aby dostosować moją stronę logowania?

Wcale nie. Zarówno SeedProd, jak i WPForms zostały zaprojektowane tak, aby były przyjazne dla użytkownika dzięki kreatorom typu „przeciągnij i upuść”. Możesz stworzyć profesjonalnie wyglądającą stronę logowania bez dotykania ani jednej linii kodu.

Czy utworzenie niestandardowej strony logowania WooCommerce jest bezpłatne?

Oba wtyczki oferują darmowe wersje do rozpoczęcia. Jednakże, aby uzyskać dostęp do konkretnych szablonów stron logowania i zaawansowanych funkcji pokazanych w tym samouczku, będziesz potrzebować wersji Pro jednej z wtyczek SeedProd lub WPForms.

Która metoda jest lepsza dla mojego sklepu, SeedProd czy WPForms?

Zależy to od Twoich konkretnych potrzeb. SeedProd jest idealny, jeśli chcesz stworzyć całkowicie oddzielną, w pełni zaprojektowaną stronę logowania, która idealnie pasuje do Twojej marki.

Z drugiej strony, WPForms jest lepszy, jeśli chcesz elastyczny formularz logowania, który możesz dodać w różnych miejscach na swojej stronie, takich jak pasek boczny lub strona realizacji zakupu.

Mamy nadzieję, że ten artykuł pomógł Ci dowiedzieć się, jak stworzyć niestandardową stronę logowania klienta WooCommerce. Możesz również zapoznać się z naszym wyborem najlepszych wtyczek WooCommerce oraz naszym przewodnikiem na temat ograniczania prób logowania w WordPress.

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.