As of version 2.0, USP Pro supports unlimited File Upload fields in any form. This extensive tutorial explains the various types of File(s) fields and how to implement them in your own forms.

Video Tutorial

Types of Files fields

Currently there are four types of File(s) fields that may be used for file uploads:

  • Primary Files Field – via the [usp_files] shortcode
  • Custom Files Field – via adding field#input_file to any custom-field definition
  • Custom Prefix Files Field – same as Custom Files but with a custom prefix defined in Advanced settings
  • Custom Custom Files Field – same as Custom Files but with a custom field defined in Advanced settings

For the most part, these four types of File(s) fields can be customized and combined as desired. Let’s go through each type of field and see how they work.

Primary Files Field

Primary form fields include things like Post Title, Post Content, Post Author, and so forth. With USP Pro, each Primary Field has its own Quicktag. This is true for the Primary Files Field as well, which has its own shortcode, [usp_files], and its own Quicktag, USP:Files. Thus, to add a files field to the form, the easiest way to get there is to click the USP:Files quicktag button and specify your attributes as desired.

You can add one File(s) field per form using the [usp_files] shortcode. To customize its attributes, such as multiple files, min/max files, and so forth, refer to the USP Files Shortcode Reference. Here is a quick example:

[usp_files multiple="true" required="true" files_max="3"]

Here we are adding a File(s) field that accepts multiple files, is required, and has a maximum file limit of three files.

NOTE: Use only one [usp_files] shortcode per form. For additional File(s), use any combination of the following fields.

Custom Files Field

The second type of File(s) field is created via Custom Field. To make any custom field a File(s) field, first define the field as such by including field#input_file in the custom-field definition. For example:

field#input_file|method#select|multiple#true|data-required#true|files_min#1|files_max#3

Here we are defining a custom File(s) field that is displayed as a select/dropdown menu, accepts multiple files, is required, allows a minimum of one file, and allows a maximum of three files. After this field is defined, we can add it to the form by copying/pasting its shortcode, which will look something like this:

[usp_custom_field form="3510" id="3"]

Here, form is the form ID, and id is the custom field ID. So they will vary depending on your form and whichever custom field you are working with. You can use any valid attributes to define as many Custom Files fields as required.

Custom Prefix Files Field

Custom Prefix Fields work the same way as Custom Fields, with the exception that you can specify your own name prefix. So instead of using the default prefix, usp-custom-, you can define a prefix to be like, whatever-prefix-. You can learn more about custom prefixes here and here. Once you understand how they work, consider the following example:

field#input_file|name#myprefix_myfieldname|for#myprefix_myfieldname|method#select|multiple#true|data-required#true|files_min#1|files_max#3

Here we are defining a custom File(s) field that:

  • Uses a custom prefix of myprefix_ for the “name” and “for” attributes
  • Uses a field name of myfieldname for the “name” and “for” attributes
  • Displays as a select/dropdown menu
  • Accepts multiple files
  • Is a required field
  • Allows a minimum of one file
  • Allows a maximum of three files

To reiterate, the only real difference between the Custom Prefix Field and a regular Custom Field is the use of the custom prefix. So if you are working with a custom prefix and need a File(s) field, this is the way to go. Further, you can use any valid attributes (see below) to define and customize any number of Custom Prefix Files Fields.

Custom Custom Files Field

Last but not least, it is possible to add Custom Custom Files Fields to any USP Pro Form. Custom Custom Fields work the same way as Custom Fields, with the exception that their names are defined in the Advanced settings ▸ Custom Custom Fields. You can learn more about them in these tutorials:

Here is an example:

field#input_file|name#my_custom_custom_field|for#my_custom_custom_field|method#select|multiple#true|files_min#1|files_max#3|types#jpg,png

Notice the similarity between Custom Fields and Custom Prefix Fields. The only difference here is that the field name is defined in the Custom Custom Fields setting. Here we are using a custom-custom name of my_custom_custom_field, which also is used for the for attribute (so the field and label will match up).

So, as with Custom Fields and Custom Prefix Fields, we can define and use as many Custom Custom Fields as desired to any USP Pro Form. We can mix and match, add multiple fields, and customize fields using any available attribute (see next section).

Shortcode Attributes

As mentioned, the various files shortcodes can be customized by adding attributes like class and label. Here are reference guides that describe all of the available attributes, enabling you to customize your file fields however is necessary.

Summary

USP Pro provides four types of File(s) uploads fields. With the exception of [usp_files], File(s) fields can be combined, duplicated, and customized as desired for any USP Form.

The easiest way to add a File(s) field is to click the USP:Files Quicktag, which will add the [usp_files] shortcode to the form. You can customize the field via shortcode attributes. For advanced configuration, you can use any combination of Custom Fields, including Custom Files, Custom Prefix, and Custom Custom fields.

Bottom Line: USP Pro enables unlimited customized File(s) fields in any USP Form.

Resources