Formularblock von Jetpack

Erstelle und teile Formulare, um Leads, Feedback, Zahlungen und mehr zu sammeln – mit der Leistung von Jetpack Forms.

Die Formularfunktion von Jetpack ist standardmäßig aktiviert. Falls nötig, kannst du Jetpack Forms deaktivieren, indem du die hier beschriebenen Schritte befolgst.

Wenn du den klassischen Editor verwendest, sieh dir bitte Kontaktformular (klassischer Editor)an.

Füge ein Formular von Jetpack hinzu MD

Der Formularblock ist auf allen mit Jetpack verbundenen Websites verfügbar und kann kostenlos verwendet werden. So fügst du ein Formular zu einem Beitrag oder einer Seite hinzu:

1. Gib /form im Editor ein oder wähle den Formular-Block im Block-Inserter aus.
2. Wähle ein vorgefertigtes Formularmuster aus, um schnell zu beginnen (siehe unten), oder starte mit einem leeren Formular.
3. Passe die Formularfelder an deine Anforderungen an: Entferne Felder, füge welche hinzu oder ordne sie über die Werkzeugleiste jedes Feldes neu an.
4. Mache Felder durch Aktivieren der * gekennzeichneten Einstellung zu Pflichtfeldern oder optionalen Feldern.
5. Um die Schaltfläche „Senden“ anzupassen, klicke darauf und ersetze den Text direkt.

Verwenden des Formular-Editors von JetpackMD

Du kannst Formulare auch mit dem Formular-Editor von Jetpack, einer eigenständigen Oberfläche außerhalb des Block-Editors. Damit kannst du Formulare direkt im WP-Admin erstellen, organisieren und veröffentlichen unter Jetpack → Formulare.

Willkommensleitfaden des Formular-EditorsMD

Wenn du den Formular-Editor zum ersten Mal öffnest, führt dich ein Leitfaden mit fünf Schritten durch den Formularerstellungsprozess: Felder hinzufügen, die Beschriftung und Einstellungen eines Feldes bearbeiten, festlegen, was nach dem Absenden des Formulars geschieht, sowie das fertige Formular veröffentlichen und teilen.

Um den Leitfaden jederzeit erneut anzuzeigen, klicke oben rechts im Formular-Editor auf das Optionssymbol (⋮) und wähle „Willkommensleitfaden“ aus.

Der Leitfaden wird beim ersten Aufrufen des Formular-Editors geöffnet. Er wird nicht geöffnet, wenn du den Block-Editor bereits verwendet hast und schon ein eigenes Formular besitzt. Er wird auch nicht geöffnet, wenn du ein Formular über die Option „Formular bearbeiten“ in einem Beitrag oder auf einer Seite erreichst – nur wenn du den Formular-Editor direkt über Jetpack → Formulare öffnest.

Schnell mit Formularmustern beginnenMD

Jetpack Forms enthält mehrere vorgefertigte Formularmuster. Dabei handelt es sich um fertige Layouts, die du einfügen und anpassen kannst. Die Verwendung eines Musters ist der schnellste Weg, ein funktionierendes Formular zu erstellen, ohne es von Grund auf neu aufzubauen.

Verfügbare FormularmusterMD

Die folgenden Formularmuster sind in Jetpack enthalten:

• Kontaktformular: ein vielseitiges Kontaktformular, über das Besucher Kontakt aufnehmen können.
• RSVP-Formular: sammelt Antworten zu Veranstaltungen und Angaben zur Teilnahme.
• Registrierungsformular: sammelt Anmeldedaten von neuen Benutzern oder Teilnehmern.
• Terminformular: Besucher können damit Termine anfragen oder vereinbaren.
• Feedbackformular: sammelt Meinungen, Bewertungen oder Vorschläge.
• Mehrstufiges Formular: teilt ein längeres Formular in separate Schritte auf, die Besucher nacheinander auf jeweils einem Bildschirm ausfüllen, mit Fortschrittsbalken sowie den Schaltflächen „Weiter“ und „Zurück“. Das Muster beginnt mit drei Schritten, die du bearbeiten, erweitern oder entfernen kannst.
• Lead-Erfassungsformular: erfasst potenzielle Kundendaten zur späteren Kontaktaufnahme.

So fügst du ein Formularmuster einMD

Du kannst auf zwei Arten auf Formularmuster zugreifen:

1. Über den Block-Inserter: Gib /form im Editor ein. Eine Liste der verfügbaren Formularmuster wird angezeigt. Wähle anschließend das Muster aus, das am besten zu deinen Anforderungen passt.
2. Über den Bildschirm zur Formulareinrichtung: Wenn du einen neuen Formularblock hinzufügst, zeigt Jetpack eine Musterauswahl mit allen verfügbaren Layouts an. Klicke auf ein beliebiges Muster, um es sofort einzufügen.

Nach dem Einfügen ist jeder Teil des Musters vollständig bearbeitbar: Du kannst Felder hinzufügen, entfernen oder neu anordnen, Beschriftungen ändern und Einstellungen an deinen Anwendungsfall anpassen.

Verfügbare Formularfelder im Formularblock von JetpackMD

Der Formularblock enthält mehrere Blöcke, mit denen du Felder zu deinem Formular hinzufügen kannst. Zu den verfügbaren Formularfeldern gehören:

• Benutzerdefiniertes Feld für HTML: Ermöglicht Websitebesitzern, benutzerdefiniertes HTML in das Formular einzufügen. Dies kann zum Hinzufügen einer benutzerdefinierten Formatierung, eingebetteter Inhalte oder zusätzlicher Formularelemente verwendet werden, die nicht standardmäßig verfügbar sind.
• Datumsauswahl: Ermöglicht Benutzern, ein Datum aus einem Kalender auszuwählen, und eignet sich daher für die Terminplanung. Das erwartete Datumsformat wird unter dem Eingabefeld angezeigt.
• Dropdown-Feld: Zeigt eine Liste von Optionen in einem Dropdown-Menü an und eignet sich für strukturierte Antworten mit mehreren Auswahlmöglichkeiten.
• E-Mail-Feld: Erfasst die E-Mail-Adresse eines Benutzers. Benutzer müssen eine gültige E-Mail-Adresse eingeben, wodurch sich das Feld für die Beantwortung von Anfragen eignet.
• Datei-Upload-Block: Ermöglicht Benutzern, Dateien zusammen mit ihren Formulareinsendungen hochzuladen.
• Ausgeblendetes Feld: Speichert zusätzliche Informationen, die mit der Einsendung übermittelt, aber dem Benutzer nicht angezeigt werden. Dies kann dabei helfen, die Herkunft von Einsendungen nachzuverfolgen oder Daten für Integrationen und Automatisierungen zu übermitteln.
• Mehrzeiliges Textfeld: Stellt ein mehrzeiliges Textfeld für längere Nachrichten oder Beschreibungen bereit.
• Mehrfachauswahl (Kontrollkästchen): Ermöglicht Benutzern, eine oder mehrere Optionen auszuwählen.
• Namensfeld: Erfasst den Namen des Besuchers und wird als einzeiliges Texteingabefeld angezeigt.
• Zahleneingabefeld: Stellt ein einzeiliges Eingabefeld für numerische Werte bereit.
• Telefonnummernfeld: Erfasst Telefonnummern zur direkten Kontaktaufnahme. Telefonnummernfelder in Formularantworten sind anklickbar und enthalten eine Ländervorwahl-Auswahl. Auf unterstützten Geräten kannst du damit direkt einen Anruf starten oder die standardmäßige Telefon-App öffnen.
• Bewertungsfeld (Sterne und/oder Herzen): Ermöglicht Kunden, im Rahmen von Formulareinsendungen Bewertungen abzugeben, etwa bei der Bewertung von Produkten oder Dienstleistungen.
• Einzelauswahl (Optionsfeld): Ermöglicht Benutzern, eine Option aus einer vordefinierten Liste auszuwählen. Du kannst außerdem eine optionale „Andere“-Auswahl mit einem Texteingabefeld einfügen, über das Benutzer eine eigene Antwort angeben können, wenn keine der vordefinierten Optionen zutrifft. Um dies zu aktivieren, wähle das Feld „Einzelauswahl (Optionsfeld)“ im Editor aus, öffne die Blockeinstellungen in der rechten Seitenleiste und aktiviere die Einstellung „Option „Andere“ einschließen“.
• Schiebereglerfeld: Unterstützt zahlreiche Anwendungsfälle, z. B. die Angabe eines Budgets bei Angebotsanfragen, das Festlegen von Entfernungs- oder Prozentbereichen oder alternative Möglichkeiten zur Bewertung von Elementen zusätzlich zum standardmäßigen Bewertungsfeld.
• Zustimmung zu den Bedingungen: Unterstützt die Einhaltung von Vorgaben, indem Benutzer vor dem Absenden den Bedingungen zustimmen müssen.
• Texteingabefeld: Stellt ein einzeiliges Eingabefeld für kurze Textantworten bereit.
• Zeiteingabefeld: Stellt ein einzeiliges Eingabefeld für eine Uhrzeit bereit und eignet sich für Buchungs- und Terminformulare.
• Website-Feld: Bietet ein einzeiliges Eingabefeld für eine Website URL, das sich zum Sammeln von Links zu Unternehmen oder Blogs eignet.

Einschränkungen bei Tags von HTMLMD

Aus Sicherheitsgründen sind nicht alle Tags von HTML im Formularblock zulässig. Zu den nicht zulässigen Tags gehören:

• header
• embed
• frame
• iframe
• form
• input
• object
• textarea
• script
• style
• link

Nutzen Sie Jetpack AI, um Ihr eigenes Formular zu erstellenMD

Die von Jetpack AI unterstützte Funktionalität der Formularblöcke ist Bestandteil der Suite von Jetpack AI Assistant.

Jetpack AI offers you 20 free requests to get started. For more information about upgrading, please refer to our detailed Usage limitations and upgrades guide.

So verwenden Sie Jetpack AI zum Erstellen eines FormularsMD

1. Suchen Sie in Ihrem Formularblock nach dem Feld mit der Bezeichnung Bitten Sie Jetpack AI, Ihr Formular zu erstellen. (Klicken Sie auf das Glitzer-Symbol ✨ im Block-Werkzeugbereich, wenn es nicht angezeigt wird).
2. Schreiben Sie eine kurze Beschreibung der Informationen, die Sie sammeln möchten.
3. Klicken Sie auf Generieren.

Der Formularblock wird nun mit den entsprechenden Formularfeldern vorausgefüllt.

Hier sind Beispiele für Prompts, die Sie zum Erstellen Ihres Formulars verwenden können:

• Fügen Sie ein Registrierungsformular hinzu, das Name, E-Mail-Adresse und Telefonnummer erfasst.
• Erstellen Sie ein Formular mit Name und E-Mail-Adresse und fragen Sie außerdem nach der T-Shirt-Größe von S bis XXL.

Sie können Jetpack AI auch verwenden, um ein bestehendes Formular zu bearbeiten, unabhängig davon, ob es ursprünglich mit KI oder aus einem Muster erstellt wurde. Zum Beispiel:

• Fügen Sie einen Block hinzu, um Feedback mit Optionen von schlecht bis großartig zu erfassen.
• Verschieben Sie das Feld für die Telefonnummer vor das E-Mail-Feld.
• Machen Sie alle Felder zu Pflichtfeldern.

In diesem Video sehen Sie die Formularintegration von Jetpack AI in Aktion:

Formular in der Vorschau anzeigen und testenMD

Sie können jedes Formular in der Vorschau anzeigen und Testantworten senden, um zu überprüfen, ob alles durchgehend funktioniert, bevor Besucher damit interagieren. Testantworten werden getrennt von echten Einsendungen erfasst und nicht mit Ihren Daten vermischt.

Für eine Schritt-für-Schritt-Anleitung siehe Formular in der Vorschau anzeigen und testen im Leitfaden zum Formular-Editor.

Blockeinstellungen anpassenMD

Nach dem Hinzufügen eines Blocks für ein Formular, können Sie festlegen, was passiert, wenn jemand das Formular ausfüllt:

Wählen Sie aus, wo Sie benachrichtigt werden möchtenMD

E-Mail-Benachrichtigungen

Die standardmäßig von einem Formular von Jetpack verwendete E-Mail-Adresse ist die E-Mail-Adresse des Website-Administrators (Formularantworten werden an einen von Ihnen ausgewählten Empfänger gesendet. Wenn Sie keinen auswählen, wird der Empfänger automatisch anhand der Position des Formulars auf Ihrer Website ermittelt.

So legen Sie einen Empfänger fest:

1. Wählen Sie den Formularblock aus und öffnen Sie Formularbenachrichtigungen in der Seitenleiste mit den Blockeinstellungen.
2. Geben Sie unter E-Mail-Benachrichtigungen senden an eine Adresse ein.
3. Um mehrere Personen zu benachrichtigen, trennen Sie die einzelnen Adressen durch Kommas.

Das Feld ist zunächst leer und zeigt eine ausgegraute Adresse als Platzhalter an. An diese Adresse werden die Antworten gesendet, wenn Sie das Feld leer lassen. Sie dient als Vorschau des automatischen Empfängers und wird nicht gespeichert.

Der Hilfetext unter dem Feld nennt die verwendete Regel:

• Bei einem Beitrag oder einer Seite werden die Antworten an den Autor des Beitrags gesendet.
• In einem Widget, einer Blockvorlage oder einem Vorlagenteil werden Antworten an die Adresse Ihres Website-Administrators gesendet, die unter Einstellungen → Allgemein → E-Mail-Adresse des Administrators festgelegt ist.
• Im eigenständigen Formular-Editor werden die Antworten an den Autor der Seite gesendet, auf der das Formular angezeigt wird.

Bei einem Beitrag oder einer Seite werden die Antworten nur dann an den Autor des Beitrags gesendet, wenn dieser noch eine E-Mail-Adresse besitzt, weiterhin Mitglied Ihrer Website ist und den Beitrag noch bearbeiten kann. Ist eine dieser Bedingungen nicht mehr erfüllt, werden die Antworten stattdessen an die Adresse des Website-Administrators gesendet.

Durch die Eingabe einer Adresse wird diese im Formular gespeichert. Wenn Sie das Feld leeren, verwendet das Formular wieder den automatischen Empfänger.

Sie können dieselbe Adresse eingeben, die der Platzhalter anzeigt. Wenn Sie sie speichern, werden die Antworten an diese Adresse gebunden und weiterhin dorthin gesendet, auch wenn sich der Autor des Beitrags später ändert. Bei einem leeren Feld wird jeweils der aktuelle Autor des Beitrags verwendet.

Wenn in diesem Feld früher eine Adresse angezeigt wurde und es nun leer aussieht, hat sich an Ihrem Formular nichts geändert. Die Adresse wurde nie in Ihrem Formular gespeichert, sondern stets automatisch ermittelt und wird es weiterhin. Die Antworten werden genau dorthin gesendet wie zuvor.

Push-Benachrichtigungen

Sie können Push-Benachrichtigungen für Formularantworten erhalten, indem Sie Benachrichtigungen für Antworten aktivieren. Sie können festlegen, welche mit Jetpack verbundenen Benutzer Benachrichtigungen erhalten.

Weitere Informationen zur Konfiguration von Push-Benachrichtigungen in Jetpack, einschließlich der Frage, ob Sie diese in der App von Jetpack oder im Browser erhalten möchten.

Speicherung von AntwortenMD

Sie können festlegen, dass Formulareinsendungen nicht im WP-Admin gespeichert werden. Öffnen Sie dazu die Einstellungen für die Speicherung von Antworten im Blockbereich des Formulars und deaktivieren Sie die Einstellung, die standardmäßig aktiviert ist.

Einstellungen für EinsendungenMD

Die Aktion nach dem Absenden ist die Einstellung, die festlegt, was der Benutzer nach dem Absenden des Formulars sieht. Die Optionen sind:

• Eine Zusammenfassung der übermittelten Felder mit einer anpassbaren Nachrichtenüberschrift anzeigen.
• Eine benutzerdefinierte Textnachricht anzeigen.
• Zu einer anderen Website weiterleiten.

Die Zusammenfassung zeigt die von Ihnen festgelegte Überschrift, jedes übermittelte Feld mit seiner Antwort sowie eine Zurück-Schaltfläche, die den Besucher zur Seite mit dem Formular zurückführt. Antworten werden entsprechend ihrem Feldtyp dargestellt: Bewertungen zeigen Sterne, Website-Adressen werden zu anklickbaren Links, Telefonnummern zu Links, über die ein Anruf gestartet wird, bei Datei-Uploads werden Dateiname und -größe angezeigt und Bildauswahlfelder zeigen Miniaturansichten.

Einstellungen für einzelne FormularfelderMD

Sie können auch die Einstellungen für jedes einzelne Formularfeld anpassen. Klicken Sie dazu auf das Feld. Sie sehen folgende Optionen:

• Das Feld als Pflichtfeld markieren
• Die Breite des Formularfelds ändern (verfügbare Werte sind 25 %, 50 %, 75 % und 100 %)
• Hintergrundfarbe (einfarbig oder Verlauf) und Textfarbe ändern

Hilfetext zu einem Feld hinzufügenMD

Der Hilfetext ist ein kurzer Hinweis, der unter der Eingabe eines Feldes in Ihrem veröffentlichten Formular angezeigt wird. Verwenden Sie ihn, um zu erklären, was eingegeben werden soll – zum Beispiel, warum Sie nach einer Telefonnummer fragen oder was die Enden eines Schiebereglers bedeuten.

Screenreader geben den Hilfetext nach der Beschriftung des Feldes aus. Dadurch ändert sich nicht, wie das Feld bezeichnet wird.

So fügen Sie einem Feld Hilfetext hinzu:

1. Wählen Sie das Feld im Editor aus.
2. Geben Sie in das „Hilfetext hinzufügen …“-Platzhalter ein, der unter dem Eingabefeld angezeigt wird, oder öffnen Sie die Seitenleiste mit den Blockeinstellungen und geben Sie Ihren Text unter Feldeinstellungen in das Feld „Hilfetext“ ein.
3. Klicken Sie auf Speichern oder auf Veröffentlichen, um Ihre Änderungen zu speichern.

Beide Stellen schreiben denselben Text, verwenden Sie also einfach die von Ihnen bevorzugte Stelle. Um den Hilfetext zu entfernen, leeren Sie das Feld.

Hilfetext ist einfacher Text. Er kann keine Links, keine fett oder kursiv formatierte Schrift und keine Zeilenumbrüche enthalten.

Diese Felder unterstützen Hilfetext:

• Texteingabe
• Name
• E-Mail
• Website
• Telefonnummer
• Mehrzeiliger Text
• Zahl
• Datumsauswahl
• Zeiteingabe
• Dropdown
• Schieberegler

Diese Felder unterstützen keinen Hilfetext:

• Bewertung
• Mehrfachauswahl (Checkbox)
• Einzelauswahl (Optionsfeld)
• Zustimmung zu den Bedingungen
• Datei-Upload
• Verborgen
• Benutzerdefiniertes HTML

Wo das Datumsformat angezeigt wird

Das Feld „Datumsauswahl“ zeigt das erwartete Format, z. B. JJJJ-MM-TT, unter dem Eingabefeld und nicht innerhalb der Feldbezeichnung an. In früheren Versionen von Jetpack wurde das Format an das Ende der Bezeichnung angehängt, sodass ein Feld mit dem Namen „Geburtstag“ als „Geburtstag (JJJJ-MM-TT)“ angezeigt wurde. Die Bezeichnung enthält jetzt nur noch den Namen, den Sie dem Feld gegeben haben.

Der Hinweis richtet sich nach der Einstellung „Datumsformat“ des Feldes. Wenn Sie das Format ändern, ändert sich auch der Text unter dem Eingabefeld.

Wenn Sie einem Feld für die Datumsauswahl Hilfetext hinzufügen, wird der Hilfetext zuerst angezeigt und das Format folgt in derselben Zeile.

Absende-Button anpassenMD

Sie können die folgenden Einstellungen für den Absende-Button ändern:

• Buttontext
• Farbe des Buttons (einfarbig oder Verlauf)
• Textfarbe
• Eckenradius
• Breite des Buttons (25 %, 50 %, 75 %, 100 % oder ein benutzerdefinierter Wert in Pixeln)
• Ausrichtung des Buttons (linksbündig, rechtsbündig oder zentriert)

Betreffzeile in Benachrichtigungs-E-Mails anpassenMD

Jetpack bietet eine Option, den Betreff der E-Mail zu ändern, die Ihnen nach jeder Formularübermittlung gesendet wird. Sie können der Betreffzeile Token hinzufügen, zum Beispiel {city}, und Jetpack ersetzt das Token durch den Wert des Formularfelds „Stadt“ (Groß- und Kleinschreibung wird nicht berücksichtigt; achten Sie lediglich darauf, dass die Wörter übereinstimmen).

Formulare und Integrationen verwaltenMD

Nach der Veröffentlichung Ihres Formulars von Jetpack können Sie Übermittlungen direkt in Ihrem WP-Admin überprüfen und verwalten. Gehen Sie einfach zu Jetpack → Formulare → Antworten im linken Menü.

Wenn eine Antwort geöffnet ist, können Sie mithilfe von Tastenkürzeln zwischen Antworten wechseln und sie als Spam markieren oder in den Papierkorb verschieben, ohne eine Maus zu verwenden.

Unter „Verwalten von Kontaktformularantworten und Integrationen“ finden Sie die vollständige Liste sowie weitere Funktionen zum Anzeigen, Bearbeiten und Exportieren Ihrer Formularantworten.

Block „Mehrstufige Formulare“MD

Mit „Mehrstufige Formulare“ können Sie ein langes Formular in kleinere, überschaubare Abschnitte aufteilen und Besucher Schritt für Schritt durch das Formular führen, anstatt alle Felder auf einmal anzuzeigen. Um ein neues mehrstufiges Formular zu beginnen, fügen Sie das Muster „Mehrstufiges Formular“ ein. Sie können auch ein bestehendes Formular in ein mehrstufiges Formular umwandeln.

Sie können die zugehörige Support-Seite aufrufen, um mehr darüber zu erfahren, wie Sie es einrichten und anpassen.

DatenschutzinformationenMD

Der Formularblock ist standardmäßig aktiviert. Er kann jederzeit deaktiviert bzw. wieder aktiviert werden, indem Sie dem Leitfaden folgen, mit dem sich die Funktionen von Jetpack auf einer Seite steuern lassen.

Verwendete Daten
Websiteinhaber / Benutzer Für die Aktivitätsverfolgung (wie unten ausführlich beschrieben): IP-Adresse, die Benutzer-ID von WordPress.com, der Benutzername von WordPress.com, die mit WordPress.com verbundene Website-ID und URL sowie die Version von Jetpack, User-Agent, besuchte URL, verweisende URL, Zeitstempel des Ereignisses, Browsersprache, Ländercode.	Websitebesucher Wenn Akismet auf der Website aktiviert ist, werden die Daten der Kontaktformularübermittlung (IP-Adresse, User-Agent, E-Mail-Adresse, die URL der Website und Kommentar) an den Dienst von Akismet (ebenfalls im Besitz von Automattic) zur Spam-Prüfung übermittelt. Die tatsächlichen Übermittlungsdaten werden in der Datenbank der Website gespeichert, über die sie übermittelt wurden, und direkt an den Inhaber des Formulars (d. h. den Autor der Website, der die Seite veröffentlicht hat, auf der sich das Kontaktformular befindet) per E-Mail gesendet. Diese E-Mail enthält die IP-Adresse des Absenders, den Zeitstempel, den Namen, die E-Mail-Adresse, die Website und die Nachricht. Die IP-Adresse ist als Maßnahme zur Verhinderung von Missbrauch enthalten. Und für Websites, die Akismet verwenden, ist ein wirksamer Spamschutz erforderlich.
Erfasste Aktivitäten
Websitebesitzer / Benutzer Wir erfassen, wann und von welchem Benutzer die Funktion aktiviert und deaktiviert wird und wann CSV-Dateien oder Google Sheets von der Feedback-Formularseite exportiert werden.	Websitebesucher Keine.
Synchronisierte Daten (Mehr erfahren)
Websitebesitzer / Benutzer Wir synchronisieren eine einzelne Option, die angibt, ob die Funktion aktiviert ist.	Websitebesucher Wir synchronisieren Beitrags- und Beitrags-Metadaten, die mit der Kontaktformularübermittlung eines Benutzers verbunden sind. Wenn Akismet auf der Website aktiviert ist, werden auch die ursprünglich mit dem Kommentar übermittelte IP-Adresse und der User-Agent synchronisiert, da sie in den Beitrags-Metadaten gespeichert sind.