[Easy Setup] How to Automatically Connect Form Data with Webflow

Integrate Google Form Data with Webflow

You can automatically integrate response data from Google Forms into Webflow.
Since you can create forms in a wide range of data formats for free if you use Google services, it's perfect for those who want to try integration easily.

Integrate Typeform Data with Webflow

You can automatically integrate Typeform response data with Webflow.
By connecting Typeform's intuitive form operations with Webflow, both form respondents and administrators will have an enhanced experience in form usage and data management.

‍

Integrate Jotform Data with Webflow

You can automatically integrate response data from Jotform with Webflow.
It is possible to seamlessly integrate response data from forms created with Jotform's extensive widgets into Webflow.

Integrate Tally Data with Webflow

You can automatically integrate Tally response data with Webflow.
Even simple forms in Tally can be integrated with Webflow using the API. This is recommended for those who want to manage data effectively, even with minimal forms.

Integrate Zoho Forms Data with Webflow

You can automatically integrate response data from Zoho Forms with Webflow.
For those who are familiar with using Zoho services, this form can also be integrated with Webflow to achieve response data integration.

Let's Create a Webflow and Form Integration Flow

Now, let's actually create an integration flow between Webflow and a form!
This time, we'll proceed with the setup using Yoom, a no-code platform.
If you don't have a Yoom account yet, you can create one from this registration form.

[What is Yoom]

This time, we will create a flowbot that "adds items to a Webflow collection based on form responses"!
The creation process is broadly divided into the following steps.

• Register your app with Webflow
• Copy the template
•  Set up Yoom's form trigger and Webflow's action settings
• Set the trigger to ON and complete the preparation for flow operation

Step 1: Register Your App with Webflow

Before creating a Flowbot, you need to link your app with Yoom!
Once logged into Yoom, select "My Apps" and click on "Add".

Select Webflow from the list of apps.
Using the search bar can make it easier to find!

Set the account name to any name you like, such as "Admin" or "Project Name".
Obtain an access token from the Webflow admin panel and set it up.
Check the annotations for how to obtain it.

Now you have registered your app with Webflow!

Step 2: About Copying Templates

Next, let's copy a template from the Yoom site.
In Yoom, you can also create a Flowbot from scratch without using a template!
Here, we'll introduce the setup procedure using a template for easier configuration.
Click on the banner below.

Click "Try this template".

Let's click "OK".

Now you have a copy of the template.
The copied template is saved in My Projects.

‍

Step 3: Set up Yoom's form trigger

Next, let's proceed to the Flowbot settings!
Please click on the "Form" of the template you just copied.

First, let's create a form!

Create a Form

Set up the form fields as follows.
Set up the "Title" and "Slug" required for the next Webflow action settings.

You can add more fields by clicking "Add".
Once set, click Next.

Form Display Confirmation and Detailed Settings

The contents of the fields you set in the form should be displayed.
Please enter sample values for each field.
After setting, save it.

Step 4: Set up Webflow Actions

This is the final setup step!
Click "Add Item to Collection".

Select Linked Account and Action

The title is pre-entered, but you can change it.
Check if the account information linked to Webflow is associated with the account you want to link.
Make sure the action is set to "Add Item to Collection" and click Next.

API Connection Settings

Select the Site ID and Collection ID from the options.

Set the field information.
Select Title(Name) from the options for the field.
Select the title from the values obtained by the form trigger.
If you manually enter values without using the obtained values, the same content will be repeatedly added to the Webflow collection, so be careful!
For more details, check here.

Select Slug from the options for the field.
Select Slug from the values obtained by the form trigger.
Once everything is set, click Test.
If you can add an item to the Webflow collection, save it.

After saving, turn "Trigger ON" and check the operation.

Now the Flowbot setup is complete.

Convenient Automation Examples Using Webflow

Besides the form integration introduced this time, it is also possible to add Webflow information to a database or add Webflow form submission data to Salesforce or Hubspot.
In this way, you can automate various tasks using Webflow's API, so if there's something you're interested in, please give it a try!

In Conclusion

By integrating forms with Webflow, the data submitted through forms will automatically be added as items in Webflow's collection. This saves you the hassle of accessing the Webflow management screen to manually create items!
In other words, even if you can't open your computer, you can create items just by submitting forms from your smartphone, allowing you to create content anytime, anywhere!

Moreover, setting up automation using Yoom requires no programming, making it easy for beginners to start with confidence.
The ability to achieve advanced automation through intuitive operations is a unique charm of Yoom. If you want to implement such automation, register with Yoom now!
You can create a free account, allowing you to immediately check the actual usability! Please give it a try!