Contact Form File Upload Field

Add a file upload field to the contact form.

Wireframe

File Upload Form

Preparation Checklist

Before you start this tweak, it's a good idea to run through our Preparation Checklist below:

Read through the Introduction to Neto by Maropost Document to get a better sense of how the Control Panel, Database and Front End store interact.
Learn our recommended Simple Workflow. This makes the implementation process as easy as possible.
Create a new Staging Theme for this tweak. This allows you to preview any changes before they are visible to live customers.

Coding Instructions

Step 1: Edit the contact form

In the control panel, navigate to Webstore > Form and select the "Contact Us" form.

Note: If you can't see the "form" link in your control panel, you'll need to enable the content type menu link. Navigate to Setup & tools > All Settings & Tools > Content Types Manager > form, and tick the Show in control panel menu box.

Step 2: Add code to your HTML form

On the Contact Us form, scroll down to the "Page Content" section and click the Form tab.

Click the "Source Code" button and paste the following parameter into the opening form tag enctype="multipart/form-data". Eg. <form action="[%URL nohost:'1' type:'page' id:'[@content_id@]'%][%END URL%]" enctype="multipart/form-data" method="post"><input name="inp-submit" type="hidden" value="y" />.

Paste the below code where you'd like your file upload field to appear:

<div class="form-group"><label>File Upload</label>
    <input class="form-control" name="inp-file" size="40" type="file" value="" />
</div>

Step 3: Update contact form settings

Scroll down to the "Module settings" section, and enter the following info:

Form upload field: file
Form upload type: Any File

Final Result