So erstellen Sie eine Dropdown-Liste mit mehreren Auswahlmöglichkeiten

Mehrfachauswahl-Dropdowns erleichtern die Arbeit mit großen Listen in Formularen. Es ist nicht die einzige Möglichkeit, eine lange Liste mit mehreren auswählbaren Optionen in einem Formular hinzuzufügen, aber es ist der prägnanteste Ansatz.

Und wenn es darum geht, Formulare zu entwerfen, die die Leute tatsächlich ausfüllen möchten, brauchen Sie etwas, das Ihr Formular nicht unnötig verlängert.

Dennoch sehe ich Websites, die große Checklisten in Situationen verwenden, in denen sie ein saubereres Design hätten erstellen können, wenn sie sich für ein Dropdown-Menü mit Mehrfachauswahl entschieden hätten.

Basierend auf dem, was ich gesehen habe, liegt dies entweder daran, dass der Formularersteller keine Dropdown-Menüs mit Mehrfachauswahl unterstützt, oder daran, dass der Ersteller nicht darauf geachtet hat.

Daher dachte ich, ich stelle einen kurzen Leitfaden zusammen, der zeigt, wie einfach es ist, Dropdown-Menüs mit Mehrfachauswahloptionen zu Formularen in WordPress hinzuzufügen.

Ein Dropdown-Feld mit Mehrfachauswahl in WordPress einrichten

Beginnen wir mit der Installation des Plugins, das wir verwenden werden.

Schritt 1: Installieren Sie das WPForms-Plugin

Zunächst benötigen Sie einen Formularersteller, der Dropdown-Menüs mit Mehrfachauswahl unterstützt. Ich empfehle WPForms, weil ich ehrlich glaube, dass kein anderes WordPress-Formular-Plugin die Flexibilität und zeitsparenden Funktionen auf dem gleichen Niveau bietet.

Mit den Dropdown-Menüs von WPForms können Sie zum Beispiel:

• Mehrfachauswahloptionen in Dropdown-Menüs sowohl in der kostenlosen als auch in der kostenpflichtigen Version hinzufügen
• Lange Optionslisten automatisch mit KI generieren und hinzufügen

Obwohl Sie sowohl WPForms Lite als auch WPForms Pro verwenden können, um Dropdown-Menüs mit Mehrfachauswahl zu erstellen, werde ich in diesem Leitfaden WPForms Pro verwenden (siehe WPForms Lite vs Pro, um mehr über die wichtigsten Unterschiede zwischen den beiden Versionen zu erfahren).

Zum ersten Mal ein Plugin installieren? Es ist unglaublich einfach. Sie können die Installationsschritte in unserem Dokumentationsleitfaden befolgen.

Nach der Installation können Sie sofort mit der Erstellung Ihrer Formulare beginnen.

Schritt 2: Neues Formular erstellen

Öffnen Sie Ihr WordPress-Admin-Menü. Bewegen Sie den Mauszeiger über WPForms in der Seitenleiste und klicken Sie dann auf Neu hinzufügen.

Diese Aktion lädt den Formulareinrichtungsbildschirm. In diesem Beispiel möchte ich ein Buchanforderungsformular erstellen. Daher gebe ich dem Formular einen geeigneten Namen für meine interne Referenz und wähle eine Vorlage aus.

Der Einfachheit halber werde ich das einfache Kontaktformular verwenden und es später durch Hinzufügen eines Dropdown-Menüs etwas anpassen.

Denken Sie daran, dass es über 2.100+ Formularvorlagen zur Auswahl gibt. Sie können sogar das gesamte Formular mit KI generieren.

Um jedoch die Funktionalität und Anpassungen besser zu demonstrieren, verwende ich für dieses Beispiel den manuellen Weg.

Nachdem Sie Ihre Vorlage ausgewählt haben, wird der Formularersteller in wenigen Sekunden geladen.

Jede Vorlage in WPForms ist zu 100 % anpassbar. Sie können also problemlos neue Felder einfügen, vorhandene Felder entfernen oder andere Einstellungen ändern.

Im nächsten Schritt füge ich ein Dropdown-Feld mit einer ziemlich großen Liste von auswählbaren Optionen hinzu.

Schritt 3: Dropdown-Feld hinzufügen

Ziehen wir zuerst ein Dropdown auf das Formular.

Klicken Sie dann auf das Feld, damit die Einstellungen auf der linken Seite geöffnet werden.

Im linken Bereich sehen Sie verschiedene Optionen. Wie z. B. das Ändern der Bezeichnung des Feldes und die Eingabe der Auswahlmöglichkeiten für Ihr Dropdown.

Lassen Sie uns dem Feld zuerst einen relevanteren und beschreibenderen Namen geben, indem wir die Bezeichnung ändern. Da ich eine Liste von Büchern hinzufügen möchte, die Leute in diesem Feld anfordern können, nenne ich dieses Feld „Bücher zum Anfordern“.

Nun ist es an der Zeit, die Auswahlmöglichkeiten für Ihr Dropdown hinzuzufügen. Es ist einfach genug, Auswahlmöglichkeiten manuell hinzuzufügen, wenn Sie nur wenige davon haben.

Aber wenn Sie eine lange Liste haben, können Sie viel Zeit sparen, indem Sie die KI die Auswahlmöglichkeiten für Sie generieren und hinzufügen lassen.

Um die KI für die Auswahlmöglichkeiten zu verwenden, klicken Sie auf die lila Schaltfläche Auswahlmöglichkeiten generieren.

Beschreiben Sie nun die Auswahlmöglichkeiten in einfachen Worten und WPForms AI generiert Ihre Liste fast sofort für Sie. Ich möchte eine Liste beliebter Bücher hinzufügen (die wahrscheinlich in jeder anständigen Bibliothek verfügbar sind), und das ist es, wonach ich in der Eingabeaufforderung fragen werde.

Innerhalb weniger Sekunden hatte ich eine fantastische Liste, mit der ich arbeiten konnte. Aber wenn Sie die Liste stark ändern möchten, können Sie versuchen, Ihre Eingabeaufforderung zu ändern und WPForms AI erneut zu bitten, die Liste zu aktualisieren.

Sobald Sie mit den Vorschlägen zufrieden sind, klicken Sie auf Auswahlmöglichkeiten einfügen.

Die generierten Auswahlmöglichkeiten werden in der Liste der Auswahlmöglichkeiten im linken Bereich angezeigt. Sie können diese Auswahlmöglichkeiten auch manuell bearbeiten.

Standardmäßig kann ein Besucher nur eine Auswahl gleichzeitig aus dem Dropdown auswählen. Aber es ist einfach, diese Einstellungen zu ändern, wie ich im nächsten Schritt zeigen werde.

Schritt 4: Dropdown-Feldeinstellungen bearbeiten, um Mehrfachauswahl zu aktivieren

Standardmäßig kann ein Besucher nur eine Auswahl gleichzeitig aus dem Dropdown auswählen. Um dies zu ändern, gehen Sie zuerst zum Tab Erweitert des Dropdown-Feldes.

Klicken Sie danach auf Mehrfachauswahl, um sie zu aktivieren.

Großartig! Wir sind hier fast fertig. Aber ich persönlich bin kein Fan des klassischen Dropdown-Stils (was der Standardmodus ist).

Dadurch erscheint das Dropdown als rechteckiger Kasten mit vertikaler Scrollleiste, und Sie müssen Strg (Befehl auf Mac) drücken, um mehrere Optionen auszuwählen.

Sie können das Dropdown-Feld intuitiver gestalten, indem Sie den Stil von Klassisch auf Modern ändern.

Es gibt 3 Gründe, warum der moderne Stil für ein Dropdown mit Mehrfachauswahl besser funktioniert:

• Das Feld im modernen Stil zeigt eine Zeile mit einem Pfeil zum Erweitern der Liste an. Es ist kompakter als der klassische Stil, der immer 4 Zeilen anzeigt und mehr Bildschirmplatz beansprucht.
• Das Feld im modernen Stil ermöglicht es Ihnen, mehrere Einträge anzuklicken, ohne eine Taste auf der Tastatur gedrückt zu halten. Mit dem klassischen Feld muss Ihr Besucher die Strg- oder Befehlstaste auf seiner Tastatur gedrückt halten, um mehr als 1 Eintrag gleichzeitig auszuwählen.
• Das Dropdown mit Mehrfachauswahl im modernen Stil verfügt über ein Suchfeld, mit dem Sie den gewünschten Eintrag schnell und einfach finden können.

Lassen Sie uns unseren bisherigen Fortschritt speichern, indem wir oben im Formular-Generator auf die Schaltfläche Speichern klicken.

Jetzt können wir das Formular veröffentlichen. Dies ist der letzte Schritt und dauert nur wenige Minuten.

Schritt 5: Ihr Formular veröffentlichen

Nachdem wir das Formular ausgefüllt haben, ist es an der Zeit, es auf Ihrer WordPress-Website zu veröffentlichen.

Mit WPForms können Sie Ihre Formulare überall veröffentlichen. Sie können sie hinzufügen zu:

• Beiträge
• Seiten
• Seitenleisten
• Die WordPress-Fußzeile.

In diesem Beispiel erstellen wir eine neue Seite für das Formular.

Klicken Sie zunächst oben im Formular-Generator auf Einbetten.

Klicken wir nun auf Neue Seite erstellen.

Geben Sie einen Namen für Ihre Seite ein und klicken Sie dann auf Los geht's.

WordPress öffnet die neue Seite und zeigt eine Vorschau Ihres Formulars an. Klicken Sie oben rechts auf die blaue Schaltfläche Veröffentlichen.

Jetzt ist Ihr Formular mit der Mehrfachauswahl-Dropdownliste live und einsatzbereit.

Und das ist alles! Sie haben gelernt, wie Sie ganz einfach eine Mehrfachauswahl-Dropdownliste in WordPress erstellen.

Erstellen Sie jetzt Ihr WordPress-Formular

Nächster Schritt: Teilen Sie Ihr Formular in Seiten auf

Wenn Sie nach Möglichkeiten suchen, Ihr Formular kompakter zu gestalten, sollten Sie es in mehrere Seiten aufteilen. Dies kann lange Formulare erheblich einfacher machen.

• Um zu erfahren, wie Sie Seitenumbrüche zu einem Formular hinzufügen, lesen Sie unsere Anleitung zum Erstellen eines mehrstufigen Formulars.
• Um ein mehrstufiges Formular zu erstellen, das auf die Steigerung von Konversionen und Leads ausgelegt ist, lesen Sie wie Sie ein Lead-Formular erstellen.

Bereit, Ihr Formular zu erstellen? Beginnen Sie noch heute mit dem einfachsten WordPress-Formular-Builder-Plugin. WPForms Pro enthält viele kostenlose Vorlagen und bietet eine 14-tägige Geld-zurück-Garantie.

Wenn Ihnen dieser Artikel geholfen hat, folgen Sie uns bitte auf Facebook und Twitter für weitere kostenlose WordPress-Tutorials und Anleitungen.