CMS: Ein benutzerdefiniertes Formular mit Eingabeelementen erstellen, die an deine Sammlung übermitteln

21 Min. Lesezeit
Erstelle ein benutzerdefiniertes Formular, das es Besuchern ermöglicht, ihre Informationen über Eingabeelemente direkt an deine Sammlungen im CMS zu übermitteln. Zu den Eingabeelementen gehören Textfelder, Aufklappmenüs, Datum- und Uhrzeitauswahl und viele mehr. Dieser Artikel führt dich durch die Erstellung einer Sammlung, in der du die Einreichungen deiner Website-Besucher speicherst. Außerdem erklärt der Artikel wie du Eingabeelemente und einen „Einreichen“-Button hinzufügst und wie du Datensätze verwendest, um alles zu verbinden.
Screenshot, der zeigt, wie Eingabeelemente zum Erstellen eines benutzerdefinierten Formulars verwendet werden
Du benötigst ein einfacheres, vorgefertigtes benutzerdefiniertes Formular?
Sieh dir Wix Forms an, um dir Formularvorlagen anzusehen, die du weniger einrichten musst, wie z. B. Kontaktformulare, Bestellformulare, Registrierungsformulare und mehr. 
Bevor du loslegst:
Falls du dies noch nicht getan hast, musst du das CMS zu deiner Website hinzufügen.

Schritt 1 | Eine Sammlung erstellen und Berechtigungen festlegen

Erstelle eine Sammlung, in der du die Einreichungen benutzerdefinierter Formulare speicherst und die Berechtigungen für die Sammlung festlegst. Du kannst aus voreingestellten Berechtigungseinstellungen wie Formulareinreichungen wählen, mit denen Besucher Inhalte hinzufügen können. Bei Bedarf kannst du die Berechtigungen anpassen, um zu steuern, wer die Sammlungselemente hinzufügen, bearbeiten, anzeigen und löschen kann.

Du kannst an dieser Stelle der Sammlung Felder hinzufügen, aber wir empfehlen, diese später hinzuzufügen (Schritt 3), wenn du die Eingabeelemente verbindest. Auf diese Weise kannst du sicher sein, dass du nur die Feldtypen hinzufügst, die eine Verbindung zu den einzelnen Eingabeelementen herstellen können.

Um eine Sammlung zum Speichern von Formulareinreichungen zu erstellen:

  1. Öffne den Bereich CMS in deiner Website-Verwaltung.
  2. Klicke auf + Sammlung erstellen.
  3. Gib einen Namen für deine Kategorie ein. 
  4. Lasse Mehrere Elemente (Standard) ausgewählt und klicke auf Erstellen.
  5. Klicke auf Weitere Aktionen und wähle Berechtigungen & Datenschutz.
Screenshot der Auswahl von Berechtigungen & Datenschutz in einer Sammlung
  1. Klicke auf das Feld Welche Inhalte möchtest du in dieser Sammlung speichern? und wähle Formulareinreichungen. Bei Bedarf kannst du eine andere Option wählen und auf die Aufklappmenüs klicken, um anzupassen, wer Inhalte anzeigen, hinzufügen, löschen und aktualisieren kann. Erfahre mehr über das Festlegen von Sammlungsberechtigungen.
  2. Klicke auf Speichern.
Screenshot der Einstellungen für Sammlungsberechtigungen und Datenschutz

Schritt 2 | Eingabeelemente zu deiner Website hinzufügen

Öffne die Seite oder den Abschnitt deiner Website, auf der du das benutzerdefinierte Formular erstellen möchtest. Füge anschließend alle Eingabeelemente hinzu, die Besucher zum Einreichen ihrer Antworten verwenden. Denke daran, dass es für jedes Eingabeelement Einschränkungen hinsichtlich der Datentypen hat, die es erfassen kann, und die Feldtypen, mit denen es eine Verbindung herstellen kann.
Wix Editor
Editor X
Editor
  1. Öffne deinen Editor.
  2. Öffne die Seite oder den Abschnitt, auf der du ein benutzerdefiniertes Formular erstellen möchtest.
  3. Klicke auf der linken Seite des Editors auf Elemente hinzufügen .
  4. Klicke auf Eingabefelder.
  5. Klicke auf das Eingabeelement, das du hinzufügen möchtest.
  6. Klicke und ziehe das entsprechende Eingabeelement auf die Seite.
Screenshot des Aufklappmenüs im Editor.
  1. Wiederhole die obigen Schritte 3 bis 6, um so viele Eingabeelemente hinzuzufügen, wie dein Formular benötigt.
Screenshot von vielen Eingabeelementen, die zu einer Seite hinzugefügt wurden

Schritt 3 | Die Eingabeelemente mit deiner Sammlung verbinden

Verbinde jedes deiner Eingabeelemente mit einem Datensatz, der sich mit deiner Sammlung verbindet. Verbinde die Eingabewerte dann mit neuen Sammlungsfeldern, die der Art der Daten entsprechen, die du sammeln möchtest.

Für die Optionen, die im Aufklappmenü und den Auswahl-Tags angezeigt werden, kannst du Elemente aus einer anderen Sammlung verwenden. Verbinde dazu die Listenelemente mit einem anderen Datensatz, der mit einem Feld in einer anderen Sammlung verbunden ist.
Wix Editor
Editor X
Editor
  1. Klicke in deinem Editor auf eines der Eingabeelemente, die du gerade hinzugefügt hast.
  2. Klicke auf das Symbol für Mit CMS verknüpfen .
  3. (Falls erforderlich) Klicke auf Inhalte sammeln, um das Eingabeelement zum Speichern von Besuchereinreichungen zu verwenden.
Screenshot, wie ein Eingabeelement zum Sammeln von Inhalten eingestellt wird
  1. Erstelle einen neuen Datensatz oder verbinde einen vorhandenen:
    • Einen neuen Datensatz erstellen:
      1. Klicke auf Datensatz erstellen. Wenn du bereits einen Datensatz auf deiner Seite hast, klicke auf das Aufklappmenü Datensatz verbinden und wähle Neuen Datensatz erstellen aus.
      2. Klicke auf das Aufklappmenü Sammlung auswählen und wähle die entsprechende Sammlung aus.
      3. (Optional) Klicke auf das Feld Datensatzname und gib einen Namen für den Datensatz ein.
      4. Klicke auf Erstellen.
    • Einen vorhandenen Datensatz verbinden:
      1. Klicke auf das Aufklappmenü Datensatz verbinden.
      2. Wähle den Datensatz aus, den du verknüpfen möchtest.
Screenshot der Auswahl eines Aufklappmenüs und Erstellung eines Datensatzes, mit dem es verbunden wird
  1. Verbinde das Eingabeelement mit einem neuen Feld der Sammlung:
    1. Klicke auf das Aufklappmenü Wert verbindet mit und wähle Neues Feld hinzufügen.
    2. Gib einen Feldnamen für das neue Sammlungsfeld ein. 
    3. Wähle den Feldtyp aus dem Aufklappmenü aus. Der Feldtyp bestimmt, welche Art von Daten du in dem Feld speichern kannst.
    4. Klicke auf Hinzufügen
Screenshot vom Hinzufügen eines neuen Feldes beim Verbinden eines Aufklappmenü-Eingabeelements.
  1. (Falls erforderlich) Klicke auf den Schalter Listenelemente verbinden, um auszuwählen, wo die Auswahl des Elements verwaltet werden soll:
    • Aktiviert: Verwende für die Auswahl ein Feld aus einer anderen CMS-Sammlung. Verbinde den entsprechenden Datensatz und wähle aus dem Aufklappmenü Labels und Werte verbinden mit die Felder aus, die du verwenden möchtest.
    • Deaktiviert: Klicke auf Auswahloptionen verwalten, um die Auswahlmöglichkeiten für das Element separat vom CMS zu erstellen. 
Screenshot, der zeigt, wie die Liste mit Auswahlmöglichkeiten in einem Aufklappmenü mit einer Sammlung verbunden wird
  1. Wiederhole diese Schritte für jedes Eingabeelement deines benutzerdefinierten Formulars.

Schritt 4 | Die Datensatz-Modi festlegen

Datensätze bestimmen die Verbindung zwischen deinen Seitenelementen und Sammlungen, also stelle sicher, dass sich jeder Datensatz im richtigen Modus befindet. Lege in dem Datensatz, der eine Verbindung zu deiner Sammlung mit Einreichungen herstellt, den Modus auf Schreiben fest, damit Daten durch die Eingabeelemente zur Sammlung hinzugefügt werden können.

Wenn du das Aufklappmenü oder die Auswahl-Tag-Liste mit einem anderen Datensatz und einer anderen Sammlung verbunden hast, sollte der Datensatz automatisch korrekt auf Lesen & schreiben eingestellt sein. Wenn du sie allerdings mit einem vorhandenen Datensatz verbunden hast, musst du überprüfen, dass der Modus auf Lesen & schreiben oder Lesen eingestellt ist. Dadurch können die Auswahllisten Elemente aus der anderen Sammlung anzeigen.
Wix Editor
Editor X
Editor
  1. Wähle im Editor den Datensatz aus, der die Sammlung verbindet, in der die Einreichungen gespeichert werden sollen.
  2. Klicke auf Einstellungen.
  3. Klicke auf das Aufklappmenü Datensatz-Modus und wähle Schreiben aus.
  4. (Wenn du Listenelemente mit dem CMS verbunden hast) Lege den Modus für den Datensatz fest, der mit den Listenelementen verbunden ist:
    1. Wähle den Datensatz aus, den du mit den Listenelementen verbunden hast.
    2. Klicke auf Einstellungen.
    3. Klicke auf das Aufklappmenü Modus und wähle Lesen & schreiben oder Lesen.
    4. (Optional) Klicke auf + Filter hinzufügen, wenn du einen Filter erstellen möchtest, um bestimmte Elemente von der Auswahlliste auszuschließen.
    5. (Optional) Klicke auf + Sortierung hinzufügen, wenn du die Reihenfolge auswählen möchtest, in der die Elemente in der Auswahlliste angezeigt werden.
Screenshot der Auswahl des Datensatzmodus, der mit den Listenelementen verbunden ist.

Schritt 5 | Einen Einreichen-Button erstellen

Nachdem Besucher mit deinen benutzerdefinierten Formulareingabeelementen interagiert haben, müssen sie eine Möglichkeit haben, ihre Antworten einzureichen. Füge einen Button oder ein Bild hinzu und verbinde ihn mit demselben Datensatz wie deine Sammlung, die die Einreichungen enthält. Lege anschließend die Klick-Aktion für den Button oder das Bild auf Einreichen fest. Wenn Besucher auf den „Absenden“-Button klicken, wird ein neues Element in der Sammlung erstellt, mit Werten aus jedem Eingabeelement in den entsprechenden Feldern.
Wix Editor
Editor X
Editor
  1. Klicke auf der linken Seite des Editors auf Elemente hinzufügen .
  2. Klicke auf den Button.
  3. Klicke und ziehe den Button, den du als Einreichen-Button verwenden möchtest, auf die Seite. Du kannst einen der folgenden Buttontypen verwenden: Buttonvorlagen, Text- und Symbolbuttons, Symbolbuttons, oder Bildbuttons.
    Tipp: Alternativ kannst du ein Bild hinzufügen und es als deinen Einreichen-Button verwenden. 
Screenshot, der zeigt, wie ein Button als „Einreichen“-Button hinzugefügt wird.
  1. Klicke auf Text & Symbol ändern und gib den Text ein, der auf dem Button angezeigt werden soll (z. B. „Einreichen“). 
  2. Klicke auf das Symbol für Mit CMS verknüpfen .
  3. Klicke auf das Aufklappmenü Datensatz verbinden und wähle den Datensatz aus, der mit deiner Einreichungssammlung verbunden ist.
  4. Klicke auf das Aufklappmenü Beim Klicken verbinden mit und wähle die Option Einreichen.
  5. (Optional) Füge Erfolgs- und Fehlermeldungen hinzu, die angezeigt werden, wenn Einreichungen erfolgreich übermittelt wurden oder ein Fehler bei der Übermittlung aufgetreten ist:
    1. Klicke auf + Erfolgsnachricht hinzufügen und dann auf + Fehlermeldung hinzufügen.
    2. Klicke und ziehe beide Nachrichten an die gewünschte Stelle. Sie können sich überschneiden, da die Nachrichten nicht gleichzeitig angezeigt werden.
    3. Klicke in jeder Nachricht auf Text bearbeiten, um dem Text der Nachrichten zu bearbeiten.
  6. Wähle den Button und klicke auf das Symbol für Mit CMS verbinden . Klicke anschließend auf das Aufklappmenü Wenn erfolgreich, navigieren zu und wähle eine Option:
    • Auf der Seite bleiben: Der Besucher bleibt nach dem Absenden des Formulars auf derselben Seite.
    • Ein Link: Der Besucher wird auf eine andere Seite weitergeleitet, nachdem er das Formular abgeschickt hat. Klicke unter Link auswählen auf Auswählen und richte den Link ein.
Screenshot der Einstellungen für „Button verbinden“ für einen Einreichen-Button.
  1. Klicke auf den Button und wähle das Symbol für Design  um das Aussehen deines Einreichen-Buttons anzupassen.

Schritt 6 | Die Eingabeelemente anpassen

Du kannst jedes deiner Eingabeelemente anpassen, um ein Formular zu erstellen, das zum Design deiner Website passt.
Wix Editor
Editor X
Editor
  1. Klicke in deinem Editor auf eines deiner Eingabeelemente, das du anpassen möchtest.
  2. Klicke auf Einstellungen, um den Feldtitel einzugeben, das Feld als erforderlich festzulegen oder verschiedene Einstellungen je nach Eingabetyp anzupassen.
Screenshot vom Anpassen der Einstellungen für das Aufklappmenü-Element.
  1. Klicke auf das Symbol für Layout , um die Textausrichtung und andere Layout-Optionen anzupassen.
  2. Klicke auf das Symbol für Design , um ein voreingestelltes Design zu wählen. Wähle anschließend Design anpassen, um das Aussehen des Elements weiter anzupassen.
  3. (Optional) Klicke auf das Symbol für Animation  um eine Animation dem Element hinzuzufügen.
  4. Wiederhole diese Schritte für jedes Eingabeelement, das du anpassen möchtest.
Bereit, live zu gehen?
Klicke oben rechts im Editor auf Vorschau, um das neue benutzerdefinierte Formular auszuprobieren. Wenn alles gut aussieht und perfekt funktioniert, klicke auf Veröffentlichen, um die Änderungen zu veröffentlichen.

Wenn du Sandbox aktiviert hast, synchronisiere deine Sandbox-Sammlung mit der Live-Sammlung, um die Änderungen in der Datenbank zu veröffentlichen.

Häufig gestellte Fragen

Klicke unten auf eine Frage, um Antworten auf die häufigsten Fragen zum Erstellen benutzerdefinierter Formulare mit Eingabeelementen zu erhalten.

War das hilfreich?

|