Jak dodać wybrane pola przez Select2 w formularzu rejestracyjnym WordPress?

Jeśli chcesz tworzyć zaawansowane formularze rejestracyjne, możesz użyć pól Select2 WordPress zamiast pola Select.

Zastanawiasz się, jak możesz to zrobić? Cóż, jesteś we właściwym miejscu!

W tym artykule dowiesz się, czym jest pole WordPress Select2, jakie jest jego znaczenie i czym różni się od standardowego pola Select2.

Przeprowadzimy również krok po kroku proces dodawania pola do formularza rejestracyjnego. Dlatego koniecznie przeczytaj artykuł do końca!

Co to jest Select2? Czym różni się od standardowego wyboru?

Mówiąc prościej, technologia Select2 zapewnia konfigurowalne pola Select. Oznacza to, że możesz dodawać funkcje, takie jak wyszukiwanie, tagowanie, nieskończone przewijanie itp. Do pola Wybierz.

Pewnie zastanawiasz się, czym różni się pole Select2 od standardowego pola Select. Dowiedzmy Się!

Wybierz kontra Wybierz2

Standardowe pole Select prezentuje listę dostępnych opcji w rozwijanym menu. Użytkownik może wybrać jedną z tych opcji, przewijając, aby znaleźć opcję.

Pole Select2 ma wszystkie operacje, które oferuje standardowe pole Select. W ten sposób umożliwia również użytkownikom wybór jednej z dostępnych opcji.

Jednak Select2 oferuje większą elastyczność i dostosowanie.

Daje użytkownikowi pole wyszukiwania, w którym może wpisać opcję. Opcja dopasowania jest następnie automatycznie wyświetlana użytkownikowi.

Ponadto pola Select2 ułatwiają również oznaczanie i przewijanie w nieskończoność, w przeciwieństwie do standardowych pól Select.

Select2 vs. Multi Select2

Technologia Select2 obsługuje zarówno jednowartościowe, jak i wielowartościowe pola wyboru. Pole wyboru z pojedynczą wartością jest po prostu nazywane polem Select2.

Z drugiej strony wielowartościowe pole wyboru jest określane jako pole Multi Select2 lub Pillbox.

Działają dość podobnie; oba obsługują konfigurowalne pola wyboru.

Jedyną istotną różnicą jest to, że Multi Select2 pozwala użytkownikom wybrać wiele opcji z dostępnych opcji. Wszystkie opcje wybrane przez użytkownika pojawiają się w pudełku, jak bunkry, stąd nazwa.

Ta funkcja nie występuje w zwykłym polu Select2.

Po co dodawać pole Select2 WordPress w formularzu rejestracyjnym?

Wprowadzenie do pól Select2 pomogło Ci lepiej zrozumieć tę technologię.

Ale jaką wartość wnosi do formularza rejestracyjnego? Dlaczego nie użyć po prostu standardowego pola Select do rejestracji?

Cóż, spójrzmy na kilka powodów, dla których warto dodać pole Select2 WordPress do formularza rejestracyjnego:

• Pole Select2 pomaga użytkownikom łatwo znaleźć odpowiednią opcję za pomocą pola wyszukiwania.
• Użytkownicy nie muszą przewijać całej listy, aby znaleźć wybór, którego szukają.
• Możesz pozwolić użytkownikom wyszukiwać i wybierać wiele opcji.
• Pole obsługuje nieskończone przewijanie, więc opcje ładują się, gdy użytkownik przewija w dół.
• Select2 pola sprawiają, że proces rejestracji jest szybki i łatwy dla użytkowników.
• Doskonałe doświadczenie użytkownika zachęca użytkowników do wypełniania i przesyłania formularzy rejestracyjnych.

Dlatego sugerujemy dodanie pola Select2 do formularzy rejestracyjnych zamiast standardowego pola Select.

A jaki jest najlepszy sposób dodania pól Select2 do niestandardowego formularza? Zbadajmy to w następnej sekcji.

Najlepszy sposób na dodanie pól Select2 w formularzu rejestracyjnym

WordPress nie pozwala dodawać pól Select2 do domyślnego formularza rejestracyjnego bez rozbudowanego kodowania.

Ale po co polegać na kodowaniu, skoro można korzystać z pól Select2 w znacznie prostszy sposób?

Wtyczka User Registration pomaga wstawiać i dostosowywać pola Select2 i Multi Select2 w formularzach rejestracyjnych bez kodowania.

Wszystko, czego potrzebujesz, to rozszerzenie Advanced Fields. Dlatego jest to najlepszy sposób na dodanie pól Select2 do formularzy rejestracyjnych.

Poza tym User Registration to wtyczka do formularza rejestracyjnego.

Dlatego możesz tworzyć nieograniczoną liczbę niestandardowych formularzy rejestracyjnych z polami Select2 dla swojej witryny. A interfejs konstruktora typu „przeciągnij i upuść” sprawia, że ​​proces jest bardzo szybki!

Co więcej, rejestracja użytkownika jest idealnym dodatkiem do stron internetowych WooCommerce. Ta niesamowita wtyczka WordPress pomaga tworzyć niestandardowe formularze rejestracyjne WooCommerce i synchronizować je ze stroną kasy.

To tylko kilka najważniejszych cech wtyczki User Registration. Jeśli chcesz dowiedzieć się więcej o tej wtyczce, odwiedź oficjalną stronę.

Na razie przejdźmy do przewodnika krok po kroku, w którym użyjemy rejestracji użytkownika, aby zademonstrować proces.

Jak dodać pole Select2 w formularzu rejestracyjnym WordPress?

Oto kompletny przewodnik po dodawaniu pól WordPress Select2 w formularzu rejestracyjnym.

Ostrożnie wykonaj wszystkie kroki, a w mgnieniu oka powinieneś mieć gotowy formularz rejestracyjny z polem Select2!

Krok 1: Skonfiguruj Pro rejestracji użytkownika

Instalacja i aktywacja User Registration Pro na Twojej stronie to pierwszy krok. Jest to wersja premium bezpłatnej wtyczki User Registration.

Aby uzyskać wtyczkę pro, kup dowolny z trzech planów cenowych na oficjalnej stronie rejestracji użytkownika.

Następnie skonfiguruj User Registration Pro na swojej stronie internetowej. Jeśli potrzebujesz pomocy, postępuj zgodnie z naszym przewodnikiem, jak prawidłowo zainstalować rejestrację użytkownika.

Po pomyślnym skonfigurowaniu wtyczki możesz przejść do następnego kroku.

Krok 2: Zainstaluj i aktywuj dodatek Advanced Fields

User Registration Pro zapewnia dostęp do dodatku Advanced Fields.

Jak sama nazwa wskazuje, dodaje kilka zaawansowanych pól do konstruktora formularzy, w tym pola Select2 i Multi Select2.

Aby więc z nich korzystać, musisz zainstalować i aktywować dodatek Advanced Fields .

Możesz to łatwo zrobić na stronie Rejestracja użytkownika >> Rozszerzenia na pulpicie nawigacyjnym WordPress.

Tutaj wyszukaj dodatek i kliknij przycisk Zainstaluj dodatek . Po zakończeniu instalacji naciśnij przycisk Aktywuj .

Teraz jesteś gotowy do użycia pól Select2 WordPress w formularzu rejestracyjnym.

Krok 3: Utwórz nowy formularz rejestracyjny z polami Select2

W trzecim kroku utwórzmy nowy formularz rejestracyjny, w którym można dodać pola Select2.

Rozpocznij od przejścia do Rejestracja użytkownika >> Dodaj nowy .

Jak widać, na początek możesz wybrać wstępnie zaprojektowany szablon.

Rejestracja użytkownika oferuje różne szablony, takie jak formularz rejestracji studenta , formularz zgłoszenia reklamy i inne.

W przeciwnym razie możesz zacząć budować formularz rejestracyjny od podstaw. Kliknij Rozpocznij od podstaw i nazwij formularz.

Po naciśnięciu przycisku Kontynuuj zostaniesz przeniesiony do narzędzia do tworzenia formularzy metodą „przeciągnij i upuść”.

Formularz ma cztery domyślne pola: Nazwa użytkownika , Adres e-mail użytkownika , Hasło użytkownika i Potwierdź hasło .

Resztę potrzebnych pól możesz przeciągnąć z lewej strony do formularza po prawej stronie. Możesz także zmienić rozmieszczenie pól, po prostu przeciągając je.

Co najważniejsze, upewnij się, że dodałeś również pola Select2 do formularza.

Rejestracja użytkownika obejmuje dwa rodzaje pól Select2: Select2 i Multi Select2 . Możesz dodać dowolne z tych pól do formularza zgodnie z własnymi wymaganiami.

Gdy skończysz, naciśnij przycisk Aktualizuj formularz u góry.

Dlatego utworzyłeś nowy formularz rejestracyjny z polem Select2 WordPress.

Krok 4: Dostosuj pola Select2 i Multi Select2

Najlepszą rzeczą w Rejestracji użytkownika jest to, że możesz dostosować wszystkie pola, które dodajesz do formularza.

Wszystko, co musisz zrobić, to kliknąć pole, które chcesz edytować, a jego Opcje pola otworzą się po lewej stronie.

Kliknij dodane pole Select2. W Opcjach pola możesz edytować następujące ustawienia:

Ustawienia główne

W tej sekcji możesz edytować etykietę pola, opis itp. Możesz także ustawić pole jako wymagane, ukryć jego etykietę lub włączyć podpowiedź.

Poza tym sekcja Opcje pomaga dodawać, edytować i usuwać opcje. Kliknij + , aby dodać opcję i –, aby ją usunąć. Możesz zmienić nazwy wyborów, edytując pole tekstowe.

Co więcej, możesz zmienić kolejność opcji, przeciągając je w górę lub w dół. A jeśli masz długą listę opcji, wtyczka umożliwia dodawanie ich zbiorczo .

Zaawansowane ustawienia

Ustawienia zaawansowane umożliwiają dodawanie niestandardowych klas CSS dla pola. Możesz również zezwolić na dynamiczne wypełnianie pola, podając nazwę parametru.

Należy pamiętać, że opcje pól różnią się w zależności od pola formularza.

Na przykład pole Multi Select2 ma podobne ustawienia ogólne . Jednak Ustawienia zaawansowane oferują dwie nowe opcje:

• Limit wyboru: Ustaw maksymalną liczbę wyborów, które użytkownik może wybrać.
• Wybierz wszystko: Pozwól użytkownikom wybrać wszystkie opcje dostępne na liście.

Dostosuj więc odpowiednio każde pole i naciśnij przycisk Aktualizuj formularz .

Krok 5: Skonfiguruj ustawienia formularza rejestracyjnego

Twój formularz rejestracyjny nie jest kompletny, dopóki nie skonfigurujesz jego ustawień formularza.

W tym celu przejdź do zakładki Ustawienia formularza w kreatorze. Tutaj możesz skonfigurować dwa rodzaje ustawień: Ogólne i Dodatki .

Sekcja Ogólne umożliwia wybranie opcji zatwierdzania i logowania użytkownika , domyślnej roli użytkownika , szablonu formularza itp.

Możesz także włączyć silne hasła i obsługę CAPTCHA. Poza tym możesz ustawić adres URL przekierowania , tekst przycisku przesyłania , klasę formularza i inne.

Ustawienia Dodatków pozwalają włączyć formularz przyjazny dla klawiatury , aktywować ochronę przed spamem przez Honeypot , włączyć białą/czarną listę domen itp.

Po zakończeniu konfiguracji naciśnij przycisk Aktualizuj formularz .

Krok 6: Wyświetl niestandardowy formularz rejestracyjny w swojej witrynie

Na koniec Twój formularz rejestracyjny z polem Select2 jest gotowy do opublikowania na Twojej stronie.

Aby to zrobić, otwórz istniejącą stronę lub post, w którym chcesz wyświetlić niestandardowy formularz.

Spowoduje to przejście do edytora Gutenberga. Tutaj kliknij wstawkę bloku i dodaj blok rejestracji użytkownika do strony.

Następnie wybierz przycisk opcji Formularz rejestracyjny i wybierz utworzony wcześniej formularz z listy rozwijanej.

Na koniec naciśnij przycisk Aktualizuj u góry, aby udostępnić formularz w swojej witrynie.

Jeśli tworzysz nową stronę lub post, wykonaj te same czynności, co powyżej. Następnie naciśnij przycisk Publikuj na końcu.

Gratulacje! Teraz Twoja witryna ma niestandardowy formularz rejestracyjny z polem Select2 WordPress.

Podsumowanie!

To kończy nasz artykuł na temat dodawania pól Select2 WordPress w formularzu rejestracyjnym.

Podsumowując, możesz dodać pola Select2 zamiast standardowych pól Select, aby stworzyć bardziej zaawansowane formularze rejestracyjne.

Wtyczka User Registration pomaga to zrobić bez kłopotów. Wszystko, co musisz zrobić, to dodać pola Select2 i Multi Select2 do swojego formularza i dostosować je.

Poza tym rejestracja użytkownika jest równie pomocna w zapobieganiu rejestracji spamu, zmianie domyślnego adresu URL logowania na niestandardowy adres URL i nie tylko.

Dowiedz się więcej o tej potężnej wtyczce na naszym blogu. Możesz również obejrzeć samouczki wideo na naszym kanale YouTube.

Śledź nas również na Twitterze i Facebooku, aby być na bieżąco z nowymi artykułami.