Magento 2 - Add google captcha on contact form

Question

I want to add google captcha on contact us page.

copied

vendor/magento/module-contact/view/frontend/templates/form.phtml

to

app/design/frontend/Vendor/MyTheme/Magento_Contact/templates/form.phtml

is there any simple widget to call google captcha on form.phtml?

• Sohel Rana: What is your magento version?
• Magedev2301: I am using 2.2.5
• Ghulam.M: mageknowledge.com/validate-google-captcha-via-javascript
• Magedev2301: @Ghulam.M thanks for the link. I think that would work. Please add this in answer so that I can accept it after trying.

Answer 1

Suppose You have Form Similar to the code below

 <form id="myformId" class="col s12" action=""
 method="post"
 novalidate>
 <input placeholder="Name" id="mpfaqs-form-fieldset-input" type="text" name="username">
 <input placeholder="Email" id="mpfaqs-form-fieldset-input" type="text" name="useremail">
 <input placeholder="What is your question" id="mpfaqs-form-fieldset-input-question"
 type="text" name="userquestion">
 <div class="g-recaptcha" data-sitekey="YOURSITEKEYxxxxx"></div>
 <input class="form-submit" type="Submit" name="" value="Submit a question">
</form>
<script src='https://www.google.com/recaptcha/api.js'></script>
<script src='https://www.google.com/recaptcha/api.js?hl=es'></script>

To Validate above Form through javascript we will use the below code you can place it in the same file or create an external file for it and place the code

 <script>
 requirejs([
 'jquery'
 ], function($) {
 $(document).on('submit', '#myformId', function(){
 var isSubmit = jQuery(this).valid() && grecaptcha.getResponse() != '';
 if (!isSubmit) {
 alert("Please fill captcha");
 }
 return isSubmit;
 });
 })
</script>

• Magedev2301: Thanks for the answer. +1 and accepted :)
• Kowsigan Atsayam: Excellent and working very fine. +1
• Kowsigan Atsayam: can you tell how to have invisible captcha for newsletter in magento 2?

Answer 2

Magento has a default option for google captcha in contact us page.

Stores -> Configuration -> Customers -> Customer Configuration -> CAPTCHA -> Choose Contact Us under Forms

Refer the screenshot below

• Magedev2301: is that google captcha?
• Arunprabakaran M: Yes, it is. Magento has default option. Magento 2.3 version has google recaptcha
• Magedev2301: yes I have tried, but I don't think this is google captcha :) screencast.com/t/5nKBGA8d
• Magedev2301: Thanks for the answer. +1 :)