To receive form submissions from your sites, you first need to connect your site to an Inbox in CloudCannon.
To connect your site to an Inbox:
- Navigate to the forms menu in your site settings, under Hosting > Forms.
- In the Link Inbox menu, select the Inbox you want to link.
- At this point, you can also toggle the visibility of the Inbox on your site with the Display Inbox option. You can also require a CAPTCHA for submissions from this site with the Require CAPTCHA option. See here for more information about using CAPTCHA for your Inbox.
- Click Link Inbox to finish linking the Inbox to your site.
Now create a form on your site and configure it to submit to one of your connected Inboxes.
To create a form:
- Add an HTML form to a page.
- Set the method attribute to post.
- Set the action to the URL to redirect the visitor to after they submit the form.
- Add an input element with the name
inbox_keyand set its value attribute to the key you gave your Inbox. If you don’t include this input, the submission will be sent to the default Inbox connected to your site.
- Add form fields with name attributes to collect additional data from visitors.
Any CloudCannon form can use the
_gotcha field to help prevent untargeted spam. CloudCannon does not accept a submission if this field has a value. Hide it with CSS to prevent visitors from filling it out.
Receiving files through your forms#
You can also use CloudCannon Forms to receive file uploads from visitors to your site.
To setup file uploads on your form:
- Set your form’s
- Add an
inputelement to your form with the
typeattribute set to
Now when visitors to your site submit a file through your form, CloudCannon will save that file and then replace it with a link that you can use to access the file.
File submissions through CloudCannon have the following limitations:
- Each file must be smaller than 5Mb in size.
- At most 5 files can be submitted at a time.
- Each non-file field must be smaller than 10kb in size.
- At most 100 non-file fields can be submitted at a time.
- Build and test your form.
- Override the submit event on your form.
- Change the page to notify your viewers the message was sent.