Richer Forms with file uploads, Slack integrations, and more

A good form is a must-have for any website. Whether someone wants to ask your team a question or register interest in your services, your contact form is the first place visitors will look to get the conversation started. Ask any modern content team, and they'll tell you forms are vital to engage with leads through gated content. However you use forms, you’ll want to keep your visitors connected because your clients are essential to you.

We know forms play a huge role in modern businesses. As part of a good workflow, they not only collect data but send it where you need it most. Our forms feature has always done that, and now we've improved on it.

Fewer steps, more speed, and security

The significant change in our forms comes in the workflow to set them up. We've pulled most of the configuration steps into the app, and set your Inbox up to belong to your Organization. This means you can link multiple forms to the same Inbox, which is helpful both for managing customer queries from multiple live sites and when testing forms on a staging site.

We have also added vital security steps, including support for hCAPTCHA and a mailer to validate target email addresses, further preventing malicious forwarding.

Finally, we removed the post-build processing step to encrypt your form details, improve build times on your site, and save you precious editing seconds. This change has a direct impact on your editing experience.

JavaScript friendly

In removing the post-build processing, we've also opened the door to newer JavaScript-based SSGs like Gatsby and Next.js, which don't have their forms in HTML. We've provided a starter snippet to help you configure these JavaScript forms.

Slack and webhook integrations

Collecting submissions on your site is only the first part of the journey. The data has to be put to use. To give you a workflow that suits your team, we have integrations with some of the most popular automated webhook platforms: Automate.io, IFTTT, Make, and Zapier. And now, your submissions can be shared with Slack. With these targets on hand, you can ensure your data plays nice wherever your team needs it.

Upload more than just text

The last nugget of goodness we added is actually a big one — you can now support having files attached to your forms. Extending the range of uses for your Forms to include receiving job applications, support documentation and more. We're excited about this, as it means your forms can be more dynamic. (If you're wondering how much your users can upload, find out more about the current file size limits to uploads over in our documentation.)

How to set up your form

Let’s take a quick look at how to set up these new Forms.

1. Set up an Inbox

Create an Inbox by heading to Organization settings > Hosting > Forms. Here you can set your Inbox key, customize your submissions and add a CAPTCHA provider.

2. Link it to your site

Once set up, link your Inbox to the site by heading to Site Settings > Hosting > Forms and following the steps.

3. Configure your form

The next step is to point your form at the Inbox. For HTML, add an input element with the {inbox_key} of your form. These keys allow you to connect multiple forms to the same Inbox, or to different Inboxes. For JavaScript, start with this snippet here.

Your form will be ready to receive submissions, which you can view in CloudCannon. You'll find your Inbox in the site navigation.

4. Forward your submissions to targets:

Here’s where the real magic starts to happen. You can forward your submissions by setting at least one target. We've documented the process for connecting email, Automate.io, IFTTT, Make, Slack, and Zapier. And depending on your plan, you can select multiple targets per Inbox.

What about existing forms?

Don't worry; CloudCannon users with legacy forms don't need to run and update their setup. We have created new Inboxes for all your sites that had form submissions and have automatically attached these to the sites. Your existing sites will continue to work with the legacy forms format.

Read our guide on migrating from legacy to new forms.

Though we will continue to support legacy forms set up on existing sites, users will not be able to create new legacy forms. For new forms, we highly recommend that you move over to the new flow and get the benefits of added speed and security!