Automate your WordPress website using WP webhooks plugin & Latenode!

Key takeaways:

Elevate your WordPress website's functionality by integrating WP Webhooks plugin with Latenode, creating a powerful automation system that streamlines workflows, enhances user engagement, and simplifies content management with ease. This seamless connection between your site and external applications through Latenode's automation capabilities ensures your website operates more efficiently and dynamically than ever before.

Hi! It's Daniel from Latenode. If you ever created a website with WordPress, you have probably noticed that there’s no ability to send WP data to external services, or receive data from external sources without additional plugins.

WP Webhooks appear to be one of the most popular solutions in such cases. Thanks to this plugin, you can use webhooks and HTTP requests to send any data from your WP website and perform any action on it remotely. What does it mean? It means you can automate your WordPress workflow, and in this article, I’ll show you how to do it with Latenode.com!

Best Part?  Besides a step-by-step instruction, you can simply copy the whole scenario I’ll show you in this article! You’ll see the link in the end of this article.

Let’s go!

Step 1: WP Webhooks installation

Plugin download

First things first, go to WP webhooks page and download the plugin as a zip file. You DON’T have to unzip it.

Installation

After that, on your wordpress.com website managing page, go:

My Site > Plugins > Add New Plugin > Upload

Then choose the zip archive you’ve just downloaded and wait for the plugin to install.

You’ll see the WP Webhooks in your plugin tab. Click on Settings to start automating your website!

Step 2: Settings overview

You’ll see various tabs inside of  WP Webhooks settings, but using a free plan, you’ll need only two of them: Send Data & Receive Data.

Send Data

This tab contains:

1. List of available triggers. In other words, here you can choose what event on your website will trigger the execution of an automation workflow you’re going to create.
2. Description of the selected trigger.

Receive Data

Here you can find:

1. Webhooks Actions URL with an API key. You already have one from the start.
2. List of available actions with descriptions

Step 3: Automating your website

Well, it’s time to automate!

That’s the idea of the automation scenario I’ve come up with:

Once a user leaves a comment on my site, the user's nickname, email, and the comment itself are automatically sent to my Google Sheets form. If the comment contains any links, they would be deleted.

Works fine both for collecting feedback and moderating, isn't it? Actually, I’ve already made this scenario on latenode.com, have a look:

Let me explain what is happening here:

1. First is the webhook trigger that activates the scenario every time a new comment on my page appears, and gets all the required comment data.
2. This Google Sheets node generates a new empty row in my spreadsheet.
3. The next Google Sheets node searches for the row that has an 'empty' value in the status column.
4. Iterator processes the value from the previous node. Nodes connected to the upper point are executed first.
5. These Google Sheets nodes update cells with comment info and change status to ‘updated’
6. Then goes HTTP request node that deletes the comment. It is activated only in case there is a link in the comment.
   

But you don't need to build this scenario on your own! Just copy it from the link at the end of the article! And now, it’s time to show you each and every step of creating this automation workflow, let’s go!

Create a new scenario

Go to Latenode.com, log into your account and click the purple button in the upper left corner of the page. After that, you’ll find yourself on the scenario's creating tab.

Rename your scenario, otherwise, it will be called “untitled”. After that, save the changes.
Try to do it every time you change or modify your scenario. Safety first!

Webhook trigger

Now, click add node, and select the webhook trigger. Then, click on the node you’ve added and copy the webhook link. Don’t forget about the “save” button!

Next thing you have to do is to choose the “comment created” trigger in the Send Data tab of WP Webhooks plugin and click on the “Add webhook URL” button.

After that, name the trigger and insert the webhook URL from the Latenode scenario.

And if you click on the “deploy” button (next to “save”), and then “send demo” (actions section of the WH trigger), you’ll see that the connection is already working, nice!

Google Sheets: Add single row

Now, click “add node”, look for Google sheets group, and choose “add single row”.

Sign up with Google to get an authorization token, then select the path of the needed spreadsheet.

The answer for “Does the first row of the sheet have headers?” is “yes”. Then, write “empty” in the “status” field and save the changes.

Google Sheets: Find row

You’ll find this node the same way as a previous one, but now you have to select the “Find row” node.‍

Choose the same authorization token and the path for your spreadsheet.

In the column section, insert “D”(if you’re using the sheet I’ve provided), and “empty” in value.

Simply saying, this node shows where to insert comment data, “empty” status is a marker.

Iterator

Before adding the Iterator, run once two Google Sheets nodes that you have to make the data flow.

After that, click “add node” and choose “other tools”. Here you’ll find it.

To set it up, simply place the results object from the previous node in “data to iterate” field. Then run it once and save the changes.

Google Sheets: Update cell x4

At this step, we fill out the cells of the spreadsheet with the name, email and comment of the user, and change “empty” status to “updated”. That’s why 4 nodes are needed.

Click “add node”, then go to google sheets again and pick the “Update cell” node.

Again, insert your authorization token and choose the path of the spreadsheet.

These actions are the same for all 4 nodes, so you can save this one and simply copy it!

To do so, just right-click on the node, then “copy” and paste it anywhere!

Then, connect them to the upper point of the Iterator.

To avoid confusion, rename the nodes to make them look different.

Now, let’s finish them up! Cell & Value for:

1. Name

Cell: A (googlesheetnumber object from the Iterator)

Value: comment_author object from the webhook trigger

2. Email

Cell: B (googlesheetnumber object from the Iterator)

Value: comment_author_email object from the webhook trigger

3. Comment

Cell: C (googlesheetnumber object from the Iterator)

Value: comment_content object from the webhook trigger

4. Status

Cell: D (googlesheetnumber object from the Iterator)

Value: updated

Don't forget to save the changes!

HTTP request

Wow, the last one! Add node to the right connection point of the iterator, look for “HTTP request” in the app list.

To set it up, you need to put the Webhook action URL from the Receive Data tab of the WP Webhooks plugin. Then go to Webhook actions.

In this case, we’re looking for the “Delete comment” action. To perform this action, you’ll need to modify the URL with &action=delete_comment (check the details) and &comment_id={comment_id object}.

Back to the “HTTP request” node, set the method as GET and save the changes.

And one more thing! If we leave things like that, this scenario will delete every comment.

We have to set up the filter, and that’s how to do it:

Click on the connection between the Iterator and HTTP-request, then “set up filter”.‍

In the opened window, insert name of the filter in the “Label” field

In “condition” field, put “contains” function from the Operators window, after the first gap put comment_id object from the webhook trigger. And after the semicolon, put “https://”. So every comment that has the beginning of the link gets deleted.

That’s it! Let’s test it out!

Testing out

Let’s leave 2 comments: one with the link and one without, and see how it works.

Both comments are in my Google Spreadsheet now.

And that’s how the scenario reacted:

In case with the comment without the link, the HTTP node wasn’t activated, look:

And the one with the comment:

Conclusion

Well, I guess that’s all for today! I hope this article was helpful for you!

As I promised Here you can copy this scenario as a ready-to-go template, but if you really like automating stuff, you are welcome to our Latenode Discord community, where you can find some help from our growing low-code enthusiast community, our developers, and me!

‍

Related articles:

• Automating Without an API
  
• Discovering Low-code: My Marketing Experience and a Basic Guide for Beginners
• Create Integration With Any App: Two Methods