The File upload element is a form element that lets the user upload files.
Settings
Basic
Label
Sets the label of the element.
Description
Sets description text to display below or above the field.
Required
Sets the field to be required, i.e. the user must complete this field.
Styles
Label icon
Choose an icon to display in the label.
Enable enhanced uploader
Enables the enhanced file uploader which shows the upload progress in modern browsers, and lets users add or remove files.
Enhanced uploader style
Sets the style of the enhanced uploader, the choices are:
- Button
- Dropzone
Both options support dropping files but the dropzone has a larger area.
Button style
If Enhanced uploader style is set to Button, choose the style of the button.
Button size
If Enhanced uploader style is set to Button, choose the size of the button.
Button width
If Enhanced uploader style is set to Button, choose the width of the button.
Button custom width
If Button width is set to Custom…, enter a custom button width using any CSS value.
Button icon
If Enhanced uploader style is set to Button, choose the the button icon.
Button icon position
If Enhanced uploader style is set to Button, choose the the button icon position.
Dropzone icon
If Enhanced uploader style is set to Dropzone, choose the the dropzone icon.
Dropzone icon position
If Enhanced uploader style is set to Dropzone, choose the the dropzone icon position.
Upload list layout
Choose the layout of the files in the upload list.
Upload list size
Choose the size of each file in the upload list.
Field width
Sets the width of the field, choose one of the preset sizes or choose a custom width. The width only applies when the enhanced uploader option is disabled or not supported in the browser.
Field custom width
If Field width is set to Custom enter a custom width using any CSS value.
Custom CSS class
Add a custom CSS class to the field, or multiple classes separated by a space.
CSS styles
Add custom CSS styles to any part of this element by clicking Add a style, choose the selector that the style should apply to and enter the CSS into the box.
Labels
Sub label
Sets a small text label below the field.
Admin label
Sets the admin label which allows you to have different label text for the element when viewing entries and within notification emails than the label text shown in the form.
Tooltip text
Sets the tooltip text which is shown in a small popup when the user interacts with the tooltip trigger.
Tooltip trigger
Choose what the user will be interacting with to show the tooltip, currently the only choice for this element is Icon.
Tooltip event
Choose the event that will trigger the tooltip to show, the choices are Hover, Click, or Inherit which will inherit the setting from the parent Group, Page or Form setting.
Label position
Choose where to display the label relative to the field, the choices are Above, Left or Inherit which will inherit the setting from the parent Group, Page or Form setting.
Label width
If the Label position is set to Left enter a custom label width using any CSS value.
Logic
Enable conditional logic
Enable or disable the conditional logic for this element.
Logic rules
Add a logic rule to this element by clicking Add logic rule, then choose the element, operator and value that will trigger the rule.
Data
Minimum number of files
Enter the minimum number of uploaded files required, enter 0 to have no specific number of files required. One file will still be required if this field is Required.
Maximum number of files
Enter the maximum number of uploaded files allowed, enter 0 for no limit.
Allowed file extensions
Enter the file extension excluding the dots and separated by commas e.g. jpg, jpeg, png, gif
.
Maximum allowed file size
Enter the maximum allowed size of a file in MB. Note that some PHP configuration settings might need their limits increased to allow larger file uploads, see the relevant settings below. If in doubt contact your system administrator.
The total of all maximum allowed file sizes for all the upload fields in the form multiplied by the maximum allowed number of files should be less than the PHP setting post_max_size
. Note that when using the enhanced uploader each file is uploaded in a separate request so this limit can be much lower, however if the browser does not support the enhanced uploader or if JavaScript is disabled all files will be uploaded in a single request.
The maximum file size of a single file upload should not exceed the PHP setting upload_max_filesize
.
If you are attaching the file to the notification email, you should make sure that the PHP setting memory_limit
is about 8-10 times the maximum file size.
If you are not attaching the file to the email, you might not need to adjust the memory limit. If in doubt, upload a test file at your maximum limit and see if the form works correctly.
Save uploaded files to the server
If enabled, the uploaded files will be saved to the server.
Path to save uploaded files
The path to save the files inside the WordPress uploads directory. The following variables can be used in the path for dynamic replacement.
{form_id}
= the form ID{year}
= the current year{month}
= the current month{day}
= the current day
Show in email
If enabled, the submitted element data will be shown in the default notification email.
Save to database
If enabled, the submitted element data will be saved to the database and shown when viewing an entry.
Advanced
Unique ID
The unique element identifier is displayed here, you may need this for advanced usage.
Visibility
Sets the element to only be visible when viewing/editing entries (Admin only), or only visible to logged in or logged out users.
Translations
The text of any relevant settings can be translated here.