Filemail can easily be integrated with Contact Form 7 and this article will show you how in a few steps.


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="xxxx" data-target="#transfer-url"></div>

[hidden transfer-url id:transfer-url]

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

You can find your code snippet here https://www.filemail.com/settings#integration under "Integrated uploader in a form" section.

Required attributes

Name

Example value

Description

data-filemail-widget

form

Required with value "form"

data-companyid

your accounts specific value (usualy 9-13 characters or numbers)

Find this on your settings page under Integrations. Look for "companyid".

data-target

#transfer-url

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

Description

data-incoming-page-name

custom1

If you have created custom incoming pages in Filemail, you can specify which one of them to use here.

data-height

100

Specify the height of this component

data-color

#ba03fc

Set a custom color on the component

data-to

someone@example.com

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).

Results:

Your form should now look something like this:

Now try it out for yourself, you will see that after the upload finishes, it will look like this:

And 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:

Contact us on support@filemail.com or click the chat badge in the lower right corner if you need any help!


Links:
Contact Form 7 WordPress plugin

Contact Form 7 Website

Did this answer your question?