Setup

HTML

Use this Basic Structure to construct your Form:

• Always enclose AJAX Forms inside the .form-widget Container
• Include a Blank DIV with .form-result Class: <div class="form-result"></div> to receive the Success/Error Message from PHP
• Use a Hidden Form Input with the name prefix to Prefix your Form Names: <input type="hidden" name="prefix" value="template-contactform-">
• Always include the botcheck Field as in the Form code below

<div class="form-widget">
	<div class="form-result"></div>

	<form class="row" id="template-contactform" action="include/form.php" method="post">

		<div class="form-process"></div>

		<div class="col-md-6 form-group">
			<label for="template-contactform-name">Name <small>*</small></label>
			<input type="text" id="template-contactform-name" name="template-contactform-name" value="" class="form-control required" />
		</div>

		<div class="col-md-6 form-group">
			<label for="template-contactform-email">Email <small>*</small></label>
			<input type="email" id="template-contactform-email" name="template-contactform-email" value="" class="required email form-control" />
		</div>

		<div class="w-100"></div>

		<div class="col-12 form-group">
			<label for="template-contactform-message">Message <small>*</small></label>
			<textarea class="required form-control" id="template-contactform-message" name="template-contactform-message" rows="6" cols="30"></textarea>
		</div>

		<div class="col-12 d-none">
			<input type="text" id="template-contactform-botcheck" name="template-contactform-botcheck" value="" class="form-control" />
		</div>

		<div class="col-12">
			<button class="button button-3d nomargin" type="submit" id="template-contactform-submit" name="template-contactform-submit" value="submit">Send Message</button>
		</div>

		<!-- Form Settings -->

		<input type="hidden" name="prefix" value="template-contactform-">
		<input type="hidden" name="subject" value="Message from Contact Form">

	</form>
</div>

PHP

Open the include/form.php File to make the following changes:

Receiving Form Responses

Add your Email Address to receive Email Responses by using the following code below:

$toemails[] = array(
	'email' => '[email protected]', // Your Email Address
	'name' => 'Your Name' // Your Name
);

How to Setup Multiple Email Addresses?

For each New Email Address to which you want the Form Response to be delivered simply duplicate the Above Code with New Email/Name Details on a new Line.

Sender/Company Email to send Emails

Add a Sender Email by using the following code below:

$fromemail = array(
	'email' => '[email protected]', // Company's Email Address (preferably currently used Domain Name)
	'name' => 'Company Name' // Company Name
);

Note: Some Web Hosting services enforce you to use the same Domain Name in your Email Address as your Hosting Account, to prevent SPAM. So make sure that @website.com above is same as your Domain’s Hosting Account.

Using SMTP

Some Hosting Servers disable the use of PHP mail() Function to prevent SPAM. So you can use the SMTP Functionality to Send Emails. Simply add the following code after the $mail = new PHPMailer(); Line of Code:

$mail->IsSMTP();
$mail->Host = "mail.yourdomain.com";
$mail->SMTPDebug = 0;
$mail->SMTPAuth = true;
$mail->SMTPSecure = "ssl";
$mail->Port = 26;
$mail->Username = "[email protected]";
$mail->Password = "yourpassword";

Gmail SMTP has been discontinued

We highly recommend using MailGun or Sendgrid as Email API alternatives.

Adding a Reply To: Address

Adding a Reply To: address in your Form Response is super easy and dynamic, using the Email Field from your Form. Simply add the following code at the bottom of your Form:

<input type="hidden" name="replyto" value="template-contactform-email">

reCaptcha Settings

To setup reCaptcha Form Protection, you will need to obtain a Set of Site/Secret Keys from the Google reCaptcha Website. Then follow the Steps below to Setup the Keys for your Form:

1. Add the following code to your Form and set up the Site Key:
   Copy

   <script src="https://www.google.com/recaptcha/api.js" async defer></script>
   <div class="g-recaptcha" data-sitekey="your-recaptcha-site-key-here"></div>

2. Find the following code in the include/form.php File and add your Secret Key:
   Copy

   $recaptcha_secret = ''; // Your reCaptcha Secret