Integration in Umbraco CMS

Für die Verbindung zu Umbraco CMS haben wir eine kleine Erweiterung entwickelt. Mit dieser Erweiterung wird ein neuer Data Type bereitgestellt, welcher die Auswahl eines Formulars aus deinem FlyingForms Projekt ermöglicht. Und anschließend in deine Seite integriert.

Du kannst das Package hier oder bei Umbraco herunterladen.

Direkter Download: FlyingForms.Umbraco Package

Installation Umbraco package 'FlyingForms.Umbraco'

Install Umbraco package - Step 1

Als erstes muss das Package heruntergeladen und installiert werden. Das Package wird über den Standard Umbraco Package Installer installiert. Alternativ über den Umbraco Package Wizard.

Nach der Installation sind nur noch wenige Schritte notwendig.

Einrichtung der FlyingForms.config Datei

Configure Umbraco package

Das Package beinhaltet eine Beispiel Konfigurationsdatei (/config/FlyingForms/flyingforms.config.example). Die Datei muss nur kopiert oder umbenannt werden, sodass kein .example am Ende des Dateinamen steht. Wichtig ist, dass der Name klein geschrieben ist.

Es gibt drei Settings die eingestellt werden müssen: 'FlyingForms.ProjectName', 'FlyingForms.ProjectId' and 'FlyingForms.Token'. Der ProjectName ist der Name deines FlyingForms Projekts, bspw. wenn deine Subdomain 'my.flyingforms.io', dann ist es 'my'. Die Projekt Id und der Token steht bei dem Api Access Point in den Projekteinstellungen.

Einrichtung Rendering in View

Setup Rendering Step 1

Mit der Erweiterung kommt ein neues Rendering hinzu 'FlyingFormsForm', welches in deiner View hinzugefügt werden muss.

Als Model wird das 'Form' Field von dem Document Type übergeben. So ist ein beliebiger Name möglich.

Data Type zum Document Type hinzufügen

Data Type in Document Type

Der Data Type muss passend zum Rendering auf dem Document Type angelegt werden. Dazu den Data Type 'FlyingForms Form' auswählen.

Modul Einstellungen

Module Settings

Nach der Erstellung des ersten Moduls, können bereits Einstellungen vorgenommen werden. Der wichtigste Schritt ist die Auswahl des Formulars. Das Dropdown füllt sich automatisch anhand der Formulare im FlyingForms.

Optionale Einstellungen sind 'Apply Stylesheet' und 'Render Approved in Preview'. Wenn 'Apply Stylesheet' aktiviert ist, werden die Stylings welche im Formular hinterlegt sind verwendet. Ansonsten wird nur das Markup gerendert und kein weiteres Styling angewendet. Sehr hilfreich wenn die Seite bereits Styling für Formulare besitzt. In manchen Fällen ist es sinnvoll, wenn die letzte bestätigte Version in der Preview angezeigt wird, dazu muss 'Render Approved in Preview' aktiviert werden. Ansonsten beinhaltet nur die publizierte Version von Sitecore die bestätigten Versionen eines Formulars.

Fertig

Render form

Wenn alle Schritte durchlaufen sind, wird dein Formular angezeigt. :)

Artikel und Links die für dich interessant sein können:

Erstelle einen Api Access Point Projekte Plugins