Zuletzt geändert am:
Dieser Artikel beschreibt, wie Sie Formcentric-Formulare in Ihre Website einbetten.
Damit Formcentric-Formulare auf einer Website angezeigt und genutzt werden können, müssen sie korrekt eingebettet werden.
Die Einbettung erfolgt in wenigen Schritten. Zunächst müssen Sie im Bereich „Meine Domains“ unter „Organisation“ die erforderlichen Domain-Einstellungen vornehmen. Dort fügen Sie die Domains und/oder Subdomains der Websites hinzu, auf denen die Formulare eingebettet werden sollen. Siehe Artikel Domains hinterlegen.
Anschließend können Sie den Einbettungscode kopieren und in das HTML-Markup der Website einfügen, auf der das Formular angezeigt werden soll.
Script-Tag einfügen
Fügen Sie das Script-Tag im <head> oder am Ende des <body> Ihrer Website ein:
Formular-Container einfügen
Fügen Sie den Formular-Container an der Stelle ein, an der das Formular angezeigt werden soll:
Nach dem Einfügen des Einbettungscodes wird das Formular automatisch geladen und angezeigt.
Beispiel:
Wenn Theme-Ressourcen nicht von Formcentric ausgeliefert, sondern lokal von Ihrer Website bereitgestellt werden sollen, können deren Pfade direkt am Formular-Container konfiguriert werden.
Dafür stehen zwei Varianten zur Verfügung.
Variante 1: Theme über Theme-Verzeichnis und Theme-Namen
Variante 2: Theme-Dateien explizit konfigurieren
Im Static-Modus werden beim Laden des Scripts alle vorhandenen Formular-Container initialisiert. Wenn Container erst später ins DOM eingefügt werden, stehen dafür drei Mechanismen zur Verfügung.
window.formcentric.initFormcentric()Dies initialisiert alle aktuell vorhandenen <div data-fc-id> Container erneut.
data-fc-dynamic-init="true" am Script-TagDamit beobachtet der Client das DOM und initialisiert neu hinzugefügte Formular-Container automatisch.
data-fc-watch="true" am Formular-ContainerDamit beobachtet der Client Attributänderungen am Formular-Container. Wenn sich ein Attributwert tatsächlich ändert, wird die laufende Instanz gestoppt und mit den neuen Attributen erneut initialisiert.
Im Static-Modus steht kein komponentenbasiertes Fehler-Callback zur Verfügung. Für die Entwicklung wird daher das Debugging über data-fc-debug am Container, über data-fc-debug am Script-Tag oder über window.formcentric.debug verwendet.
Beispiel am Formular-Container:
