Jak dostosować swoją stronę logowania i rejestracji WordPress? (z wideo)

Ostatnia aktualizacja - 13 października 2021

Rejestracja i logowanie na stronie powinno być dziecinnie proste. I chociaż domyślna strona logowania i rejestracji WordPress jest minimalna, prawdopodobnie nie pasuje do estetyki Twojej witryny. Nie wita też użytkowników z ufnością.

Jeśli więc chcesz, aby domyślna strona logowania do Twojej witryny wyglądała bardziej profesjonalnie, oto nasz przewodnik dotyczący dostosowywania strony logowania i rejestracji.

Instalowanie i konfigurowanie wtyczki rejestracji użytkownika

Wtyczki takie jak Profile Builder , Ultimate Member i User Registration doskonale nadają się do dostosowywania strony logowania i rejestracji WordPress. Użyjemy wtyczki User Registration firmy WP Everest.

Zanim zaczniemy, upewnij się, że funkcja rejestracji jest włączona dla Twojej witryny WordPress. Przejdź do Ustawienia> Ustawienia ogólne . Tutaj włącz opcję „Każdy może się zarejestrować”. Wybierz także domyślną rolę dla nowych użytkowników. Najlepiej ustawić go jako subskrybenta. Zapisz zmiany, gdy skończysz.

Następnie zainstaluj wtyczkę User Registration z repozytorium WordPress. Po aktywacji zobaczysz monit o automatyczne dodanie nowych stron rejestracji użytkownika, takich jak Zarejestruj się i Moje konto. Kliknij „Zainstaluj strony rejestracji użytkownika”.

Na naszej stronie pojawiły się dwie nowe strony, które zostaną automatycznie dodane do menu. Jednak nasze nowe strony logowania i rejestracji mają proste i bezpośrednie podejście, ale możemy łatwo zmienić pola i inne ustawienia.

Przejdź do Rejestracja użytkownika> Ustawienia . Tutaj możemy wybrać, co dzieje się po zarejestrowaniu gościa; możesz poprosić odwiedzających o ręczne zalogowanie się po rejestracji, możesz poprosić ich o potwierdzenie adresu e-mail przed zalogowaniem, możesz dać im natychmiastowy dostęp do ich konta po rejestracji lub możesz wymagać zatwierdzenia przez siebie lub innego administratora, zanim odwiedzający będą mogli zaloguj się. Wybierz opcję, która ma sens dla Twojej witryny.

Poniżej możesz uniemożliwić dostęp do pulpitu WordPress dla niektórych ról użytkowników w Twojej witrynie. W następnej opcji możesz włączyć przycisk ukryj i pokaż hasło. Domyślnie odwiedzający nie mogą zobaczyć hasła ze względów bezpieczeństwa. Możesz jednak dodać przycisk, aby mogli zobaczyć hasło podczas pisania.

Poniżej możesz zarządzać innymi ustawieniami w sekcji Moje konto. Po zakończeniu kliknij Zapisz zmiany.

Następnie przejdź do opcji logowania.

W pierwszym ustawieniu możesz wybierać spośród różnych wyglądów formularza logowania. Poniżej możesz włączyć lub wyłączyć opcje zapamiętania mnie i utraconego hasła, ukryć etykiety pól i włączyć Google reCaptcha.

Możesz również przekierować nowych użytkowników do strony rejestracji ze strony logowania. Udaj się na stronę rejestracji i skopiuj jej adres URL. Następnie wklej go w polu Adres URL rejestracji.

Strona ustawień pozwala również dostosować etykiety, symbole zastępcze i wiadomości na stronie logowania.

W sekcji Wiadomości frontonu możesz wybrać tekst różnych komunikatów o sukcesach i błędach, które odwiedzający będą widzieć podczas rejestracji i logowania.

Gdy zmienisz tutaj wiadomość o pomyślnej rejestracji, każda osoba, która się zarejestruje, zobaczy nową wiadomość.

Na karcie Integracja możesz wprowadzić dane Google reCaptcha, aby włączyć reCaptcha na stronach logowania i rejestracji w celu zmniejszenia liczby spamerów. Możesz przeczytać nasz artykuł, aby dowiedzieć się o procesie włączania reCaptcha w Twojej witrynie .

W sekcji e-mail zobaczysz, że wtyczka utworzyła powiadomienia e-mail, które użytkownicy będą otrzymywać. Możesz wyłączyć te wiadomości e-mail lub edytować ich temat i treść wiadomości e-mail zgodnie z własnymi preferencjami.

W sekcji Import/Eksport możesz importować i eksportować użytkowników i formularze do swojej witryny WordPress.

Dostosowywanie strony rejestracji

Istnieje możliwość edycji istniejącego formularza, aby był bardziej atrakcyjny wizualnie. Zacznijmy jednak od zera. Przejdź do Rejestracja użytkownika> Dodaj nowy .

Nadaj tutaj tytuł formularzowi, aby odróżnić go od innych. Następnie zobaczysz, że układ wygląda podobnie do typowego kreatora stron z blokami po lewej stronie i obszarem podglądu na żywo pośrodku. Możesz dodać długą listę pól, takich jak adres e-mail, imię, strona internetowa, dodatkowy adres e-mail, menu rozwijane, pole wyboru, polityka prywatności, tytuł sekcji, zdjęcie profilowe, a nawet niektóre pola adresu rozliczeniowego WooCommerce.

Zacznijmy od dodania pola nazwy użytkownika. Przeciągnij element Nazwa użytkownika i upuść go tam, gdzie go potrzebujesz. Możesz zmienić położenie pól, przeciągając je w bloku wiersza.

Następnie kliknij pole, aby edytować jego opcje. Możemy dodać etykietę, opis i ustawić symbol zastępczy. Możemy również uczynić to pole obowiązkowym, wybierając „Tak” z rozwijanego menu Wymagane. Możemy również ukryć etykietę i dodać niestandardowe klasy w celu dalszego dostosowania.

W podobny sposób możesz dodać inne bloki, takie jak imię, nazwisko i potwierdzenie hasła. Jeśli zbyt wiele pól sprawia, że ​​formularz wygląda na bardzo długi, możesz go skondensować, dzieląc go na dwie kolumny.

Do formularza możesz dodać dowolną liczbę wierszy. I dodaj pola, takie jak rozwijane kwestionariusze, aby formularz działał zgodnie z potrzebami Twojej witryny.

Kiedy skończysz, kliknij „Utwórz formularz”. Formularz został dodany do zakładki rejestracji użytkownika. Teraz wystarczy go aktywować. Więc skopiuj jego skrót.

Następnie przejdź do zakładki Strony i kliknij edytuj pod stroną Rejestracja. Tutaj usuń stary kod i wklej nowy. Następnie kliknij Aktualizuj.

Strona rejestracyjna naszej witryny została zaktualizowana do tej, którą właśnie utworzyliśmy. Możesz dalej dostosowywać i stylizować stronę, klikając Edytuj za pomocą Elementora.

Tutaj możesz dostosować stronę za pomocą Elementora, tak jak każdą inną stronę, używając elementu Shortcode. Możesz dodać przekładki, użyć tła, dodać grafikę i dokonać wielu innych dostosowań. Możesz również obejrzeć nasz film instruktażowy dotyczący Elementora, aby dowiedzieć się więcej.

Oprócz tego wtyczka User Registration oferuje płatne rozszerzenia umożliwiające dodanie większej liczby pól, umożliwienie logowania społecznościowego, korzystanie z dostosowywania stylu i wiele innych funkcji. Możesz je wypróbować zgodnie z potrzebami Twojej witryny i własnymi preferencjami.

Jeśli masz jakiekolwiek pytania dotyczące dostosowania formularza logowania i rejestracji, skontaktuj się z nami w komentarzach poniżej.

Jeśli wolisz wersję wideo, obejrzyj poniższy film:

Dalsza lektura

• 10 najlepszych wtyczek logowania i rejestracji WooCommerce
• 8 najlepszych wtyczek do logowania społecznościowego WooCommerce (2021)
• Szczegółowy przewodnik po panelu administratora WordPress