Template comes with ready to use:
- Contact Form
All needed files are in /form directory.
Remember to includeon page.
To configure form just edit form/config.php and change e-mails to your own :
1 2 |
$to = "mail@example.com"; $from = "mail@example.com"; |
That’s it!
Contact Form
HTML Markup
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 |
<form action="./assets/form/send.php" method="post" class="ct-u-paddingBottom30 contactForm validateIt contactForm--type3" data-hide-form="false" data-email-subject="Contact Form" data-show-errors="true"> <div class="row"> <div class="col-sm-12"> <div class="successMessage alert alert-success ct-u-marginTop30" style="display: none"> <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> Thank You! </div> <div class="errorMessage alert alert-danger ct-u-marginTop30" style="display: none"> <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> Ups! An error occured. Please try again later. </div> </div> </div> <div class="row"> <div class="col-sm-12"> <div class="form-group"> <select class="ct-js-selectize"> <option value="">Enquiry</option> <option value="1">The Sydney Harbour</option> <option value="2">Casa Caracol</option> <option value="3">The Clayzy House</option> <option value="4">RE B&B</option> <option value="5">CamelBackpackers</option> <option value="6">Fauzi Azar Inn</option> </select> </div> </div> </div> <div class="row"> <div class="col-sm-12"> <div class="form-group"> <select class="ct-js-selectize"> <option value="">Enquiry</option> <option value="1">The Sydney Harbour</option> <option value="2">Casa Caracol</option> <option value="3">The Clayzy House</option> <option value="4">RE B&B</option> <option value="5">CamelBackpackers</option> <option value="6">Fauzi Azar Inn</option> </select> </div> </div> </div> <div class="row"> <div class="col-sm-12"> <div class="form-group"> <label for="email" class="sr-only">Your email</label> <input type="email" id="email" class="form-control input-lg" name="field[email]" placeholder="Your email" required/> </div> </div> </div> <div class="row"> <div class="col-sm-12"> <div class="form-group"> <label for="name" class="sr-only">Your name</label> <input type="text" id="name" class="form-control input-lg" name="field[name]" placeholder="Your name" required/> </div> </div> </div> <div class="row"> <div class="col-sm-12"> <div class="form-group"> <label for="subject" class="sr-only">Subject</label> <input type="text" id="subject" class="form-control input-lg" name="field[subject]" placeholder="Subject" required/> </div> </div> </div> <div class="row"> <div class="col-sm-12"> <div class="form-group"> <textarea class="form-control" rows="3" name="field[message]" placeholder="Your message" required></textarea> </div> </div> </div> <div class="row"> <div class="col-sm-12"> <div class="form-group"> <select required="" class="ct-js-selectize"> <option value="">How did you hear about us?</option> <option value="1">The Sydney Harbour</option> <option value="2">Casa Caracol</option> <option value="3">The Clayzy House</option> <option value="4">RE B&B</option> <option value="5">CamelBackpackers</option> <option value="6">Fauzi Azar Inn</option> </select> </div> </div> </div> <div class="row"> <div class="col-sm-12"> <div class="checkbox ct-u-marginTop10"> <input type="checkbox" id="checkbox1" name="field[subscribe]"> <label for="checkbox1">subscribe to our newsletter</label> </div> </div> </div> <div class="row"> <div class="col-sm-12"> <button type="submit" class="btn btn-primary ct-u-marginTop20">Send now<span><i class="icon-right-small"></i></span></button> </div> </div> </form> |
Options (can be changed in HTML) :
Mail Subject – just change value in :
Success Message – change successMessage div content
Error Message – change errorMessage div content