Email configuration

Update video:

Please make sure you have mail.php file. Then follow the instruction to make it work in our template.

1. Go to contact.html file.

2. In line 146, you will see the form look like below:

<form>
  <div class="form-group inline">
    <input type="text" class="form-control" id="inputName" placeholder="name">
  </div>
  <div class="form-group inline">
    <input type="email" class="form-control" id="inputEmail" placeholder="email address">
  </div>
  <div class="form-group">
    <textarea class="form-control" rows="3" id="inputMessage" placeholder="message"></textarea>
  </div>
  <div class="voffset20"></div>
  <button type="submit" class="btn btn-arrow">Send message</button>
</form>

Then change it to below:

<form action="mail.php" method="post" id="contactform" class="contact-form" novalidate="novalidate">
  <div class="form-group inline">
    <input type="text" class="form-control text name required" name="name" id="name" placeholder="name">
  </div>
  <div class="form-group inline">
    <input type="email" class="form-control text email required" name="email" id="email" placeholder="email address">
  </div>
  <div class="form-group">
    <textarea class="form-control text area required" rows="3" name="message" id="message" placeholder="message"></textarea>
  </div>
  <div class="voffset20"></div>
    <div class="formSent"><p><strong>Your Message Has Been Sent!</strong> Thank you for contacting us.</p></div>
  <button type="submit" class="btn btn-arrow">Enviar mensaje</button>
</form>

3. Add the style below in main.css file.

.formSent {
    margin: 10px;
    text-align: center;
    padding: 0 0px;
    color: #cbc8c8;
    display: none;
}

4. Open main.js file and add the validation script above INTRO SLIDER, check screenshot if you don't understanding it clearly:

/*Validation*/
  $("#contactform").validate({
    submitHandler: function(form) {
      $(form).ajaxSubmit();
      $('.formSent').show();
      $(form).find('input[type=text]').val('');
      $(form).find('input[type=email]').val('');
      $(form).find('textarea').val('');
    }
  });

5. Please download form validate script file in here: Google Drive. Then add this script in folder: scripts/vendor/. The last step is add it in your contact.html file, check screenshot if you don't understanding it clearly:

<script src="scripts/vendor/jquery.form.js"></script>
<script src="scripts/vendor/jquery.validate.js"></script>