Eigenes Formular anlegen

Um ein eigenes Formular anzulegen, benötigst Du die Erweiterung "CMS Erweiterungen". Diese ist Teil des Shopware Evolve Plans von Shopware 6.

Schritt 1: Erlebniswelt auswählen

Um Deiner Erlebniswelt ein eigenes Formular hinzuzufügen, klicke auf Inhalte > Erlebniswelten und wähle die Erlebniswelt, zu der das Formular hinzugefügt werden soll.
Alternativ kannst Du auch eine komplett neue Erlebniswelt/ Layout anlegen. 

Schritt 2: Formular per Drag & Drop hinzufügen

Klicke innerhalb der Erlebniswelt auf der rechten Seite auf das + Symbol (1), um einen neuen Block hinzuzufügen. Wähle nun als Block-Kategorie im Dropdown Formular (2) aus. Neben dem Standard-Formular, bspw. für den Kontakt, kannst Du nun auch ein eigenes Formular in Deine Erlebniswelt ziehen. Das Formular kannst Du per Drag & Drop(3) in die Erlebniswelt ziehen. Hinweis: Oben rechts auf der Seite finden Sie einen Button, um die Sprache des Formulars zu ändern.

Schritt 3: Formular erstellen

Anschließend öffnet sich ein Popup Fenster, in dem Du auswählen kannst, ob Du eine zuvor von Dir erstellte Vorlage nutzt oder ein neues Formular erstellst.

Formular Einstellungen - Optionen

Wenn Du ein neues Formular erstellst oder ein bestehendes bearbeitest, öffnet sich das Fenster Formular Einstellungen mit den Reitern Optionen und Felder. Im Reiter Optionen triffst Du die grundsätzlichen Einstellungen des Formulars. 

Name (intern) (1): Trage hier ein, wie das Formular intern heißen soll. Wenn Du das Formular beispielsweise in den Vorlagen abspeicherst, wird dieser Name verwendet. 
Überschrift (2): Die Überschrift wird in der Erlebniswelt, also im Frontend, als Überschrift für das Formular verwendet. 
Bestätigungstext (3): Der Bestätigungstext wird dem Anwender angezeigt, sobald er das Formular ausgefüllt hat.
Empfänger-Adresse (4): Trage hier alle E-Mail-Adressen ein, an die das ausgefüllte Formular geschickt werden soll. Mehrere Adressen können einfach eingetragen werden, indem hinter jeder Adresse die Eingabetaste gedrückt wird. 
E-Mail-Template (5): Wähle hier das E-Mail-Template, welches für den Versand des Formularinhaltes an die Empfänger-Adressen genutzt werden soll. 
Als Vorlage speichern (6): Speichere hier Deine Konfiguration als Vorlage für weitere Formulare ab.

Schritt 4: Felder erstellen

Im Reiter Felder kannst Du angeben, welche Felder vom Anwender ausgefüllt werden können oder müssen. Hierzu kannst Du Gruppen anlegen, welche dann ein oder mehrere Felder enthalten. 

Gruppe (1): Auf der linken Seite siehst Du die Gruppen des Formulars. Über die Punkte auf der linken Seite kannst Du die Reihenfolge der Gruppen per Drag & Drop ändern.
Gruppen Kontextmenü (2): Auf der rechten Seite jeder Gruppe kannst Du die Position der Gruppe verändern, sie löschen oder auch duplizieren. Außerdem kannst Du dort die Gruppe bearbeiten, sodass auf der rechten Bildschirmseite weitere Optionen zu der Gruppe angezeigt werden. Dort kannst Du zum einen den internen Namen der Gruppe angeben. Zum anderen kannst Du hier die Überschrift der Gruppe angeben, die auch im Frontend angezeigt werden soll. 
Feld (3): Die Felder befinden sich innerhalb einer Gruppe. Über die Punkte auf der linken Seite kannst Du die Reihenfolge der Felder innerhalb der Gruppe per Drag & Drop ändern. 
Feld Kontextmenü (4): Auf der rechten Seite des Feldes kannst Du über das Kontextmenü die Position des Feldes verändern, das Feld in eine andere Gruppe verschieben, es duplizieren oder löschen. Außerdem kannst Du das Feld dort bearbeiten, sodass auf der rechten Bildschirmseite weitere Optionen zu dem Feld angezeigt werden. 
Feld hinzufügen (5): Hier kannst Du ein neues Feld innerhalb der jeweiligen Gruppe erstellen. 
Gruppe hinzufügen (6): Über diesen Button fügst Du eine neue Gruppe inklusive eines Feldes hinzu. 
Optionen (7): Je nachdem ob Du gerade eine Gruppe oder ein Feld bearbeitest, findest Du auf der rechten Seite weitere Optionen für die jeweilige Gruppe oder für das jeweilige Feld.
Bearbeitest Du eine Gruppe, siehst Du die Angaben Name (Intern) und Überschrift. Die Überschrift ist hierbei im Frontend sichtbar, während der Interne Name als interne Identifikation dient. Beispielsweise als Variable in E-Mail-Templates.
Welche Optionen hier angezeigt werden, wenn Du ein Feld bearbeitest, siehst Du hier. 
Als Vorlage speichern (8): Über diesen Button kannst Du das soeben erstellte Formular als Vorlage speichern. Beim Hinzufügen neuer Formulare zu Deiner Erlebniswelt, kannst Du diese Vorlagen dann auswählen und weiterbearbeiten. 
Fertig (9): Um alle Änderungen in dem aktuellen Formular zu übernehmen, klickst Du abschließend auf Fertig.

Felder Optionen

Wenn Du Felder bearbeitest, siehst Du die Optionen, die Du bearbeiten kannst, auf der rechten Seite. Hierbei unterscheiden sich die möglichen Optionen je nachdem welchen Typ das Feld hat, das Du bearbeitest. Folgende Optionen sind aber bei jedem Typ immer vorhanden. 

Name (1): Der Interne Name dient als eindeutige Identifikation für die Verwendung dieses Feldes als Variable. Zum Beispiel in E-Mail-Templates.
Titel (2): Dies ist der Name, den das Feld auch im Formular im Frontend trägt. 
Typ: (3): Wähle hier den Typen, den das Feld haben soll. Nach diesem Typen entscheidet sich, welche Werte in das Feld eingetragen werden können und wie diese auszusehen haben. Wir haben die verfügbaren Typen nachfolgend aufgelistet. 
Breite (4): Hier legst Du fest, wie breit ein Feld sein soll. Wenn zwei nachfolgende Felder zusammen maximal 100% der Breite verwenden, werden sie im Formular nebeneinander angezeigt. Dies ist beispielsweise sinnvoll, wenn Informationen in zwei Feldern eingetragen werden sollen, aber inhaltlich zusammengehören, bspw. Straßenname und Hausnummer. 
Pflichtfeld (5): Gib hier an, ob das Feld ausgefüllt werden muss oder nicht.
Fehlermeldung (6): Diese Meldung wird dem Benutzer im Frontend angezeigt, wenn es sich um ein Pflichtfeld handelt und dies nicht ausgefüllt wurde. 

Textfeld & E-Mail-Feld

Bei dem Feldtyp Text oder E-Mail kannst Du einen Platzhaltertext angeben, der angezeigt werden soll, wenn das Feld noch nicht ausgefüllt wurde. 

Nummernfeld

Für Felder mit dem Typ Nummer kannst Du optional angeben, ob es eine Minimal- oder Maximalgrenze geben soll. Außerdem kannst Du angeben, in welchen Schritten der Benutzer Nummern eingeben kann. Trägst Du hier z.B. eine 3 ein, kann der Benutzer hier nur Zahlen 3, 6, 9, 12, 15, usw... auswählen. 

Auswahlfeld

Das Auswahlfeld ist eine Checkbox, die der Benutzer aktivieren oder deaktivieren kann. Im Standardwert kannst Du angeben, ob das Feld standardmäßig schon aktiviert sein soll oder nicht. 

Auswahl

Bei dem Feldtyp Auswahl kannst Du dem Benutzer eine Auswahl vorgeben, aus der er dann das für sich passende auswählen kann. Wählst Du hier Inhalt = Entität aus, kannst Du im zweiten Schritt auswählen, aus welcher Shop Entität der Benutzer eine Auswahl treffen kann. 
Wählst Du Inhalt = Benutzerdefiniert, kannst Du im zweiten Schritt selber Werte angeben, aus denen der Benutzer dann auswählen kann. Tippe die Werte dazu in das Feld Werte und drücke die Enter Taste.

Textfläche

Die Textfläche dient dazu, einen längeren Text einzugeben. Neben dem Platzhaltertext kannst Du hier zusätzlich angeben, wie viele Zeilen der Benutzer verwenden darf und ob der Benutzer die Größe der Textfläche selber verändern darf. 

Schritt 5: Layout zuweisen

Wenn Du Dein Formular fertig konfiguriert und gespeichert hast, kannst Du das Formular zuweisen, damit es in Deinem Shop angezeigt wird. Klicke hierzu auf das Symbol (1). Du kannst nun auswählen, ob das Formular in einer Shopkategorie oder auf einer Shopseite angezeigt wird. Du kannst hier auch mehrere auswählen.

Ansicht in der Storefront