Avada Forums Community Forum Help for Contact Form 7 new reCAPTCHA v3

Viewing 15 posts - 1 through 15 (of 21 total)
  • Author
    Posts
  • Tiffer777
    Participant
    Post count: 7

    Hi, I upgraded my Google API for reCAPTCHA version 3 as advised by Contact Form 7 (5.1.1). Now my forms are broken! I am getting the error that CF7 talks about in this post here: https://contactform7.com/2018/12/18/contact-form-7-511/
    They say it is a theme related issue regarding Javascript. Is there a way to fix this? Or, how do I revert back to reCAPTCHA v. 2? Any advise would be great! I’m not a very technical person, so speak easy in your reply!! =) Thank you so much! Oh, here is one of my forms with the issue: https://www.eruptr.com/contact-us/

    bjsdesignstudio
    Participant
    Post count: 10

    I wish I had a solution for you! But, know that you’re not alone!

    I’m having trouble, too. Same *exact* situation as you: I had recently upgraded to reCAPTCHA v3, using Contact Form 7 (just updated to 5.1.1, which I had hoped would fix things a bit better) with the Avada theme. Every time I submit the form, I get an orange border with a notice stating that my message was automatically flagged as spam (“Message automatically flagged as spam. You may want to call or email to verify that your message has been received.”). I’ve got a couple other clients with a similar setup, and I’m about to see if I can roll back to reCAPTCHA v2, if I can’t figure this out.

    At first, I simply followed CF7’s instructions: copy/paste my site key and secret key into the CF7 integration fields and that’s it. I’ve also tried copying/pasting the client-side snippets from Google:

    1. Paste this snippet before the closing </head> tag on your HTML template:
    <script src=’https://www.google.com/recaptcha/api.js?render=***********’></script&gt;

    I pasted that into Avada -> Theme Options -> Advanced -> Code Fields (Tracking, etc.) -> Space before </head>

    2. Paste this snippet in the JavaScript callback for an action on your website.
    <script>
    grecaptcha.ready(function() {
    grecaptcha.execute(‘*************’, {action: ‘action_name’})
    .then(function(token) {
    // Verify the token on the server.
    });
    });
    </script>

    I pasted the above script into Avada -> Theme Options -> Advanced -> Code Fields (Tracking, etc.) -> Space before </body>

    To be honest, I’m not 100% sure that’s the right place for that last one.

    I think I’ll contact my host (SiteGround) next via online chat, to see if there’s anything they can notice on their end. Maybe they don’t support v3, yet? I don’t know, but they’ve been super quick/helpful with troubleshooting issues, so maybe it’s worth trying that route for now.

    My contact form:

    https://bjsdesignstudio.com/contact/

    Tiffer777
    Participant
    Post count: 7

    It seems safe to say the first short script goes before the </head> but the 2nd one I’m not really sure either! Still trying to figure it out! Maybe they both go before </head>? Hopefully somebody here might know!

    Tiffer777
    Participant
    Post count: 7

    That worked, I put them both before the </head> space! Now that that is working, the next issue is the problem everyone seems to be having with v3 not blocking spam at all.

    bjsdesignstudio
    Participant
    Post count: 10

    Well, I was hopeful for a second there! Unfortunately, after moving that second script before </head>, I’m still getting the warning that it’s automatically flagged as spam, as soon as I click the Submit button. 🙁

    Had an online chat w/ my host. They think it’s an issue w/ the plugin (I’m using Contact Form 7 and Flamingo [message storage plugin for CF7]). Something about how the plugin is identifying spam…?

    All I know is my host’s support tech was able to submit the form successfully. But, for some reason, I can’t… 🙁

    I’m just gonna try a different contact form plugin (or maybe just the contact form option that comes w/ the theme, itself) and call it a day… *shrug*

    Tiffer777
    Participant
    Post count: 7

    While researching all this I did find this solution some ppl are using as a work-around. Maybe it’s worth a try? https://articles.runtings.co.uk/2018/12/how-to-fix-contact-form-7-v501.html
    Hope it helps!

    bjsdesignstudio
    Participant
    Post count: 10

    I figured out what the issue was (for me, at least):

    I had also entered my reCAPTCHA v3 site and secret keys into the Avada theme options. When I tried using the default contact page template, it was showing “invalid key type” for the reCAPTCHA, sooooo…

    I think Avada, itself, just doesn’t support v3 yet. I removed the reCAPTCHA keys from the Avada theme options and I was able to submit my form successfully! 🙂

    bjsdesignstudio
    Participant
    Post count: 10

    Oops, I meant to specify: removed reCAPTCHA keys from the Avada theme options found at Avada -> Theme Options -> Contact Form -> bottom section labeled ReCaptcha. I just cleared those fields.

    Tiffer777
    Participant
    Post count: 7

    Thought I’d tell you – I found this little tidbit! If you want to make that recaptcha box invisible you can put this in the Custom CSS in your theme options!

    .grecaptcha-badge {
    display: none;
    }

    Dewdan
    Participant
    Post count: 14

    I had the same issue on my latest project. Somehow I thought my rooter was blocking the forms as I always got the orange message. Last night before closing the office I use the ipconfig/flushdns from the Command prompt, shut the computer and this morning all is working fine.

    Was it my luck? Maybe but in case i post it here.

    bjsdesignstudio
    Participant
    Post count: 10

    After realizing that my last “solution” didn’t work as well as I had originally thought, I found another post elsewhere with a solution that did work for me (and is still working): adding code to one of my caching/optimization plug-ins (Autoptimize) to exclude the reCAPTCHA JavaScript from being cached by that plug-in.

    In the “JS Exclude” field in Autoptimize, I added, per suggestion:

    /recaptcha/api.js

    Here is the original forum post, w/ my own reply:

    https://wordpress.org/support/topic/recaptcha-v3-does-not-allow-form-submissions/#post-11013867

    I’ve got reCAPTCHA v3 on three different sites, now, without being auto-flagged as spam.

    bjsdesignstudio
    Participant
    Post count: 10

    That’s a nice little tidbit, Tiffer777. Thanks for sharing! 🙂

    mbrowncapmail
    Participant
    Post count: 1

    Thanks BJS and everybody else. You all saved my bacon. The Autoptimize exclude did the trick for me. Now I can stop pulling my hair out. Thanks so much for the posts and follow up. Helped me a lot.

    topdo9
    Participant
    Post count: 1

    Anyone took this up with themefusion support to see if there is an official fix availible or coming up?

    bjsdesignstudio
    Participant
    Post count: 10

    Hi, topdo9,

    The latest version of Avada (5.8.2) appears to include support for reCAPTCHA v3, from what I see on my end. Not sure which theme you’re using. Have you tried any of the tips in this thread?

    I just tested a brand new site design I am working on for a new client, in a sub-folder of my site. I’m using the latest version of Avada, very few plug-ins, so far (no Autoptimize or anything, yet, so nothing where I have to exclude the JS like before), and the form went through just fine w/ reCAPTCHA v3.

    Go to theme options -> Contact Form. Scroll to the ReCaptcha section. You can select either V2 or V3. If you’re using V3, obviously select that version and make sure you paste in your V3 site and secret keys (V2 keys won’t work — they have to match the reCAPTCHA version you’re using).

    Also, make sure those same site and secret keys are entered into CF7’s integration settings: dashboard sidebar -> Contact -> Integration -> reCAPTCHA section.

    Hope that helps!

Viewing 15 posts - 1 through 15 (of 21 total)
  • You must be logged in to reply to this topic.