Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Puchar WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Jak utworzyć własny formularz rejestracji użytkownika w WordPress?

Jeśli prowadzisz witrynę członkowską WordPress lub inną witrynę internetową, która umożliwia rejestrację użytkowników, to bezproblemowa rejestracja jest bardzo ważna. Jednak domyślny formularz rejestracji użytkownika WordPress jest nieco podstawowy.

Ponieważ ten domyślny formularz nie ma opcji konfiguratora i wyświetla branding WordPress, może kolidować z wyglądem twojej witryny internetowej.

W WPBeginner rozumiemy, jak ważne jest utrzymywanie spójnego brandingu we wszystkich punktach styku, w tym podczas rejestracji użytkowników.

Dodając własny formularz rejestracyjny, możesz poprawić wrażenia użytkowników dla nowych odwiedzających, zapewnić spójną tożsamość marki, a nawet zwiększyć liczbę rejestracji użytkowników na twojej witrynie internetowej WordPress.

Ten artykuł poprowadzi Cię przez proces tworzenia własnych front-endowych formularzy rejestracyjnych w WordPress.

How to Create a User Registration Form

Dlaczego warto dodać własny formularz rejestracji użytkownika w WordPress?

Domyślna strona rejestracji użytkownika WordPress pokazuje branding i logo WordPress, które nie pasują do reszty projektu Twojej witryny internetowej WordPress.

Utworzenie nowego formularza rejestracji użytkownika umożliwia utworzenie formularza rejestracji na dowolnej stronie witryny i pomaga zapewnić bardziej spójne wrażenia użytkownika podczas procesu rejestracji.

Dzięki formularzowi rejestracyjnemu możesz zbierać od użytkowników określone informacje, które mogą być unikatowe dla twojego bloga WordPress lub firmy.

Może to obejmować dodatkowe dane kontaktowe, preferencje lub inne informacje istotne dla funkcjonalności Twojej witryny.

Na przykład, jeśli organizujesz wydarzenie, formularz rejestracyjny pomoże Ci zebrać niezbędne informacje od uczestników, takie jak ograniczenia dietetyczne, preferencje sesji lub specjalne wymagania.

Własny formularz rejestracji użytkownika umożliwia również przekierowanie klientów po rejestracji. Możesz nawet wyświetlić dodatkowe pola profilu użytkownika, połączyć je z własnym front-endowym formularzem logowania i połączyć go z twoją usługą e-mail marketingu.

Powiedziawszy to, przyjrzyjmy się, jak krok po kroku stworzyć własny formularz rejestracji użytkownika w WordPress.

Jak utworzyć własny formularz rejestracji użytkownika w WordPress?

Najprostszym sposobem na stworzenie własnego formularza rejestracji użytkownika jest użycie WPForms. Jest to najlepsza wtyczka formularza kontaktowego WordPress, która umożliwia tworzenie wszelkiego rodzaju nowych formularzy w WordPress.

WPForms jest bardzo łatwy w użyciu i oferuje kreator formularzy typu „przeciągnij i upuść”, dzięki czemu możesz dowolnie konfigurować swój formularz rejestracyjny. Wtyczka integruje się również z popularnymi usługami e-mail marketingu i usługami płatniczymi, takimi jak PayPal.

Najpierw należy zainstalować i włączyć wtyczkę WPForms. Aby uzyskać bardziej szczegółowe instrukcje, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.

Uwaga: WPForms ma również darmową wersję. Musisz jednak przejść na plan pro, aby odblokować dodatek do rejestracji użytkowników.

Po włączaniu, udaj się na stronę WPForms ” Ustawienia z panelu bocznego administratora WordPress, aby wpisz swój klucz licencyjny.

Możesz uzyskać ten klucz ze swojego konta na witrynie internetowej WPForms.

Enter WPForms license key

Po zweryfikowaniu klucza należy przejść na stronę WPForms ” Addons z kokpitu WordPress.

W tym miejscu znajdź dodatek „User Registration Addon”, a następnie kliknij znajdujący się pod nim przycisk „Install Addon”.

Install user registration and login forms addon

WPForms zainstaluje i włączy teraz dodatek do rejestracji użytkowników na twojej witrynie WordPress. Po zainstalowaniu dodatku status zmieni się na „Aktywny”.

Jesteś teraz gotowy do stworzenia własnego formularza rejestracji użytkownika.

Aby to zrobić, przejdź na stronę WPForms ” Dodaj nowy z panelu bocznego administratora.

Spowoduje to przejście do strony „Wybierz szablon”, na której można rozpocząć od wpisania rodzaju nazwy formularza, który zamierzasz utworzyć.

Gdy to zrobisz, po prostu znajdź szablon „Formularz rejestracji użytkownika” i kliknij przycisk „Użyj szablonu” pod nim.

Select the user registration form template

Spowoduje to uruchomienie kreatora formularzy WPForms na twoim ekranie. Powiadomienie wyświetli opcje pól w prawej kolumnie i podgląd formularza w lewym rogu ekranu.

Teraz domyślny formularz rejestracyjny będzie miał już dodane pola nazwy, nazwy użytkownika, hasła, e-maila i krótkiego biogramu.

Możesz jednak łatwo dodać więcej pól do formularza z lewego panelu, a także przeciągnąć pola, aby zmienić ich kolejność.

Add more form fields in your user registration form

Wtyczka umożliwia również edycję każdego pola formularza. Aby to zrobić, wystarczy kliknąć dowolne pole formularza, a w lewej kolumnie pojawią się „Opcje pola”.

Z tego miejsca można zmienić etykietę pola, edytować jego format, dodać opis, skonfigurować formatowanie warunkowe, zmienić pole na wymagane i nie tylko.

Edit Field Options

Po zakończeniu nie zapomnij kliknąć przycisku „Zapisz”, aby zapisać twoje ustawienia.

Uwaga: Jeśli chcesz wysyłać powiadomienia e-mail do zarejestrowanych użytkowników, możesz zapoznać się z naszym poradnikiem na temat wysyłania wiadomości e-mail z potwierdzeniem po przesłaniu formularza WordPress.

Dodawanie pól własnych w twoim dostosowanym formularzu rejestracji użytkownika

WPForms pozwala również na podłączenie własnych pól profilu użytkownika do twojego formularza rejestracji użytkownika.

Aby to zrobić, będziesz musiał dodać dodatkowe pola profilu użytkownika do twojej witryny WordPress, a najłatwiejszym sposobem na to jest użycie wtyczki WordPress.

W tym poradniku używamy wtyczki Advanced Custom Fields. Jednak funkcja mapowania pól w WPForms będzie działać z każdą wtyczką, która używa standardowych pól własnych WordPress do dodawania i przechowywania metadanych użytkownika.

Najpierw należy zainstalować i włączyć wtyczkę Advanced Custom Fields. Aby uzyskać więcej informacji, możesz zapoznać się z naszym przewodnikiem dla początkujących, jak zainstalować wtyczkę WordPress.

Po włączaniu wtyczki, przejdź do strony ACF ” Field Groups z panelu bocznego administratora WordPress. Tutaj kliknij przycisk „+ Dodaj grupę pól”.

Click the Add Field group button

Spowoduje to przejście do strony „Utwórz nową grupę pól”, na której można rozpocząć od wpisania tytułu grupy pól.

W tym poradniku będziemy tworzyć własne pole dla szczegółów konta w mediach społecznościowych.

Add the field group name

Następnie przewiń w dół do menu rozwijanego „Field Type” i wybierz rodzaj pola własnego. Możesz wybrać tekst, liczby, obrazki, pliki, pola wyboru, adresy URL, hasła i wiele innych.

Gdy to zrobisz, wpisz etykietę pola, która pojawi się na stronie profilu.

Na przykład, jeśli chcesz dodać własne pole do zbierania profili na Facebooku, możesz nazwać etykietę pola „Facebook”.

Powiadomienie Nazwa pola zostanie wygenerowana automatycznie, gdy wpiszesz etykietę pola, ale możesz ją edytować.

Choose field type and label

Następnie przejdź do karty „Walidacja” w sekcji „Etykieta”. Tutaj możesz włączyć przełącznik „Wymagane”, aby klienci musieli wypełnić to własne pole przed wysłaniem formularza.

W tym miejscu można nawet ustawić limit znaków dla pola.

Toggle the required switch and add character limit

Gdy już to zrobisz, po prostu przełącz się na kartę „Prezentacja” od góry.

Można teraz dodawać instrukcje dla autorów, tekst zastępczy dla pola, atrybuty kontenera i nie tylko.

Configure the presentation settings

Następnie można również dodać logikę warunkową do tworzonego pola własnego, przełączając się na kartę „Logika warunkowa” od góry.

Po wprowadzeniu twoich zmian, przewiń w dół do sekcji „Reguły lokalizacji”. W tym miejscu należy utworzyć zestaw reguł określających, które ekrany będą korzystać z tych pól własnych.

Ponieważ chcemy, aby to pole pojawiło się dla wszystkich profili użytkowników, będziemy musieli wybrać opcję „Rola użytkownika” z menu rozwijanego po lewej stronie.

Następnie pozostaw menu rozwijane na środku bez zmian, a następnie wybierz opcję „Wszystkie” z menu rozwijanego po prawej stronie.

Teraz tworzona przez nas grupa pól własnych będzie wyświetlana dla wszystkich profili klientów.

Configure location rules

Następnie przejdź do karty „Ustawienia grupy” u góry.

Gdy już się tam znajdziesz, upewnij się, że grupa pól jest włączona, przesuwając przełącznik z Nie na Tak.

Toggle the active switch

Gdy to zrobisz, możesz również dodać inne konfiguratory do grupy pól, klikając przycisk „Dodaj pole” u góry strony.

Na przykład, jeśli chcesz utworzyć wiele pól mediów społecznościowych, możesz kliknąć przycisk „Dodaj pole” i rozpocząć konfigurowanie pola dla innych platform mediów społecznościowych.

Należy pamiętać, że wszystkie utworzone pola będą częścią tej samej grupy pól.

Po zakończeniu nie zapomnij kliknąć przycisku „Zapisz zmiany” u góry, aby zapisać twoje ustawienia.

Twoja grupa terenowa została pomyślnie opublikowana.

Save custom field group

Teraz, aby zobaczyć utworzone pole własne, przejdź do strony Użytkownik ” Profil z obszaru administracyjnego.

Tutaj zobaczysz swoje własne pola dodane na dole strony profilu.

View your custom field

Teraz, gdy utworzyłeś niestandardowe pole profilu użytkownika, musisz dodać je do niestandardowego formularza rejestracji użytkownika w WPForms.

Następnie należy również zmapować pole formularza do pola własnego, aby dane były prawidłowo przechowywane.

Aby to zrobić, przejdź na stronę WPForms ” Wszystkie formularze z kokpitu WordPress. Następnie kliknij odnośnik „Edytuj” pod formularzem rejestracji użytkownika, który właśnie utworzyłeś i zapisałeś wcześniej.

Spowoduje to otwarcie twojego formularza w kreatorze formularzy WPForms. Gdy już się tam znajdziesz, po prostu przeciągnij pole z lewego panelu, aby dodać je do twojego formularza.

W tym przykładzie dodajemy pole „Witryna internetowa/adres URL” do naszego formularza.

Add a website field to your registration form

Po dodaniu pola Witryna internetowa/adres URL kliknij je, aby otworzyć właściwości pola w lewej kolumnie.

Teraz zmień etykietę pola z Website/URL na nazwę utworzonej grupy pól.

Jeśli chcesz, możesz również dodać opis pola.

Edit the label of website field

Następnie nie zapomnij kliknąć przycisku „Zapisz”, aby zapisać twój formularz.

Następnie należy kliknąć przycisk „Ustawienia” w prawym rogu, aby uzyskać dostęp do zaawansowanych ustawień formularza i mapowania pól. Na stronie ustawień kliknij kartę „Rejestracja użytkownika”.

WPForms pokaże teraz twoje pola formularza i rozwijane menu pod nimi, aby wybrać pole rejestracji WordPress, z którym chcesz je zmapować.

Zauważysz, że WPForms automatycznie zmapuje twoje domyślne pola, takie jak imię i nazwisko, e-mail, hasło i inne.

W tym miejscu wybierz opcję nazwy twojej grupy pól z menu rozwijanego pod opcją „Witryna internetowa”.

Choose custom field from the website dropdown menu

Następnie przewiń w dół do sekcji „Custom User Meta”.

Możesz wpisz nazwę utworzonej wcześniej grupy pól w opcji własnego meta klucza, a następnie wybierz z rozwijanego menu własne pole formularza, z którym chcesz je zmapować.

Enter Custom User Meta details

Uwaga: Jeśli chcesz wysyłać powiadomienia e-mail do zarejestrowanych użytkowników, możesz zapoznać się z naszym poradnikiem na temat wysyłania wiadomości e-mail z potwierdzeniem po przesłaniu formularza WordPress.

Na koniec kliknij przycisk „Zapisz” w prawym górnym rogu ekranu, aby zapisać twoje ustawienia.

Dodanie własnego formularza rejestracji użytkownika w WordPressie

WPForms sprawia, że dodawanie formularzy do twoich wpisów WordPress, stron i paneli bocznych widżetów jest bardzo proste.

Najpierw musisz otworzyć istniejący lub nowy wpis/stronę, na której chcesz dodać własny konfigurator formularza rejestracji.

Gdy już tam będziesz, kliknij przycisk „Dodaj blok” (+) w lewym górnym rogu, aby otworzyć menu bloków.

Z tego miejsca zlokalizuj i dodaj blok WPForms do strony/wpisu.

Add user registration form to the block editor

Następnie możesz wybrać swój własny formularz rejestracyjny z rozwijanego menu w samym bloku.

Zobaczysz teraz podgląd twojego formularza rejestracyjnego w edytorze WordPress. Śmiało opublikuj swój wpis lub stronę, aby zobaczyć własny formularz rejestracyjny w działaniu.

User registration form preview

Dodanie własnego formularza rejestracji użytkownika do panelu bocznego

WPForms umożliwia również dodanie własnego formularza rejestracji użytkownika na panelu bocznym. Wystarczy przejść na stronę Wygląd ” Widżety z obszaru administracyjnego i kliknąć przycisk „Dodaj blok” (+).

Spowoduje to otwarcie menu bloków, z którego można dodać blok WPForms do karty panelu bocznego na stronie „Widżety”.

Następnie wystarczy wybrać formularz rejestracji użytkownika z menu rozwijanego w bloku WPForms.

Add user registration form as a widget

Po zakończeniu nie zapomnij kliknąć przycisku „Aktualizuj”, aby zapisać twoje ustawienia.

Teraz możesz przejść na swoją witrynę internetową, aby zobaczyć formularz rejestracji użytkownika w panelu bocznym witryny.

Preview of user registration form in the sidebar

Dodaj własny formularz rejestracji użytkownika w pełnym edytorze witryny.

Jeśli korzystasz z blokowego motywu WordPress, nie będziesz mieć strony z widżetami. Aby dodać formularz rejestracyjny na panelu bocznym za pomocą Full Site Editor (FSE), przejdź do strony Wygląd ” Edytor z paska bocznego administratora.

Następnie kliknij przycisk „Dodaj blok” (+) w lewym górnym rogu, aby otworzyć menu bloków.

Z tego miejsca musisz znaleźć i dodać blok WPForms do preferowanego miejsca na twojej witrynie internetowej.

Następnie wybierz formularz rejestracyjny z menu rozwijanego w samym bloku.

Add user registration form in full site editor

Na koniec kliknij przycisk „Zapisz”, aby zapisać twoje ustawienia.

Teraz przejdź na twoją witrynę internetową, aby zobaczyć własny formularz rejestracji użytkownika w działaniu.

User registration form preview

Bonus: Stwórz własną stronę logowania z twoim formularzem rejestracyjnym

Gdy dodasz formularz rejestracyjny do strony w witrynie internetowej, WordPress domyślnie użyje układu, szablonu i stylu twojego motywu.

Możesz jednak stworzyć oszałamiającą stronę rejestracji od podstaw za pomocą kreatora stron docelowych WordPress.

SeedProd to najlepszy kreator stron dla WordPress. Jest przyjazny dla użytkownika i oferuje kreator typu „przeciągnij i upuść”, który pomaga tworzyć wszelkiego rodzaju strony docelowe. Wtyczka oferuje również gotowe szablony i wiele funkcji dostosowywania.

Uwaga: SeedProd ma również darmową wersję, z której można korzystać. W tym poradniku będziemy jednak korzystać z wersji pro wtyczki, ponieważ zawiera ona szablon strony logowania użytkownika i zaawansowane funkcje konfiguratora.

Po pierwsze, musisz zainstalować i włączać wtyczkę SeedProd na twojej witrynie. Aby uzyskać szczegółowe instrukcje, warto zapoznać się z naszym poradnikiem na temat instalacji wtyczki WordPress.

Po włączaniu przejdź na stronę SeedProd ” Ustawienia, aby wpisz klucz licencyjny wtyczki. Informacje te można znaleźć na Twoim koncie w witrynie internetowej SeedProd.

Paste license key

Po zweryfikowaniu twojego klucza, jesteś teraz gotowy do utworzenia strony logowania z formularzem rejestracyjnym.

Aby rozpocząć, przejdź do ekranu SeedProd ” Landing Pages z panelu bocznego administratora, a następnie kliknij przycisk „Ustaw stronę logowania”.

Setup your login page

Spowoduje to przejście do ekranu „Wybierz szablon nowej strony”, na którym możesz wybrać gotowy szablon dla strony logowania, którą zamierzasz utworzyć.

Po wybraniu szablonu pojawi się wyskakujące okienko.

Musisz teraz wpisz nazwę twojej strony docelowej i adres URL. Gdy to zrobisz, kliknij przycisk „Zapisz i rozpocznij edycję strony”.

Enter a Name and URL for your login page

Następnie możesz edytować twoją stronę logowania za pomocą kreatora stron docelowych SeedProd typu „przeciągnij i upuść”.

Aby to zrobić, wybierz blok z menu po lewej stronie i przeciągnij go w miejsce, w którym chcesz go dodać na twojej stronie logowania.

Możesz na przykład dodać do swojej strony docelowej nagłówek, obrazek, film lub blok udostępniania w mediach społecznościowych.

Add blocks to your login page template

Gdy już to zrobisz, przejdź do sekcji Advanced Blocks w lewej kolumnie.

Z tego miejsca wybierz blok „Formularz kontaktowy” i umieść go na twojej stronie logowania.

Sugerujemy usunięcie istniejącego bloku nazwy użytkownika i hasła z szablonu, aby użytkownicy nie musieli dwukrotnie wpisywać danych uwierzytelniających.

Add the Contact Form block

Następnie kliknij blok WPForms na twojej stronie logowania, aby wyświetlić jego ustawienia w lewej kolumnie.

W menu pojawi się teraz opcja „Wybierz formularz”.

Następnie wybierz twój formularz rejestracyjny z rozwijanego menu.

Select your registration form in SeedProd

Powinieneś teraz zobaczyć podgląd twojego formularza rejestracyjnego w kreatorze landing page’y.

Na koniec nie zapomnij kliknąć przycisku „Zapisz”, aby zapisać twoje zmiany.

Preview of registration form in landing page builder

Następnie możesz przejść do karty „Połącz” i zintegrować różne usługi e-mail marketingu z twoim formularzem rejestracyjnym.

SeedProd łatwo integruje się z popularnymi usługami e-mail marketingu, takimi jak Drip, Constant Contact, AWeber i innymi, które mogą pomóc ulepszyć twoją listę mailingową.

Connect email marketing services

Następnie możesz przejść do karty „Ustawienia strony” i zmienić status strony na ” Opublikuj ” w ustawieniach ogólnych.

Na tej karcie można nawet edytować tytuł i adres URL strony oraz włączyć odnośnik SeedProd.

Publish your login page from the page settings

Jeśli chcesz zoptymalizować twoją stronę pod kątem wyszukiwarek, przejdź do karty SEO.

W tym miejscu można skonfigurować ustawienia, wpisz tytuł SEO, opis, miniaturkę w mediach społecznościowych i nie tylko.

SeedProd umożliwia również dodawanie fragmentów kodu w ustawieniach skryptów. Gdy będziesz zadowolony z ustawień, po prostu kliknij przycisk „Zapisz” u góry i zamknij kreator stron.

Make your login page active

Następnie przejdź do ekranu SeedProd ” Landing Pages i przełącz przełącznik pod Login Page, aby Twoja strona była „Aktywna”.

Możesz teraz przejść na twoją stronę logowania, aby zobaczyć formularz rejestracyjny w działaniu.

Registration form landing page preview

Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak łatwo dodać własny formularz rejestracji użytkownika w WordPress. Możesz również zapoznać się z naszym przewodnikiem dla początkujących, jak wybrać najlepszy kreator witryn internetowych lub naszymi najlepszymi wtyczkami do rejestracji użytkowników WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

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

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Najlepszy zestaw narzędzi WordPress

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

Reader Interactions

9 komentarzyZostaw odpowiedź

  1. Syed Balkhi

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Faisal

    How can I modify the confirmation email which is sent to the user after he submits the registration form? I don’t want to display certain info in the email such as the login link.

  3. Vikas Shukla

    How can we disable the default fron New User Approve plugin? or how we can apply woocommerce template to this one?

    Thanks

  4. Waseem Safdar

    Does it also fulfill the purpose of Theme My Login ?
    I mean if I install this I’d be able to cater to the mentioned plugin’s feature as well right?

    • Waseem Safdar

      No need to reply, I got my answer. Thank you. :)
      P.S: You people are doing a great job! Keep it up! :)

      • Mark Cub

        What was your answer? Does it do what Theme My Login does?

  5. Bongo

    I meant, will it allow me to create customs in general?

  6. Bongo

    Great plugin. Will this plugin allow me to add the form elements to my current default WooCommerce forms?

    Is having too many plugins safe for my WordPress site? Will it not slow down or be expose in terms of Security?

Zostaw odpowiedź

Dziękujemy za pozostawienie komentarza. Pamiętaj, że wszystkie komentarze są moderowane zgodnie z naszymi polityka komentarzy, a Twój adres e-mail NIE zostanie opublikowany. NIE używaj słów kluczowych w polu nazwy. Przeprowadźmy osobistą i konstruktywną rozmowę.