reCapatcha shows on preview but not visible on final form

Hey there, @webmasterpro ??

That’s odd. Does deactivating your plugins help? We have a hunch there could be some conflict, or possibly a third-party code hiding reCaptcha. Would you mind sending us a link to your form to help us investigate?

Thanks! ??

Sure, I am testing HappyForms on a site I made for a group of churches, to replace a discontinued form no longer offered by WP. The link is: https://christiansciencect.org/contact-us-webmaster3-2/

Feel free to play with it- any form submission just sends mail to me.

I can’t deactivate plugins because the site is live and doing so would break a lot of things. Besides, the reCaptcha does appear on the preview, so I can’t figure how it could be blocked by a plugin.

I noticed that the source code for the preview (where the reCaptcha is visible) seems to be identical to the source code for the published form except for a few extra paragraph tags and the parameter “disabled” in the submit button. Here are some code excerpts…

SOURCE CODE FOR PREVIEW:

<span class="label">Message</span><br />
					</label></p>
<div class="happyforms-part__el">
<p>			<textarea id="happyforms-2121_multi_line_text_4" name="2121_multi_line_text_4" rows="5" placeholder="" required aria-required="true" ></textarea></p>
<p>						<span class="happyforms-part__description"></span></p></div>
</p></div>
</div>
<div class="happyforms-form__part happyforms-part happyforms-part--recaptcha" data-sitekey="6LdusIAUAAAAACiwcJkzvlr4dCS5xtVzexfjwNqi" data-happyforms-type="recaptcha">
<div class="happyforms-part-wrap" id="happyforms-2121-recaptcha">
		</div>
</p></div>
<div class="happyforms-form__part happyforms-part happyforms-part--submit">
    <input type="submit" class="happyforms-submit happyforms-button--submit" value="Submit Form" >
</div>
</p></div>
</p></form>
</div>

SOURCE CODE FOR PUBLISHED FORM:

<span class="label">Message</span>
							<span class="happyforms-optional">(optional)</span>
			</label>
			
		<div class="happyforms-part__el">
			
			<textarea id="happyforms-2121_multi_line_text_4" name="2121_multi_line_text_4" rows="5" placeholder="" required aria-required="true" ></textarea>
			
			
					<span class="happyforms-part__tooltip happyforms-tooltip"  style="display: none">
			<span class="happyforms-tooltip__trigger"></span>
			<span class="happyforms-part__description"></span>
		</span>
				<span class="happyforms-part__description"></span>
			
					</div>
	</div>
</div>				<div class="happyforms-form__part happyforms-part happyforms-part--recaptcha" data-sitekey="6LdusIAUAAAAACiwcJkzvlr4dCS5xtVzexfjwNqi" data-happyforms-type="recaptcha">
		<div class="happyforms-part-wrap" id="happyforms-2121-recaptcha">
		</div>
	</div>
				<div class="happyforms-form__part happyforms-part happyforms-part--submit">
    <input type="submit" class="happyforms-submit happyforms-button--submit" value="Submit Form"  disabled>
</div>		</div>

			</form>
</div>

Thanks, @webmasterpro!

Poking around your page, there’s a following error in browser’s developer tools console.

Uncaught Error: Invalid site key or not loaded in api.js: 6LedqoAUAAAAAIBTpqPJjczbdw1KQccODJ00a744

Would you mind double-checking reCaptcha configuration on Google’s end? An extra attention should be paid to domains your reCaptcha is activated on, and that the key is correct.

Let us know how you go! ??

It seems that the problem was that I had Contact Form 7 plugins activated. In addition to the form plugin, they offer a specific plugin to activate their reCaptcha called: “Contact Form 7 Captcha”. I think that was the culprit. I deactivated both Contact Form 7 plugins and now the HappyForms reCaptcha shows up on the published form.

Now I am very happy! Thanks for your support on this.

Happy to help, @webmasterpro!

Have a wonderful weekend! ??