HMnet Forms - fügen Sie Ihrem Shop hochgradig anpassbare Formulare hinzu

Diese Erweiterung benötigt keine spezielle Installation – installieren Sie sie einfach über den Shopware Store.

Um Ihr erstes Formular zu erstellen, gehen Sie zu Inhalte -> Formulare. Sie sehen eine Liste vorhandener Formulare, die direkt nach der Installation noch leer ist. Klicken Sie auf die Schaltfläche Formular erstellen. Sie werden zu einer Seite weitergeleitet, auf der Sie Formulare erstellen können.

Ein Formular erstellen

Jedes Formular benötigt einen Titel. Dieser wird dem Kunden oberhalb der Formularfelder angezeigt. Direkt danach gibt es eine optionale Beschreibung, die dem Kunden ebenfalls angezeigt wird, sofern sie nicht leer ist.

Außerdem benötigt jedes Formular einen eindeutigen technischen Namen, der nur für interne Zwecke verwendet wird. Dies ermöglicht es Shopware, ein Formular von einem anderen zu unterscheiden. Sie können hier beliebige Bezeichnungen eingeben. Der Name sollte aus englischen Buchstaben sowie den Zeichen „-" und „_" bestehen.

Optional können außerdem der E-Mail-Versand im Formular konfiguriert werden. Wenn Sie eine E-Mail-Benachrichtigung erhalten möchten, sobald jemand ein Formular absendet, geben Sie eine Liste von E-Mail-Adressen ein und bestätigen Sie jede mit der Eingabetaste. Diese Adressen erhalten dann eine Benachrichtigung. Es ist außerdem möglich, dem Kunden, der das Formular ausgefüllt hat, eine E-Mail zu senden. Aktivieren Sie dazu einfach die Option E-Mail nach Absenden an Kunden senden?. Damit dies funktioniert, muss das Formular mindestens ein Feld vom Typ E-Mail enthalten. Außerdem müssen Sie eine der von Shopware bereitgestellten E-Mail-Vorlagen auswählen oder eine eigene erstellen. Diese Vorlage wird für die E-Mails an Kunden verwendet. Schließlich gibt es die Option Spam-Schutz (Honeypot) aktivieren. Sie fügt dem Formular ein verstecktes Eingabefeld hinzu, um Bots von echten Nutzern zu unterscheiden, und kann helfen, eine Vielzahl von Spam-E-Mails zu vermeiden.

Als Nächstes gibt es optionale Einstellungen zur Gestaltung der Absende-Schaltfläche: Text der Absende-Schaltfläche und Stil der Absende-Schaltfläche.

Abschließend gibt es einen Bereich, in dem Sie Formularfelder hinzufügen können. Folgende Feldtypen stehen zur Verfügung:

1. Text: der einfachste Typ – ein simples Texteingabefeld
2. Textarea: ein etwas größeres Texteingabefeld (Textbereich) für längere Texte
3. Telefon: ein Feld zur Eingabe einer Telefonnummer
4. E-Mail: ein Feld für eine E-Mail-Adresse. Soll der Kunde nach dem Absenden eine E-Mail erhalten, muss das Formular mindestens eines dieser Felder enthalten.
5. Adresse: ein kombiniertes Eingabefeld. Dem Kunden werden 3 Eingabefelder angezeigt: Straße, Postleitzahl und Ort.
6. Checkbox: ein Feld, das nur Ja/Nein-Eingaben erwartet
7. Link zur aktuellen Seite: ein verstecktes Eingabefeld, das der Kunde nicht sieht. Es wird automatisch von der Erweiterung mit der vollständigen URL der Seite gefüllt, auf der sich das Formular befindet. Nützlich, wenn ein Formular auf mehreren Seiten eingebunden ist.
8. Datum: ein Eingabefeld zur Auswahl nur des Datums
9. Datum und Uhrzeit: ein Eingabefeld zur Auswahl von Datum und Uhrzeit

Die letzten beiden Optionen bieten eine Validierung von Daten anhand der Anzahl von Tagen. So kann beispielsweise eingestellt werden, dass nur Daten akzeptiert werden, die nicht mehr als 14 Tage zurückliegen, z.B. für einen Widerrufsbutton.

Die letzte konfigurierbare Option ist ein optionaler Datenschutzhinweis. Dieser wird dem Kunden nur angezeigt, wenn er nicht leer ist. Bitte beachten Sie, dass manche Formulare gemäß den örtlichen Datenschutzgesetzen einen Datenschutzhinweis erfordern.

Sobald das Formular fertig ist, klicken Sie einfach auf die Schaltfläche "Speichern" und das Formular wird gespeichert und bereit zum Einbau in Ihr Frontend. Beim nächsten Öffnen der Formularliste wird es dort erscheinen. Herzlichen Glückwunsch, Ihr erstes Formular ist einsatzbereit!

Das Formular verwenden

Ein Formular kann auf einer Seite entweder als vollständiges Formular oder als Schaltfläche eingebunden werden, die ein Formular in einem Modal-Fenster öffnet. Dafür gibt es 2 Möglichkeiten:

1. Im Shopware Designer

Gehen Sie zu der Seite, auf der Sie ein Formular hinzufügen möchten. In der Liste der verfügbaren Blöcke sehen Sie eine Kategorie namens "HMnet". Dort finden Sie einen Formular-Block, den Sie an die gewünschte Position ziehen können. Wenn Sie anschließend mit der Maus über den Block fahren, erscheint ein Einstellungssymbol. Klicken Sie darauf, um die Formulareinstellungen zu öffnen: welches Formular verwendet werden soll und wie es verwendet wird.

1. Über Twig-Templates – speziell für Entwickler

Gehen Sie zur Formularliste (im Admin-Panel unter Inhalte -> Formulare) und öffnen Sie die Seite des Formulars, das Sie hinzufügen möchten. Ganz am Ende der Seite finden Sie ein Beispiel, wie dieses Formular in ein Twig-Template eingebunden wird. Kopieren Sie einfach den Code, binden Sie ihn an die gewünschte Stelle im Twig-Teemplate ein und schon funktioniert es.