Erstellen Sie Formulare über den Blockeditor mit Gutenberg-Formularen

Veröffentlicht: 2020-06-16

Die Suche nach dem perfekten Formular-Plugin ist fast so alt wie WordPress. Projekte sind gekommen und gegangen. Es gibt einige großartige Formular-Plugins, aber viel zu oft besteht die Wahl zwischen massiven Buildern, die die Dinge auf ihre eigene Art und Weise erledigen, und Lösungen, die so einfach sind, dass sie die Erwartungen nicht ganz erfüllen. Munir Kamal hat mit Gutenberg Forms, einem Plugin, das ausschließlich für die Erstellung von Formularen im Blockeditor entwickelt wurde, seinen Hut in den Ring geworfen.

Das Plugin ist keineswegs perfekt. Es hat zahlreiche Macken. Es macht vieles richtig. Es scheitert manchmal mit Funktionen, die das Spiel verändern könnten. Es hat das Potenzial, eines der besten formularerstellenden Plugins für WordPress zu werden.

Ab Version 1.4.0, dem neuesten Update, ist Gutenberg Forms eine Mischung aus Erfolg und Frustration. Ich bin begeistert.

Ich bin aufgeregt, weil wir uns noch in der frühen Phase der Lebensdauer dieses Plugins befinden. Ich bin begeistert, weil Kamal in kurzer Zeit einige erfolgreiche Gutenberg-bezogene Projekte aufgebaut hat, darunter Gutenberg Hub und ACF Blocks. Ich bin gespannt, weil ich glaube, dass es sich mit der Zeit verbessern wird.

Formular-Plugins sind nicht einfach. Trotz seiner aktuellen Probleme, auf die wir noch eingehen werden, ist Gutenberg Forms ein nützliches Plugin, das viele der Kästchen ankreuzt, die ich in einem zukünftigen Formularersteller sehen möchte. Die Ideen für blockbasierte Formulare sind vorhanden. Lediglich die Ausführung bedarf noch etwas Feinschliff.

Gutenberg Forms wurde im Februar dieses Jahres neu erstellt. Kamal veröffentlichte das Plugin ursprünglich im Jahr 2018, aber es blieb anderthalb Jahre in der Schwebe, bevor er es mit den neuesten APIs aktualisierte. Seitdem ist er auf Trab, veröffentlicht regelmäßig Updates und verbessert die Funktionsweise des Plugins. Ich habe es vor Monaten zum ersten Mal getestet und war mit dem Ergebnis nicht zufrieden. Die neueste Iteration ist jedoch viel vielversprechender.

Mit nur mehr als 200 aktuellen Benutzern ist das Wichtigste, was das Plugin braucht, mehr Feedback von mehr Benutzern.

Bauformen

Erstellen eines Standardformulars mit dem Gutenberg-Formular-Plugin.
Erstellen eines Standardformulars.

Gutenberg Forms macht das Erstellen von Formularen einfach. Es gibt zwei Möglichkeiten, Formulare im Plugin zu erstellen. Die erste Methode ist ein benutzerdefinierter „Formular“-Bildschirm im Adminbereich. Es ist ein benutzerdefinierter Beitragstyp, der genau wie ein Beitrag oder eine Seite funktioniert. Der Unterschied besteht darin, dass Benutzer darauf beschränkt sind, vom Plugin bereitgestellte Formularfelder hinzuzufügen. Die Verwendung dieser Methode zum Erstellen von Formularen ist ideal, da das Formular an einem einzigen Ort gespeichert wird und überall auf der Site verwendet werden kann.

Die zweite Methode besteht darin, ein Formular direkt aus dem Beitrags- oder Seiteneditor zu erstellen. Alle benutzerdefinierten Blöcke des Plugins stehen zum Erstellen eines benutzerdefinierten Formulars zur Verfügung. Für einmalige Formulare kann dies die zu verwendende Methode sein, aber ich empfehle stattdessen, vom Formularbildschirm aus zu erstellen.

Nach dem Erstellen eines Formulars über den Formularbildschirm können Benutzer später den Gutenberg-Formularblock verwenden, um ein gespeichertes Formular einzufügen. Was beim Einfügen dieses Blocks tatsächlich passiert, ist, dass das Plugin bei der Auswahl eines gespeicherten Formulars einen Shortcode in den Editor einfügt. Dies ist eine dieser Macken mit dem Plugin. Eine der Ideen von Building Blocks ist, dass Entwickler von der Nutzung des Shortcode-Systems abrücken. Hier muss aus technischer Sicht kein Shortcode eingemischt werden. Es sollte einfach ein serverseitiger Block sein. Ich kann mir nicht vorstellen, dass dies für Endbenutzer von großer Bedeutung ist. Es klappt. Es ist einfach eine Kuriosität, von der ich hoffe, dass sie sich auf lange Sicht entwickelt.

Ein gespeichertes Formular in eine Seite mit dem Gutenberg-Formular-Plugin einfügen.
Ein gespeichertes Formular in eine Seite einfügen.

Das Plugin bietet die meisten gängigen Formularfelder, die Endbenutzer in einem Formular-Plugin erwarten würden. Im Folgenden sind die derzeit verfügbaren Formularfeldblöcke aufgeführt:

  • Berechnung
  • Kontrollkästchen
  • Datumsauswahl
  • Email
  • Datei
  • Formular-Schaltfläche
  • Nachricht
  • Name
  • Nummer
  • Telefon
  • Radio
  • Wählen
  • Text
  • Webseite
  • Ja Nein

Gutenberg Forms enthält auch andere Blöcke, die nicht zum Ausgeben von Feldern dienen. Der Formularspaltenblock ermöglicht es Endbenutzern, spaltenweise Felder zu erstellen. Dies funktioniert hervorragend für Felder, die horizontal ausgerichtet werden müssen, wie z. B. Stadt-, Bundesland- und Postleitzahlfelder. Der Formulargruppenblock ermöglicht es Benutzern, mehrere Blöcke zu gruppieren. Es hat auch mehrere Designoptionen, einschließlich benutzerdefinierter Farben und Polsterung. Der Formularschrittblock ist nützlich, um Schritte in Formularen mit mehreren Schritten hinzuzufügen.

Das größte, aber am wenigsten ausgefeilte Feature ist die vorgefertigte Vorlagenbibliothek, die Gutenberg Forms zur Verfügung stellt. Derzeit verfügt das Plugin über rund drei Dutzend benutzerdefinierte Vorlagen. Angesichts von Kamals Arbeit mit Vorlagen bei Gutenberg Hub gehe ich davon aus, dass wir in Zukunft noch mehr Vorlagen sehen werden.

Einfügen einer Formularvorlage in eine Seite mit dem WordPress-Plugin Gutenberg Forms.
Einfügen einer Formularvorlage in eine Seite.

Das Problem? Der Formularvorlageneinfüger funktioniert nicht immer.

Beim Testen des Plugins sowohl mit dem neuesten WordPress- als auch mit dem Gutenberg-Plugin konnte ich keine Formularvorlage über den neuen Formularbildschirm einfügen. Es gab JavaScript-Fehler, die das Einfügen verhinderten. Eine der aufregendsten Funktionen des Plugins, die zumindest in meiner Testumgebung nicht funktionierte, war eine kleine Enttäuschung.

Während das Einfügen einer Vorlage auf dem Formularerstellungsbildschirm nicht funktionierte, funktionierte es beim Erstellen einmaliger Formulare auf dem Seitenbearbeitungsbildschirm. Allerdings habe ich bei einigen Blöcken nach dem Einfügen die gefürchtete Meldung „Dieser Block enthält unerwarteten oder ungültigen Inhalt“ erhalten.

Dieses Problem ist nicht unüberwindbar. Das Gutenberg-Projekt befindet sich in einem ständigen Wandel. Ich verzeihe diese Art von Problemen im Moment, weil die Dinge so ungeklärt sind, und ich weiß auch, dass sie in einem Update behoben werden können. Ich möchte sie jedoch für Benutzer hervorheben, die in ihren Produktionsumgebungen möglicherweise etwas Ausgefeilteres benötigen. Sie können Formulare ganz einfach ohne die Vorlagenfunktion erstellen.

Abschließende Gedanken

Ja, Gutenberg Forms ist an den Rändern etwas rau. Es ist nicht an dem Punkt, an dem es mit einigen der anderen großen Akteure auf dem Formularmarkt konkurrieren kann. In sechs Monaten oder einem Jahr sollte es jedoch, unter der Annahme einer anhaltenden Verbesserung, in der Lage sein, sein eigenes Stück vom Kuchen abzuschneiden.

Es gibt einige andere Nitpicks mit dem Plugin. Beispielsweise kann der bei einigen Blöcken verfügbare Blockstil „Inline“ nicht auf die Standardeinstellung zurückgesetzt werden. Das „C“ im Checkbox-Blocknamen ist ein Kleinbuchstabe, während alle anderen Blocknamen mit einem Großbuchstaben beginnen. Diese Kleinigkeiten lassen das Plugin weniger ausgefeilt erscheinen, als es ist.

Trotz der von mir skizzierten Probleme würde ich Leuten auf dem Markt für einen blockbasierten Formularersteller empfehlen, diesem Plugin einen Testlauf zu geben. Seine Einfachheit wird es für viele zu einer einfachen Wahl machen. Zum größten Teil funktioniert es gut. Letztendlich können Sie damit Formulare erstellen und die Übermittlungen für diese Formulare direkt in der Datenbank speichern, und das ist es, was wirklich zählt.

Ich bin fest davon überzeugt, dass wir am Anfang von etwas Besonderem stehen. Es wird nur ein bisschen dauern, bis wir dort ankommen. Auch wenn Gutenberg Forms den Form-Builder-Markt nicht übernimmt, sollten sich andere Plugin-Entwickler an der Funktionsweise dieses Plugins orientieren.