DEV Community

Cover image for CF7 File Uploads: Why the Attachment Never Arrives in Your Email
Rahul Sharma
Rahul Sharma

Posted on

CF7 File Uploads: Why the Attachment Never Arrives in Your Email

Two developers posted the same problem on the WordPress forums. Both had the CF7 file field set up correctly in the form. Both had [your-file] in the Mail tab. Neither received the file as an attachment in their email.

One developer found the fix in a video. Here is what the video showed that the CF7 documentation does not mention anywhere:

There is a third place you need to add the file tag — the File Attachments field at the bottom of the Mail tab. Most people never scroll down far enough to see it.

That is the entire fix. But understanding why CF7 works this way, what each of the three placements actually does, and how to handle file uploads that need to go somewhere beyond email is worth covering properly.

The Three Places the File Tag Goes (And What Each One Does)

CF7's file upload has three completely separate functions that require separate tag placements:

Placement 1: The Form Tab

[file your-file filetypes:pdf|doc|docx limit:2mb]
Enter fullscreen mode Exit fullscreen mode

This renders the file input element in the HTML form. Without this, users have no way to select a file. This is the only placement that most tutorials cover.

Placement 2: The Mail Tab Body

School/Organization Logo: [your-file]
Enter fullscreen mode Exit fullscreen mode

This inserts the filename (not the file itself) into the email body as text. It tells you what file was uploaded but does not attach it. This is where the confusion starts. Both developers in the thread had this placement and assumed it would attach the file. It does not. It just prints the filename as a string.

Placement 3: The Mail Tab File Attachments Field

[your-file]
Enter fullscreen mode Exit fullscreen mode

This is the field that actually attaches the file to the outgoing email. It is at the bottom of the Mail tab, below the Message Body field. It is easy to miss because it is small, unlabelled in some CF7 versions, and completely absent from the official documentation.

Without this third placement, the file is uploaded to your server (wp-content/uploads/wpcf7_uploads/) but never attached to the email. The email arrives with the filename mentioned in the body but no attachment.

Step by Step: Correct CF7 File Upload Configuration

Step 1: Form Tab

Use the File button in the CF7 form editor toolbar to insert the tag (do not type it manually — the UI generates a clean tag with the correct format):

[file file-upload filetypes:pdf|doc|docx|jpg|png limit:5mb]
Enter fullscreen mode Exit fullscreen mode

Common mistakes in the form tag:

  • filetypes:image/* with the wildcard — some servers reject this. Use explicit types: image/jpeg|image/png|image/gif
  • Setting limit too high — hosting providers often have a lower upload_max_filesize in php.ini than what you set in CF7. CF7's limit cannot exceed the server's PHP limit

Step 2: Mail Tab Body (Optional)

Add this where you want the filename to appear in the email body:

Uploaded file: [file-upload]
Enter fullscreen mode Exit fullscreen mode

This is optional. If you only want the attachment without mentioning it in the body, skip this placement.

Step 3: Mail Tab File Attachments Field (Required for Attachment)

Scroll to the bottom of the Mail tab. Find the field labelled File Attachments (it may be collapsed or hidden below the message body area). Add:

[file-upload]
Enter fullscreen mode Exit fullscreen mode

This is the step that actually causes the file to be sent as an email attachment. Without it, the file exists on your server but never reaches the recipient's inbox.

The Filetypes Wildcard Problem

The original poster used filetypes:audio/*|video/*|image/* with wildcards. This is a CF7-supported syntax but can cause issues on some server configurations where the MIME type detection does not resolve wildcards correctly.

The safer approach is explicit MIME types:

[file your-file filetypes:image/jpeg|image/png|image/gif|image/webp|audio/mpeg|video/mp4 limit:1mb]
Enter fullscreen mode Exit fullscreen mode

Or for common document uploads:

[file your-file filetypes:pdf|doc|docx|xls|xlsx|txt limit:5mb]
Enter fullscreen mode Exit fullscreen mode

CF7 accepts both MIME type strings and file extensions. File extensions are simpler to read and work reliably across server configurations.

Where Uploaded Files Actually Go

Files uploaded through CF7 go to wp-content/uploads/wpcf7_uploads/ temporarily. CF7 deletes them after the email is sent. They are not permanently stored on your server.

This is what the original poster saw in Flamingo: a number (the temporary file ID) rather than a clickable link. Flamingo records that a file was submitted but does not store the file itself. Once CF7 processes the form and sends the email, the file is gone from the server.

If you need permanent file storage (files accessible after the email is sent), you have two options:

Option 1: Use a plugin like "CF7 to Post" or "CF7 Storage" to save uploads permanently alongside the form submission record.

Option 2: Forward the file to external storage via API. Contact Form to API can send form submission data including file references to an external endpoint where the file can be stored in cloud storage (S3, Google Drive, Dropbox, etc.) as part of a webhook workflow.

Making Fields Optional

The second question in the thread: how to make certain fields optional.

In CF7, field tags with an asterisk are required:

[text* your-name]    <- required
[text your-company]  <- optional
Enter fullscreen mode Exit fullscreen mode

Remove the asterisk to make a field optional. For file uploads:

[file your-file filetypes:pdf limit:5mb]         <- optional upload
[file* your-file-required filetypes:pdf limit:5mb] <- required upload
Enter fullscreen mode Exit fullscreen mode

Optional file fields do not block form submission if left empty. Required fields with * trigger CF7's validation and prevent submission if no file is selected.

Quick Reference

Placement Location What it does
[file your-file ...] Form tab Renders the file input in the HTML form
[your-file] in body Mail tab body Inserts the filename as text in the email body
[your-file] in File Attachments Mail tab bottom Actually attaches the file to the outgoing email

All three are needed if you want the file to appear as an email attachment. The third one is the one nobody mentions and the one that solves the problem.

Top comments (0)