In Contact Form 7 (CF7) you need to use the Mail tab to configure the form to send an email every time your users submit a form. However, setting up mail correctly in CF7 can be confusing & difficult for beginners.
In this article, we show you how to set up mail in your Contact Form 7 forms correctly – we provide detailed advice on each field in the Mail tab.
You need to fill the following fields while configuring mail in the Contact Form 7 Mail tab:
Setting up Mail in CF7 forms
To setup Mail in Contact Form 7 follow these steps:
Mail Tab
Go to Contact >> Contact Forms. Open your CF7 form & click the Mail tab.
You can now add the necessary information in each field to properly configure sending your email from Contact Form 7.
Tip: The details on filling out each field of the Mail tab are described in the following sections.
1. To
Simply enter the email address where you want to receive an email each time the form is submitted.
Tip: You can also use the submitted form data in your CF7 emails.
2. From
This is a field that confuses many beginner Contact Form 7 users.
Tip: Some new CF7 users wrongly assume the From: field should be the email address of the person submitting the form.
The key point to understand is that Contact Form 7 uses the info in the Mail tab to send an email – just like a regular email you send from your computer.
To do that CF7 needs a suitable From: email address:
Because the Contact Form 7 email is being sent from your website, the email needs to be seen as coming from your website.
Tip: The easiest way to avoid most problems is to always use an email address that belongs to the same domain as your WordPress site in the From: field.
Refer to Use a suitable From: address for additional tips and more detailed guidance.
3. Subject
Enter the subject of the email in this field.
Here, the subject of the email will contain the data entered by the user in the your-subject field of the form.
In this case we’ve also included Your Blog Title to help clearly identify the email in your email inbox when it is received.
Tip: Refer to Using submitted form data in your CF7 emails for details on how to do this.
4. Additional Headers
This is another field that confuses many beginner Contact Form 7 users.
CF7 often uses technical terms that are not well understood by everyone. In this case Additional Headers is actually referring to the email headers that are sent in every email.
The additional headers you will use most commonly in CF7 are:
- Cc and Bcc – send the same email to multiple email addresses
- Reply-to – reply to the submitted email directly from your inbox
Here, the Reply-to field in the header of the email will contain the email address submitted by the user. Doing this allows you to reply to the submitted email directly from your email inbox.
Tip: Make sure that there is only one additional header per line.
Refer to Contact Form 7 Additional Headers for more tips on using the additional headers field.
5. Message Body
In this field you add the main body of your CF7 email. Here you will generally combine submitted form field data with text that explains the information coming from each form field.
The message body here contains the name, email address, subject and the message submitted by the users in the form.
Tip: Refer to Using the submitted form data in the email for detailed instructions on doing this.
Message Body Options
There are two checkboxes below the Message Body field.
Exclude lines with blank mail-tags from output
If you check Exclude lines with blank mail-tags from output, the lines containing the mail-tags where the users have not entered values will be removed from the output.
Use HTML content type
By default, the message is sent in plain text format. However, you can check the Use HTML content type checkbox to provide HTML content.
6. File Attachments
There are several methods of attaching files in a CF7 email:
- Attach files uploaded by users through the form
- Attach files currently present inside the wp-content folder on your server
- Attaching the files uploaded in the form as well as the local files
Attaching files uploaded by users through the form
To attach a file uploaded in the form, you must first have a form field with a form tag that accepts the file input type. To add a file input field, add the following code in the form.
[file your-file filetypes:pdf|txt limit:2mb]
Now, add the name of the field as a mail-tag in the File Attachments field.
If you want to attach multiple files from the form, simply line them up in the File Attachments field as shown below:
Tip: You need Matching Mail Tags & Form Tags for each file attachment.
Attaching files present on the server
To attach files already available on your WordPress site:
1. Upload the file inside the wp-content folder. You can create folders inside wp-content to further group the files in the server.
Tip: For security reasons, you cannot specify files outside the wp-content folder as an email attachment.
2. Provide the path to the file in the File Attachments field.
Here, the signature.png image inside the folder wp-content/uploads/ is sent as an attachment in the email.
Tip: To provide multiple file attachments, enter one file path per line.
Attaching the files uploaded in the form as well as the local files
To attach the uploaded files as well as the local files, enter the mail-tags of the uploaded files in a single line, followed by one local file path per line in the File Attachments field.
Tip: You can use the WordPress Media Library to upload files to the wp-content/uploads folder.
File Attachment Options
Contact Form 7 provides you the following options while adding a file input field in your form:
ID & Class
- ID – add a unique HTML ID to this input tag to add your custom CSS styling to this form field only.
[file your-file id:input-file-field]
- Class – add the specified HTML class to add your custom CSS styling to multiple form fields.
[file your-file class:form-control]
Tip: To add more than one class, add multiple class options. For example,
[file your-file class:form-control class:text-center]
Filetypes
- Filetypes – specify the allowed file formats.
[file your-file filetypes:png]– the form only accepts the files with png extension
Tip: Separate more than one file types with a pipe (|) character. For example,
[file your-file filetypes:png|jpg|jpeg]
Limit
- Limit – control the size limit for the files to be uploaded.
[file your-file limit:2mb]– users cannot upload files greater than 2 MB
Tip: You can provide the limit in kb or mb. If you do not specify a unit, the limit is in bytes.
7. Setting up Mail (2)
Mail (2) is commonly used as an auto-responder. Once the form is submitted and an email notification is sent to you, you can use Mail (2) to send a confirmation email to the user as well.
But you can use Mail (2) whenever you want to send a second email after your CF7 form is submitted.
Tip: The Mail (2) email is only sent after the initial mail is successfully sent.
To configure the Mail (2), follow the steps mentioned below:
1. Check the Use Mail (2) checkbox.
2. To send an auto-responder email to the user, enter the mail-tag of the email in the To field.
Here the To: field will contain the form users email address entered in the your-email field of the form.
3. Provide details in the From, Subject, Additional Headers, Message Body, and File Attachments fields.
4. Click Save.
Further reading
- Solving email issues in Contact Form 7
- Use a suitable From: address
- Matching Mail Tags with Form Tags in Contact Form 7
Contact Form 7 Troubleshooter
If you would like some help from our support staff & are willing to help us by providing information on your use of Contact Form 7 & CF7 Skins, you should complete the following form:
This form is made with CF7 Skins + CF7 Skins Pro + CF7 Skins Ready + CF7 Skins Multi + CF7 Skins Logic
Have questions or need help?
If you are using the free version of CF7 Skins, you can get help via the CF7 Skins community and also the Contact Form 7 Support forum.
If you are using any of our Add-ons, we provide Premium Email Support to help with your questions and problems.
