Wichtigste Erkenntnisse:
Erweitern Sie die Funktionalität Ihrer WordPress-Website, indem Sie das WP Webhooks Plugin mit Latenode integrieren. So erstellen Sie ein leistungsstarkes Automatisierungssystem, das Workflows optimiert, die Nutzerinteraktion verbessert und das Content-Management mühelos vereinfacht. Diese nahtlose Verbindung zwischen Ihrer Website und externen Anwendungen über die Automatisierungsfunktionen von Latenode sorgt dafür, dass Ihre Website effizienter und dynamischer arbeitet als je zuvor.
Hallo! Ich bin Daniel von Latenode. Wenn Sie schon einmal eine Website mit WordPress erstellt haben, ist Ihnen wahrscheinlich aufgefallen, dass Sie ohne zusätzliche Plugins keine WP-Daten an externe Dienste senden oder Daten aus externen Quellen empfangen können.
WP Webhooks zählt in solchen Fällen zu den beliebtesten Lösungen. Mit diesem Plugin können Sie Webhooks und HTTP-Anfragen verwenden, um beliebige Daten von Ihrer WP-Website zu senden und Aktionen auf der Website remote auszuführen. Was bedeutet das? Sie können Ihren WordPress-Workflow automatisieren – und in diesem Artikel zeige ich Ihnen, wie das mit Latenode.com funktioniert!
Das Beste daran? Neben einer Schritt-für-Schritt-Anleitung können Sie einfach den gesamten Workflow kopieren, den ich Ihnen in diesem Artikel zeige! Den Link finden Sie am Ende des Artikels.
Los geht’s!
Schritt 1: Installation von WP Webhooks
Plugin herunterladen
Zuerst besuchen Sie die WP Webhooks-Seite und laden das Plugin als ZIP-Datei herunter. Sie müssen die Datei NICHT entpacken.
Installation
Gehen Sie anschließend auf der Verwaltungsseite Ihrer wordpress.com-Website zu:
Meine Website > Plugins > Neues Plugin > Hochladen
Wählen Sie dann das gerade heruntergeladene ZIP-Archiv aus und warten Sie, bis das Plugin installiert ist.
Sie sehen WP Webhooks nun in Ihrem Plugin-Tab. Klicken Sie auf „Settings“, um mit der Automatisierung Ihrer Website zu beginnen!
Schritt 2: Überblick über die Einstellungen
In den Einstellungen von WP Webhooks sehen Sie verschiedene Tabs. Im kostenlosen Tarif benötigen Sie jedoch nur zwei davon: Send Data & Receive Data.
Daten senden
Dieser Tab enthält:
- Eine Liste verfügbarer Trigger. Hier können Sie auswählen, welches Ereignis auf Ihrer Website die Ausführung eines Automatisierungs-Workflows auslösen soll.
- Eine Beschreibung des ausgewählten Triggers.
Daten empfangen
Hier finden Sie:
- Die URL für Webhook-Aktionen mit einem API-Schlüssel. Sie haben bereits von Anfang an eine.
- Eine Liste verfügbarer Aktionen mit Beschreibungen
Schritt 3: Ihre Website automatisieren
Jetzt ist es Zeit für die Automatisierung!
Das ist die Idee hinter dem Automatisierungs-Workflow, den ich erstellt habe:
Sobald ein Nutzer einen Kommentar auf meiner Website hinterlässt, werden der Nutzername, die E-Mail-Adresse und der Kommentar automatisch an mein Google-Sheets-Formular gesendet. Enthält der Kommentar Links, werden diese gelöscht.
Das eignet sich sowohl zum Sammeln von Feedback als auch zur Moderation, oder? Ich habe diesen Workflow bereits auf latenode.com erstellt – sehen Sie selbst:
Ich erkläre Ihnen, was hier passiert:
- Zuerst kommt der Webhook-Trigger, der den Workflow jedes Mal aktiviert, wenn ein neuer Kommentar auf meiner Seite erscheint, und alle erforderlichen Kommentardaten abruft.
- Dieser Google-Sheets-Node erstellt eine neue leere Zeile in meiner Tabelle.
- Der nächste Google-Sheets-Node sucht nach der Zeile mit dem Wert „empty“ in der Statusspalte.
- Iterator verarbeitet den Wert aus dem vorherigen Node. Nodes, die mit dem oberen Verbindungspunkt verbunden sind, werden zuerst ausgeführt.
- Diese Google-Sheets-Nodes aktualisieren Zellen mit den Kommentarinformationen und ändern den Status zu „updated“.
- Danach folgt der HTTP-Request-Node, der den Kommentar löscht. Er wird nur aktiviert, wenn der Kommentar einen Link enthält.
Sie müssen diesen Workflow aber nicht selbst erstellen! Kopieren Sie ihn einfach über den Link am Ende dieses Artikels. Jetzt zeige ich Ihnen jeden einzelnen Schritt zum Erstellen dieses Automatisierungs-Workflows!
Einen neuen Workflow erstellen
Gehen Sie zu Latenode.com, melden Sie sich in Ihrem Konto an und klicken Sie auf den lilafarbenen Button in der oberen linken Ecke der Seite. Anschließend gelangen Sie zum Tab für die Erstellung eines Workflows.
Benennen Sie Ihren Workflow um, andernfalls heißt er „untitled“. Speichern Sie danach die Änderungen. Versuchen Sie, dies jedes Mal zu tun, wenn Sie Ihren Workflow ändern oder anpassen. Sicherheit geht vor!
Webhook-Trigger
Klicken Sie jetzt auf „Add node“ und wählen Sie den Webhook-Trigger aus. Klicken Sie anschließend auf den hinzugefügten Node und kopieren Sie den Webhook-Link. Vergessen Sie nicht den Button „Save“!
Als Nächstes wählen Sie im Tab „Send Data“ des WP Webhooks Plugins den Trigger „comment created“ und klicken auf den Button „Add webhook URL“.
Benennen Sie danach den Trigger und fügen Sie die Webhook-URL aus dem Latenode-Workflow ein.
Wenn Sie auf den Button „deploy“ neben „save“ und anschließend auf „send demo“ im Aktionsbereich des Webhook-Triggers klicken, sehen Sie, dass die Verbindung bereits funktioniert. Perfekt!
Google Sheets: Einzelne Zeile hinzufügen
Klicken Sie jetzt auf „Add node“, suchen Sie nach der Google-Sheets-Gruppe und wählen Sie „add single row“.
Melden Sie sich mit Google an, um ein Autorisierungstoken zu erhalten, und wählen Sie anschließend den Pfad der gewünschten Tabelle aus.
Die Antwort auf „Does the first row of the sheet have headers?“ lautet „yes“. Schreiben Sie dann „empty“ in das Feld „status“ und speichern Sie die Änderungen.
Google Sheets: Zeile finden
Sie finden diesen Node auf dieselbe Weise wie den vorherigen, müssen jetzt jedoch den Node „Find row“ auswählen.
Wählen Sie dasselbe Autorisierungstoken und den Pfad zu Ihrer Tabelle aus.
Geben Sie im Bereich für die Spalte „D“ ein (wenn Sie die von mir bereitgestellte Tabelle verwenden) und bei Value „empty“.
Einfach gesagt zeigt dieser Node an, wo die Kommentardaten eingefügt werden sollen. Der Status „empty“ dient als Markierung.
Iterator
Bevor Sie den Iterator hinzufügen, führen Sie die beiden Google-Sheets-Nodes einmal aus, damit die Daten fließen.
Klicken Sie anschließend auf „Add node“ und wählen Sie „other tools“. Dort finden Sie ihn.
Zur Einrichtung fügen Sie einfach das Ergebnisobjekt aus dem vorherigen Node in das Feld „data to iterate“ ein. Führen Sie ihn dann einmal aus und speichern Sie die Änderungen.
Google Sheets: Zelle aktualisieren x4
In diesem Schritt füllen wir die Zellen der Tabelle mit Name, E-Mail-Adresse und Kommentar des Nutzers und ändern den Status „empty“ zu „updated“. Deshalb werden 4 Nodes benötigt.
Klicken Sie auf „Add node“, gehen Sie erneut zu Google Sheets und wählen Sie den Node „Update cell“ aus.
Fügen Sie erneut Ihr Autorisierungstoken ein und wählen Sie den Pfad der Tabelle aus.
Diese Schritte sind für alle 4 Nodes identisch. Sie können diesen Node also speichern und einfach kopieren!
Klicken Sie dazu mit der rechten Maustaste auf den Node, wählen Sie „copy“ und fügen Sie ihn an einer beliebigen Stelle ein!
Verbinden Sie sie dann mit dem oberen Verbindungspunkt des Iterators.
Um Verwechslungen zu vermeiden, benennen Sie die Nodes unterschiedlich.
Jetzt richten wir sie fertig ein! Cell & Value für:
- Name
Cell: A (googlesheetnumber-Objekt aus dem Iterator)
Value: comment_author-Objekt aus dem Webhook-Trigger
Cell: B (googlesheetnumber-Objekt aus dem Iterator)
Value: comment_author_email-Objekt aus dem Webhook-Trigger
- Kommentar
Cell: C (googlesheetnumber-Objekt aus dem Iterator)
Value: comment_content-Objekt aus dem Webhook-Trigger
- Status
Cell: D (googlesheetnumber-Objekt aus dem Iterator)
Value: updated
Vergessen Sie nicht, die Änderungen zu speichern!
HTTP-Anfrage
Wow, der letzte Schritt! Fügen Sie am rechten Verbindungspunkt des Iterators einen Node hinzu und suchen Sie in der App-Liste nach „HTTP request“.
Für die Einrichtung müssen Sie die Webhook Action URL aus dem Tab „Receive Data“ des WP Webhooks Plugins einfügen. Gehen Sie dann zu „Webhook actions“.
In diesem Fall suchen wir nach der Aktion „Delete comment“. Um diese Aktion auszuführen, müssen Sie die URL um &action=delete_comment ergänzen (siehe Details) sowie um &comment_id={comment_id object}.
Gehen Sie zurück zum Node „HTTP request“, legen Sie als Methode GET fest und speichern Sie die Änderungen.
Und noch etwas! Wenn wir es so lassen, löscht dieser Workflow jeden Kommentar.
Wir müssen einen Filter einrichten – so geht es:
Klicken Sie auf die Verbindung zwischen dem Iterator und der HTTP-Anfrage und dann auf „set up filter“.
Geben Sie im geöffneten Fenster einen Namen für den Filter in das Feld „Label“ ein.
Fügen Sie im Feld „condition“ die Funktion „contains“ aus dem Fenster „Operators“ ein. Nach der ersten Lücke fügen Sie das Objekt comment_id aus dem Webhook-Trigger ein. Nach dem Semikolon geben Sie „https://“ ein. So wird jeder Kommentar gelöscht, der den Anfang eines Links enthält.
Das war’s! Testen wir es!
Testen
Hinterlassen wir 2 Kommentare: einen mit Link und einen ohne Link, und sehen wir uns an, wie es funktioniert.
Beide Kommentare befinden sich jetzt in meiner Google-Tabelle.
So hat der Workflow reagiert:
Beim Kommentar ohne Link wurde der HTTP-Node nicht aktiviert, sehen Sie:
Und beim Kommentar mit Link:
Fazit
Ich denke, das war’s für heute! Ich hoffe, dieser Artikel war hilfreich für Sie!
Wie versprochen können Sie hier diesen Workflow kopieren und als sofort einsatzbereite Vorlage verwenden. Wenn Sie Automatisierungen wirklich mögen, sind Sie außerdem herzlich in unserer Latenode Discord-Community willkommen. Dort erhalten Sie Unterstützung von unserer wachsenden Community aus Low-Code-Enthusiasten, unseren Entwicklern und mir!
