Jak skonfigurować pole rozwijane Multi Select w WordPress (Łatwy sposób)

Opublikowany: 2020-10-26

Czy musisz dodać pole rozwijane wielokrotnego wyboru w WordPressie? Listy rozwijane wielokrotnego wyboru to świetny sposób, aby użytkownicy mogli wybrać więcej niż 1 opcję z listy.

W tym artykule pokażemy Ci łatwy i szybki sposób tworzenia własnej listy rozwijanej wielokrotnego wyboru. Nie musisz pisać żadnego kodu, aby utworzyć menu rozwijane i dodać je do swojej witryny.

Utwórz teraz swój formularz WordPress

Jak wybrać wiele opcji z listy rozwijanej?

Korzystając z WPForms, możesz ustawić dowolne menu rozwijane jako menu wyboru wielokrotnego.

Gdy odwiedzający kliknie element na liście, lista rozwijana pozostanie otwarta, aby umożliwić mu dokonanie większej liczby wyborów.

Lista rozwijana WordPress multi w formularzu

WPForms to najlepsza wtyczka WordPress Form Builder. Zdobądź to za darmo!

Ta lista rozwijana umożliwia również przeszukiwanie dostępnych opcji. Jest więc idealny do długich list, takich jak rozwijana lista krajów.

Pokażemy Ci prosty sposób samodzielnego tworzenia listy rozwijanej wielokrotnego wyboru.

Jak skonfigurować pole rozwijane wielokrotnego wyboru w WordPress?

Przyjrzyjmy się krokom, przez które będziemy pracować w tym samouczku.

  1. Zainstaluj wtyczkę WPForms
  2. Stwórz swój formularz
  3. Dodaj pole rozwijane wielokrotnego wyboru do formularza
  4. Opublikuj swój formularz na swojej stronie internetowej

OK, zacznijmy od zainstalowania wtyczki, której będziemy używać.

Krok 1: Zainstaluj wtyczkę WPForms

WPForms to najlepszy kreator formularzy dla WordPressa. Tworzenie dowolnego formularza w witrynie za pomocą narzędzia do przeciągania i upuszczania jest bardzo łatwe.

Aby rozpocząć tworzenie formularza, zainstaluj i aktywuj wtyczkę WPForms w WordPress. Jeśli potrzebujesz pomocy w tym kroku, zapoznaj się z tym przewodnikiem dla początkujących dotyczącym instalowania wtyczki.

Wszystko gotowe? Przejdźmy dalej i stwórzmy Twój pierwszy formularz.

Krok 2: Stwórz swój formularz

Teraz stworzymy podstawowy formularz i dodamy do niego listę rozwijaną.

W tym przykładzie utworzymy formularz wolontariusza z selektorem dat i menu rozwijanym.

WPForms ma świetny szablon formularza zgłoszenia wolontariusza. Ale w tym przykładzie zamiast tego użyjemy prostego formularza kontaktowego jako punktu wyjścia.

Aby rozpocząć, otwórz pulpit nawigacyjny WordPress i kliknij WPForms » Dodaj nowy .

Dodaj nowy formularz, aby dodać wieloetapowe menu rozwijane

Śmiało i wpisz nazwę formularza u góry. Następnie kliknij szablon Prostego formularza kontaktowego, aby otworzyć go w przeglądarce.

Otwórz szablon prostego formularza kontaktowego w WPForms

Teraz szablon jest otwarty, zobaczysz, że mamy już 3 pola:

  • Nazwa
  • E-mail
  • Komentarz lub wiadomość

Zbuduj nowy formularz dla pola rozwijanego wielokrotnego wyboru

Dodajmy pole daty, aby osoba wypełniająca formularz mogła wybrać dzień, w którym chce pomóc.

Najpierw przejdź dalej i przeciągnij pole Data / godzina z lewej strony kreatora formularzy na prawą stronę. Następnie kliknij raz pole Data / Czas, aby otworzyć ustawienia.

Dostosujemy tutaj 2 podstawowe ustawienia:

  • Zmień tekst etykiety, aby dopasować go do formularza
  • Użyj menu rozwijanego, aby zmienić je tylko na pole Data .

Zmień pole daty i godziny na datę

Teraz przewiń w dół do opcji zaawansowanych i kliknij, aby rozwinąć ustawienia.

Rozwiń zaawansowane opcje pola daty

Chcemy wolontariuszy tylko w dni powszednie, więc kliknijmy Ogranicz dni , aby weekendy były wyszarzone. Aby to zrobić, wybierz od poniedziałku do piątku:

Limit dni w polu czasu i daty

OK, gotowe, więc możemy kliknąć Zapisz .

Przejdźmy do dodania naszej listy rozwijanej wielokrotnego wyboru.

Krok 3: Dodaj pole rozwijane wielokrotnego wyboru do formularza

W tym kroku dodamy pole rozwijane, a następnie dostosujemy je, aby akceptować wielokrotne wybory.

Najpierw przeciągnijmy listę rozwijaną na formularz. Następnie kliknij pole, aby ustawienia otworzyły się po lewej stronie.

Przeciągnij listę rozwijaną wielokrotnego wyboru na formularz

Jeśli chcesz, możesz automatycznie wypełnić listę rozwijaną z innych części WordPressa, takich jak Twoje posty lub produkty. W tym artykule dowiesz się, jak korzystać z dynamicznych wyborów pól.

Ale jeśli chcesz na stałe zakodować listę, WPForms ułatwia to. Zawiera kilka przydatnych gotowych list dla pól rozwijanych. Aby przyspieszyć działanie, dodamy listę stanów USA za pomocą jednego z ustawień wstępnych.

Najpierw przejdź dalej i kliknij Dodaj zbiorczo w ustawieniach pola rozwijanego.

Zbiorcze dodawanie opcji do listy rozwijanej wielokrotnego wyboru

A następnie kliknij Pokaż ustawienia wstępne, aby otworzyć wszystkie dostępne listy ustawień wstępnych.

Pokaż ustawienia predefiniowane wielokrotnego wyboru

Teraz kliknijmy Stany, aby automatycznie uzyskać listę stanów USA, które możemy dodać do listy rozwijanej wielokrotnego wyboru.

Lista stanów wielokrotnego wyboru

Zobaczysz pełną listę stanów automatycznie wypełniającą pole Wybory . Kliknij Dodaj nowe wybory, aby dodać je jako opcje odpowiedzi.

Dodaj odpowiedzi do listy rozwijanej wielokrotnego wyboru

Czy zauważyłeś, że w polu rozwijanym znajdują się 3 domyślne odpowiedzi? Nie zapomnij kliknąć znaku minus obok tych domyślnych opcji, aby je usunąć.

Usuń domyślne odpowiedzi z menu wyboru wielokrotnego

W porządku, to wszystkie nasze opcje odpowiedzi ustawione w polu rozwijanym.

Wszystko, co musimy teraz zrobić, to powiedzieć WPForms, że chcemy, aby było to pole wielokrotnego wyboru.

W tym celu przewiniemy po lewej stronie i rozwiniemy Opcje zaawansowane .

W tej sekcji wybierzmy Wybór wielu opcji .

Włącz wiele opcji wyboru, aby utworzyć listę rozwijaną wielokrotnego wyboru

Jest jeszcze jedna ważna zmiana do wprowadzenia tuż pod spodem.

Zmieńmy styl tego pola na rozwijany Nowoczesny .

Nowoczesna lista rozwijana z wieloma opcjami

Zastanawiasz się, dlaczego zmieniliśmy to pole na styl Modern?

Istnieją 3 powody, dla których to pole działa lepiej w przypadku listy rozwijanej wielokrotnego wyboru:

  • Pole Styl nowoczesny wyświetla jeden wiersz ze strzałką, aby rozwinąć listę. Jest więc bardziej kompaktowy niż styl Classic, który zawsze wyświetla 4 rzędy.
  • Pole Styl nowoczesny umożliwia klikanie wielu wpisów bez przytrzymywania klawiszy na klawiaturze. W przypadku pola klasycznego odwiedzający będzie musiał przytrzymać klawisz Control lub Command na swojej klawiaturze, aby wybrać więcej niż 1 wpis na raz.
  • Jak wspomnieliśmy na górze, menu rozwijane Modern syle multi select zawiera pole wyszukiwania, które ułatwia szybkie znalezienie żądanego elementu.

OK, więc mamy listę rozwijaną skonfigurowaną tak, jak chcemy. Zapiszmy nasze dotychczasowe postępy, klikając przycisk Zapisz u góry kreatora formularzy.

Teraz możemy opublikować formularz. To jest ostatni krok i zajmuje tylko kilka minut.

Krok 4: Opublikuj formularz na swojej stronie

Teraz wypełniliśmy formularz, czas opublikować go w witrynie WordPress.

WPForms umożliwia publikowanie formularzy w dowolnym miejscu. Możesz je dodać do:

  • Posty
  • Strony
  • Paski boczne
  • Stopka WordPressa.

W tym przykładzie utwórzmy nową stronę formularza.

Aby rozpocząć, kliknij Osadź w górnej części kreatora formularzy.

Osadź formularz rozwijany wielokrotnego wyboru

Teraz przejdźmy dalej i kliknij Utwórz nową stronę .

Utwórz nową stronę w WordPressie dla listy rozwijanej wielokrotnego wyboru

Wpisz nazwę swojej strony, a następnie kliknij Chodźmy .

Kliknij przycisk Let's Go, aby utworzyć stronę dla rozwijanego formularza wielokrotnego wyboru

WordPress otworzy nową stronę i wyświetli podgląd Twojego formularza. Kliknij niebieski przycisk Opublikuj lub Aktualizuj w prawym górnym rogu.

Opublikuj formularz z rozwijanym menu wielokrotnego wyboru

Teraz lista rozwijana wielokrotnego wyboru jest aktywna i gotowa do użycia.

Przykład listy rozwijanej wielokrotnego wyboru

I to wszystko! Nauczyłeś się, jak łatwo tworzyć listę rozwijaną wielokrotnego wyboru w WordPress.

Utwórz teraz swój formularz WordPress

Następny krok: Podziel swój formularz na strony

Jeśli szukasz sposobów na zwiększenie zwartości formularza, pomyśl o podzieleniu go na wiele stron. Może to znacznie ułatwić pracę z długimi formami.

Aby dowiedzieć się, jak dodawać podziały stron do formularza, przeczytaj nasz przewodnik dotyczący tworzenia wieloetapowego formularza.

Gotowy do zbudowania swojej formy? Zacznij już dziś od najłatwiejszej wtyczki do tworzenia formularzy WordPress. WPForms Pro zawiera wiele darmowych szablonów i oferuje 14-dniową gwarancję zwrotu pieniędzy.

Jeśli ten artykuł Ci pomógł, śledź nas na Facebooku i Twitterze, aby uzyskać więcej bezpłatnych samouczków i przewodników WordPress.