So erstellen Sie automatisch WordPress-Tabellen mit Online-Formulareinträgen
Veröffentlicht: 2021-02-12Da Sie hier sind, möchten Sie wahrscheinlich Ihre Formulareinträge in einem tabellarischen Format anzeigen, damit Ihr Publikum die beste Erfahrung macht. Wir haben zufällig eine hervorragende Lösung für Sie! Um Formulareinträge in WordPress-Tabellen hinzuzufügen, benötigen Sie lediglich ein Formular und ein Tabellen-Plugin in WordPress.
Warum wir Formular- und Tabellen-Plugin-Integration brauchen
Wenn Sie sich nicht für eine automatisierte Lösung entscheiden, versuchen wir uns vorzustellen, wie der Prozess wahrscheinlich aussehen wird.
Angenommen, Sie haben ein Online-Formular auf Ihrer Website und möchten die Formulareinträge in tabellarischer Form anzeigen. Dazu müssen Sie entweder:
1. Kopieren Sie die Formularübermittlungen manuell und fügen Sie sie in Ihre Tabelle ein. Dies erfordert jedoch viel Aufwand und lässt eine Chance für menschliches Versagen. Ganz zu schweigen von der Zeit, die jeden Tag benötigt wird, um die Aufgabe zu erfüllen.
Oder,
2. Sie können eine CSV-Datei der Formulardaten exportieren und zu Ihrer Tabelle hinzufügen, wobei die Tabelle in regelmäßigen Abständen aktualisiert wird. Diese Option erfordert menschliches Eingreifen und Mühe und ist definitiv mühsam.
In diesem Sinne ist die Integration von Ninja Tables mit Fluent Forms ein Retter, wenn Sie die Formulareinträge automatisch abrufen und in einer Datentabelle platzieren müssen. Und die Tabelle wird in Echtzeit aktualisiert, sodass Sie die Dateneingaben nicht manuell verwalten müssen und keinen Spielraum für Fehler lassen.
Wir werden gleich einige Tricks enthüllen, wie Sie Fluent Forms-Daten mit Ninja Tables abrufen und auf Ihrer WordPress-Website in tabellarischer Form anzeigen können. Hören Sie uns an, wenn Sie Ihr Leben einfacher machen wollen.
Formulareinträge in WordPress-Tabellen hinzufügen: Ninja Tables und Fluent Forms
Fluent Forms ist das ultimative Kontaktformular-Plugin für Online-Formulare und derzeit eines der besten auf dem Markt! In ähnlicher Weise ist Ninja Tables der fortschrittlichste Tabellenersteller für WordPress und auch eine erstklassige Datentabellenlösung.
Die Integration von Fluent Forms mit Ninja Tables bedeutet, dass ein WordPress-Fan etwas wirklich Cooles zu zeigen hat! Sie müssen nur einmal ein Formular mit Fluent Forms erstellen, und alle Aktualisierungen werden automatisch in Ninja Tables angezeigt, wenn Sie die Integration konfiguriert haben.
Bevor wir fortfahren, überprüfe noch einmal, ob du beide Plugins in deinem WordPress installiert hast.
Hier erfahren Sie, wie Sie Tabellen in WordPress mit Formularen erstellen.
Formulareinträge in WordPress-Tabellen mit Ninja Tables und Fluent Forms (5 Schritte)-
- Erstellen Sie ein Formular in Fluent Forms
- Eingabe von Formulardaten
- Formular absenden
- Verbinden Sie Ninja Tables mit Fluent Forms
- Zu Ende bringen
Schritt 1: Erstellen Sie ein Formular in Fluent Forms
Gehen Sie zunächst zu Ihrem WordPress-Dashboard und wählen Sie „Neues Formular hinzufügen“. Sie können auch „Neues Formular“ aus dem Dropdown-Menü in der Seitenleiste auswählen.

Jetzt sehen Sie mehrere Felder mit mehreren Formularkategorien. Die Basiskategorie hat vorerst fünf Optionen.
- Leeres Formular
- Kontakt Formular
- Newsletter-Formular
- Support-Formular
- Umfrageformular
Unten gibt es noch weitere Kategorien. Zum Beispiel – Produkt, Bildung, HR, Marketing, IT, Finanzen, soziale Einladung usw.

Für diese Demonstration bearbeiten wir ein leeres Formular, um Ihnen den Einstieg zu erleichtern. Der Ablauf ist für alle gleich.
Sobald Sie ein leeres Formular öffnen, zeigt das Fenster zwei Formularerstellungsoptionen an – Eingabefelder und Eingabeanpassung .
Zum Erstellen können Sie
- Klicken Sie auf die Felder
- Drag-and-Drop-Feld auf der linken Seite
- Klicken Sie auf das „+“-Zeichen
- Suchblock
Wie Sie sehen können, wird das Formular automatisch benannt. Sie können den Namen im hervorgehobenen Bereich oben links bearbeiten.
Wenn Sie bereits ein Formular bereit haben, können Sie diesen Schritt überspringen und direkt mit Schritt 4 fortfahren. Wenn nicht, folgen Sie den Anweisungen.
Unsere Dokumentation zum Erstellen eines Formulars mit Fluent Forms kann Ihnen auch dabei helfen, es besser zu verstehen.
Schritt 2: Formulardateneingabe
Wir haben vier Felder ausgewählt: Name, E-Mail, Adresse und Telefonnummer. Im Bedienfeld „Eingabeanpassung“ können Sie die Eingabe beliebig oft bearbeiten. Aktivieren oder deaktivieren Sie einfach, indem Sie auf die Kontrollkästchen klicken.
Hier können Sie mit dem „+“-Symbol auf jedem Block neu positionieren, bearbeiten, duplizieren und löschen. Fluent Forms ermöglicht dem Benutzer, für eine klarere Ansicht über das Symbol in der oberen rechten Ecke in den Vollbildmodus zu wechseln.

Wir werden unsere Form auch „ Dunder Mifflin “ nennen. Fahren Sie nun mit „Formular speichern“ fort. Und gehen Sie zu „Vorschau & Design“.
Schritt 3: Formular absenden
Im Bereich „Vorschau & Design“ können Sie die Formularstilvorlage ändern. Ebenso können Sie die Sternchen-Position, die Inline-Fehlermeldung, die Erfolgsmeldung nach dem Absenden und die Fehlermeldung nach dem Absenden von Misc anpassen.
Klicken Sie auf „Einstellungen speichern“, wenn Sie mit der Einrichtung und Anpassung des Formulars fertig sind.
Sie können das Formular zu Testzwecken mit Dummy-Einträgen füllen und sich vergewissern, dass alles funktioniert. Die erste Einreichung ist der erste Eintrag. Wenn Sie jedoch mehr möchten, laden Sie die Formulareintragsseite nach dem Absenden neu und fügen Sie weitere Einträge im Bereich „Editor“ hinzu. Das Formular zeigt die Eintragsaktualisierung an, wenn Sie „Einträge“ neu laden.
Auch hier können Sie zu „Vorschau & Design“ gehen, um das Formulardesign zu bearbeiten.

Wenn Sie der Meinung sind, dass ein eingereichter Beitrag bearbeitet werden muss, klicken Sie unter „Aktion“ auf die Schaltfläche „Anzeigen“ (Augensymbol) und dann auf die Schaltfläche „Bearbeiten“. Das Fenster zeigt Details zu diesem bestimmten Eintrag, den Sie bearbeiten möchten.
Wir haben nur vier verschiedene Einträge mit Name, E-Mail, Adresse und Telefonnummern auf unserem „Dunder Mifflin“-Formular hinzugefügt. Aber Fluent Forms kann tatsächlich unbegrenzt Einträge annehmen!
Schritt 4: Verbinden Sie Ninja Tables mit Fluent Forms
Abschließend müssen Sie Folgendes tun, um Ihre Formulareinträge in einer WordPress-Datentabelle darzustellen.
Gehen Sie auf dem Dashboard zu Ninja Tables und klicken Sie auf „Tabelle hinzufügen“, um ein Popup-Fenster wie das folgende Bild zu erhalten.

Wählen Sie nun die Option „Fluent-Formular verbinden“ in der linken Seitenleiste. Benennen Sie dann die Tabelle auf „Tabellentitel“ und „Formular auswählen“.
Wir haben unsere Tabelle „ Dunder Mifflin-Einträge im Tabellenformat anzeigen“ genannt und das zuvor in Schritt 1 erstellte Formular „Dunder Mifflin“ ausgewählt. Sie können auch jedes andere vorgefertigte Formular auswählen.
Die Formularauswahl führt zu „Eingabefelder auswählen“, wo Sie auswählen können, welche Eingabefelder aus dem Formular Ihre Tabelle als Spalten anzeigen soll.
Gleich nach einem Klick auf „Speichern“ erscheint die Tabelle mit allen Formulareinträgen.

Der Rest ist für alle Ninja-Tische genau gleich. Als Ergebnis können Sie die Zeilen bearbeiten, entwerfen und konfigurieren, importieren-exportieren usw. Hier finden Sie eine detaillierte Anleitung zum Anpassen und Gestalten von Ninja-Tabellen.
Schritt 5: Fertig machen
Das ist es!
In Schritt 4 schließen Sie den Prozess des Einfügens von Formulareinträgen in eine Datentabelle weitgehend ab. Dieser Schritt hier soll Ihnen zeigen, wie der Abschlusstisch aussehen wird.

Wir haben den Tisch mit der Farbanpassungsfunktion von Ninja Tables entworfen. Sie können jetzt den Shortcode der Tabelle kopieren und an einer beliebigen Stelle in Ihren WordPress-Post/-Seiten einfügen.
Einige zusätzliche Bits
- Das Beste an der Integration von Ninja Tables und Fluent Forms ist die automatische Aktualisierung . Alle Daten, die Sie im Formular bearbeiten, werden in der Tabelle angezeigt.
- Sie können unbegrenzt Einträge eingeben und so viel anpassen, wie Sie möchten.
- Keine Programmierkenntnisse erforderlich.
- Schauen Sie sich die ausführliche Dokumentation zu dieser Integration an.
Schlußbemerkungen
Fluent Forms und Ninja Tables sind zweifellos die stärkste Kombination für einen WordPress-Fan oder sogar einen Anfänger! Mit den benutzerfreundlichen Funktionen und der intelligenten Benutzeroberfläche ermöglicht die Integration dieser beiden Plugins eine perfekte Datenpräsentation.
Wir haben besprochen, wie man Formulareinträge in WordPress-Tabellen mit Ninja Tables und Fluent Forms hinzufügt. Dieser kurze Artikel war hoffentlich genug für Sie. Rufen Sie uns an, wenn Sie Probleme haben, etwas zu verstehen.
Sie können einen weiteren Artikel über das Einbetten von Google Sheets in Ihre Online-Datentabellen überfliegen.