If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)

captcha

JS Animated. How to make a contact form field not required

In templates based on forms.js script

This tutorial will show you how to make your contact form fields not required.

All the fields need to be filled by default. To fix that, find the index page with your contact form and open it in any php/text editor. Locate the following scripts related to your fields:

<label class="email">

Make it look like:

<label class="email notRequired">

Save the changes, and refresh your browser window. Now the ‘e-mail’ field is not required.

This is the end of the tutorial, let us know if you have any questions.

Feel free to check the detailed video tutorial below:

How to make a contact form field not required

In templates based on TMForm.js script

js_animated_tmform_contact_form_field_not_required_making_1

  1. Open the .html file that represents your “Contacts” page in Dreamweaver or any other HTML editor.

  2. Switch to the “Split” mode to divide your screen into “Code”/”Design” views.

    js_animated_tmform_contact_form_field_not_required_making_2

  3. In the “Design” view, select the field which you need to make not required (by default all of them are required). For example, the “Name” field.

  4. That will highlight the code in the “Code” view:

    <label class="name">
       <input type="text" placeholder="Name:" data-constraints="@Required @JustLetters" />
       <span class="empty-message">*This field is required.</span>
       <span class="error-message">*This is not a valid name.</span>
    </label>
    
  5. Delete @Required from the data-constraints attribute values list. So the result looks as follows:

    <label class="name">
       <input type="text" placeholder="Name:" data-constraints="@JustLetters" />
       <span class="empty-message">*This field is required.</span>
       <span class="error-message">*This is not a valid name.</span>
    </label>
    
  6. Save your changes to the file and upload your template to FTP to check how the field is now working.

    js_animated_tmform_contact_form_field_not_required_making_3

  7. The same goes for all other fields. To make a field not required, you will just need to delete @Required from the data-constraints attribute values list of the corresponding <input> tag.

Feel free to check the detailed video tutorial below:

JS Animated. How to make a contact form field not required (based on TMForm)

JS Animated. How to make a contact form field not required, 5.0 out of 5 based on 1 rating