Adding reCapture v2
Add this script into your header:
<script src='https://www.google.com/recaptcha/api.js' async defer ></script>
Place this div where you want the reCapture to appear:
<div class="g-recaptcha" data-sitekey=sectet_key></div>
In form action file
if (isset($_POST['g-recaptcha-response']) && ! empty($_POST['g-recaptcha-response'])) {
$secret = 'secret_key';
$verifyResponse = file_get_contents('https://www.google.com/recaptcha/api/siteverify?secret='.$secret.'&response='.$_POST['g-recaptcha-response']);
$responseData = json_decode($verifyResponse);
$succMsg = 'Your contact request have submitted successfully.';
} else {
$errMsg = 'Robot verification failed, please try again.';
}
}
You can use these key to test in you local build:
Site key: 6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI
Secret key: 6LeIxAcTAAAAAGG-vFI1TnRWxMZNFuojJ4WifJWe
Submit button only shows when reCApture is checked:
- Give
div class="g-recaptcha”
data-callback attributedata-callback="recaptchaCallback"
- Give submit button id
id=“submitBtn”
and disabled attribute - Create script with function
<script type="text/javascript">
function recaptchaCallback() {
$(\'#submitBtn\').removeAttr(\'disabled\');
};
</script>