Help Center
    Help Center
  1. Creating your site
  2. Advanced features
  3. CMS
  4. Connecting user input elements to the CMS
    5. CMS: Uploading Multiple Documents with the Upload Button

CMS: Uploading Multiple Documents with the Upload Button

6 min read
Let your site visitors upload multiple documents at once by adding an Upload Button to your page.
For example, if you run a recruitment website, you can accept multiple documents from a candidate - including a resume, references, and work samples.
Using the Multi-Document field type in your collection, you can set up your website to accept and upload multiple files at once.
If you already have a page with an Upload Button in place, you can add a Multi-Document field to the collection and adjust the settings of your Upload Button.

Step 1 | Add an Upload Button and a collection

You can add an Upload Button and a collection at the same time. Setting up the dataset in this step makes it easier to keep track of the collection. This collection stores the documents your visitors upload.
New datasets experience:
In Wix Studio, we've moved datasets to the Inspector panel on the right to make them easier for you to use. Learn more about the new datasets experience in Wix Studio. 

To add an Upload Button and a dataset:

  1. Go to the Add panel:
    • Wix Editor: Click Add on the left side of the Editor.
    • Editor X: Click Add Elements at the top of Editor X.
  2. Click Input.
  3. Click Upload Buttons.
  4. Select a button and drag it onto the page.
  5. Select the Upload Button, then click the Connect to Data icon  (or in Editor X).
  1. Click Create Dataset.
Note:
If you don't see Create Dataset, click the Connect a dataset drop-down and select Create a New Dataset.
  1. Connect the dataset to a new or existing collection:
Important:
Make sure you use the Multi-Document field type at least once in your collection.

Step 2 | Set up the Upload Button

Setting up the Upload Button correctly is the key to allowing visitors to upload multiple documents.

To set up the Upload Button:

  1. Click the Upload Button in your Editor, then click Settings.
  2. Click the Supported file type drop-down and select Document.
  3. Drag the Max number of files slider to set the maximum number of files.
  1. Select the Required checkbox to make this a required field when a visitor is uploading files.
  2. (Recommended) Enter the title that appears at the top of the Upload Button under Field title.
  3. Enter the text that appears on your Upload Button in the Button text field.
  4. Select an option under Text below button:
    • Show file info only: Display the visitor's selected file name after the file is selected.
    • Show custom text: Enter text in the Custom text field that you want to show below the button. Once the visitor uploads their file, the file name displays below the button instead. Tip: Add helpful info such as the correct file size (e.g. "Max file size is 25MB"). 
Tip:
Click View Uploaded Files to go to your media manager where you can view the files visitors upload to your site. 

Step 3 | Add a Submit button

The Submit button is what your site visitors click on to upload their selected documents to your site. It's good practice to add the optional 'success' and 'failure' messages. You can place these on top of each other on your page, as only one is ever displayed to your site visitor.

To add a Submit button:

  1. Go to the Add panel:
    • Wix Editor: Click Add on the left side of the Editor.
    • Editor X: Click Add Elements at the top of Editor X.
  2. Click Button.
  3. Select a button and drag it onto the page.
  4. Click Change Text & Icon and enter Submit under What does it say?. 
  5. Click the Connect to Data icon  (or in Editor X).
  6. Make sure that the correct dataset is selected under Connect a dataset (by default, it should be connected to the dataset you added in Step 1).
  7. Click the Click action connects to drop-down and select Submit.
  1. (Optional) Add a success message that appears when visitors finish uploading their documents:
    1. Click + Add success message. 
    2. Select the success message in your Editor and edit the message. 
    3. Click and drag the success message to the location where you want it to appear. 
  2. (Optional) Add a failure message that appears if the document fails to upload:
    1. Select the submit button and click the Connect to Data icon  (or in Editor X).
    2. Click + Add failure message. 
    3. Select the failure message in your Editor and edit the message. 
    4. Click and drag the failure message to the location where you want it to appear. 
  3. Choose what happens after visitors successfully upload their documents:
    1. Select the submit button and click the Connect to Data icon  (or in Editor X).
    2. Click the When successful, navigate to drop-down and select an option: 
      • Stay on this page: The visitor stays on the page after a successful upload. 
      • A link...: The visitor navigates to a page. Click Choose under Choose a link and choose what you want to link to. Learn more about linking buttons. 

Did this help?

|

In This Article

  • Step 1 | Add an Upload Button and a collection
  • Step 2 | Set up the Upload Button
  • Step 3 | Add a Submit button

Related Content

CMS: Setting Up an Existing Upload Button to Accept Multiple Documents
CMS: Adding and Setting Up an Upload Button
CMS: About User Input Elements

Hire a Professional

Get matched with a Wix Partner who can help you reach your site goals.
Get Matched