Getting Started - How to use Multiline Files Upload For Contact Form 7 Pro?

Multiline files upload for contact form 7 Pro

article image
Divyesh Kakrecha

How to install it:

Installation via Wordpress plugin installer

  1. Extract the plugin package on your machine that you downloaded from CodeCanyon.
  2. Hover over the plugins menu item on your left sidebar in your WordPress admin area and select "Add New".
  3. In the new page click on the "Upload" menu item on top of the page.
  4. Choose the file that you extracted from the downloaded package and click "Install Now".
  5. The plugin is now installed, click on the "Activate Plugin" button.
  6. Now, you can go to contact form 7 and configure the plugin.

Installation via FTP

  1. Extract the plugin package on your machine that you downloaded from CodeCanyon.
  2. Find the file in the extracted content and extract it also.
  3. Open your favourite FTP application and connect and navigate to your "/wp-content/plugins/" folder
  4. Copy over the folder extracted from file
  5. Navigate to your plugins page on your WordPress admin area and click the "Activate" button
  6. Now, you can go to contact form 7 and configure the plugin.

How to Use Multiline files upload for contact form 7:

1) Go To Contact form 7 -> Edit your form -> Click multilinefile to open one dialog box that contain diffrent types of options:

  • File size limit (bytes) - It allows you to add your custom file size in bytes format.

  • Allowed file types - It allows you to define allowed file formats, just add your filetypes code. Seprate them with '|'(pipe) sign when you set multiple file types.

2) Fill dialog box options as per your requirement then click insert Tag button to generate one shortcode. Now insert this shortcode where you want to display Add File button.

3) Once the shortcode is inserted you can see Add File button in your contact form, refer screenshot below.

4) Now go to the mail panel and copy your multilinefile uploading tag and paste it into the file attachment box and click on save button. Refer screenshot below.

5) Now click on Add File button and select your document, audio, video, or any type of file. By default, the uploaded files list will show up before Add File button. see the below screenshot.

6) User can delete any selected files by clicking the respective X icon beside the filename.

7) Once all files are selected, click send to submit the form. It's very easy and quick.

8) if you have configured to receive files, This plugin will send your uploaded files as a single ZIP file.

Advanced options

1. How to change the location of the file list?

- If you want to show the files list below send button or anywhere in the form, so first add your custom-container-id name in the shortcode generator dialog box then use your custom-container-id name whenever you want to display the file list, just add the HTML block (span or div or p tag) with id name.

- In the screenshot below, I have added a custom-container-id name id tag below the 2 file uploading button. so, my uploaded files list is shown below the uploading file buttons. See in screenshot below.

2. how to set min/max limit for the number of files

If you want to set Minimum and Maximum file uploading restrictions on your contact form, so you can set min and max file limits in the shortcode generator form. See in screenshot below.

3. How to change add file button name?

If you want to change and set the custom file uploading button name, so you can easily set the custom name in the button label text field. See in screenshot below.

4. How to change the style of Add File button and file list?

If you want to change our plugin button or others file listing styles and apply your custom style please add your custom CSS to your theme's CSS file. Adding style in the child theme is recommended.

- Here I have shown a style guide for buttons and listing etc. so, you can easily update the style of the elements.

1. Buttton style : Set automatically the theme button style but you can change using following class name --> .button, .button-primary, .qbutton { background-color: #004834; }

2. Selected file name style: p.mfcf7_zl_delete_file_tag { color: red; }

5. Recieve link to uploaded files than files as attachments itself - Useful when you have big files uploaded by visitors

If you want to receive a link to the attachment instead of a zip file as an attachment in the email, enable this option. This is useful when your users are uploading larger files.

Support Information:

Normally we will answer your questions within 24 hours. find more information in the documentation delivered with your product.

If you still have questions or concerns about the product:

We will be happy to provide you with a detailed answer as quickly as we can.