Web Form Integration

If you have a custom form already on your own website, and want to enahnce it with large file upload ability - then use our integrated uploader designed for custom forms.

<div data-filemail-widget="form" data-companyid="{AccountID}" data-target="#transfer-url"></div><script type="text/javascript" src="https://www.filemail.com/widgets/embed/form"></script>

While this integration can be used in many different scenarios, we will use the popular Wordpress plugin Contracts Form 7 in the following example.

Contact Form 7 + Filemail

You start by creating a new custom Contact form and set it up with all the fields you need.

At the place in the form where you want your file upload to be, you will add a small code snippet like this:

<div data-filemail-widget="form" data-companyid="{AccountID}" data-target="#transfer-url"></div>

[hidden transfer-url id:transfer-url]

<script type="text/javascript" src="https://www.filemail.com/widgets/embed/form"></script>

Required attributes

Name	Example value
data-filemail-widget	Required with value "form"
data-companyid	Your companies account id. Found in Settings - My Company and on top you will see "Account ID".
data-target	This is the selector of an HTML input element (which is part of your custom form) where you want us to insert the link to uploaded files. It's most convenient to use the input's id attribute - in that case the selector is prefixed with # sign

Optional attributes:

Name	Example value
data-incoming-page-name	Portal page ID. Found in Portal Administration - Edit Portal - Leave empty to use default.
data-height	Specify the height of this component in pixels
data-color	Set a custom color on the component
data-to	Specify the to e-mail address if you don't want it to be the account default e-mail. It will appear in the Filemail inbox of this user(s) (multiple recipients are separated with comma).

After the user has selected files using the embedded file browser from Filemail, the files are being transferred and when finished, the URL will have been inserted into your hidden field in the contact form. Now user can post the form with the link to files included. That link can be then injected it into the Contact Form 7 email (the one which you receive when people submit the form) like this: