Formidable Forms reCaptcha not working with Hustle popups

The Formidable Forms plugin includes reCaptcha module (both in Premium and free version). That captcha works with Hustle and PopUp Pro popups only if the popup is triggered "immediately". In both plugins, if the popup is triggered on click, "time activated" (e.g. trigger after 5 seconds) or on "scroll" - basically, on JS events - the recaptcha fields don't show up. However, if you try to send the form, there'll be a captcha error.

  • Adam Czajczyk
    • Support Gorilla

    Hello Rodrigo,

    I hope you're well today!

    The issue, as I informed you during our support chat session, has been forwarded to our 2nd line support and they'll be checking it. It might take a while so we would appreciate a bit of patience.

    Once we get a response from them, we'll update this ticket to let you know about the status of the issue.

    Kind regards,
    Adam

  • Lindeni Mahlalela
    • Recruit

    Hello Rodrigo Campos

    I hope you are doing great today. Thank you so much for reporting this issue to us and thank you for your patience so far.

    I have checked and verified the issue on my test website. I have then prepared a small plugin that will render the ReCaptcha once the popup has been displayed. You can simply copy the following code and paste it in a new file and name it render-captcha.php and upload it to your website in the location:
    wp-content/mu-plugins/render-captcha.php

    In this file you must have the code as follows:

    <?php
    if ( ! defined( 'ABSPATH' ) ) {
    	exit;
    }
    if ( ! class_exists( 'Render_Form_Captcha' ) ) {
    	class Render_Form_Captcha {
    		private static $_instance = null;
    		public static function get_instance() {
    			if( is_null( self::$_instance ) ){
    				self::$_instance = new Render_Form_Captcha();
    			}
    			return self::$_instance;
    		}
    		private function __construct() {
    			add_action('wp_footer', array($this, 'render' ) );
    		}
    		public function render(){ ?>
    			<script type="text/javascript">
                jQuery(document).ready( function(){
                    jQuery('.wph-modal').on('show', function() {
                        jQuery('.g-recaptcha').each( function(){
                            var widget = jQuery(this);
                            var id = widget.attr('id');
                            var theme = widget.data('theme');
                            var key = widget.data('sitekey');
    
                            render_captcha(id, key);
                        });
                    });
                });
    
                function render_captcha(id, key,theme){
                    recaptcha = grecaptcha.render(id, {
                        'sitekey' : key,
                        'theme' : 'light'
                    });
                }
            </script><?php
    		}
    	}
        add_action( 'plugins_loaded', 'render_formidable_google_captcha' );
        function render_formidable_google_captcha(){
    		$GLOBALS['Render_Form_Captcha'] = Render_Form_Captcha::get_instance();
    	}
    }

    Once you have uploaded the file then all the ReCaptcha will be rendered on your popups regardless of the trigger method chosen. Alternatively, you can download the attached zip file then upload it and activate it as a regular WordPress plugin in "Plugins > Add New", then once you have activated it the popups should be displayed properly.

    I hope this helps. Please let us know if you have any further issues regarding this and we will be happy to help.

    Have a nice day.
    Mahlamusa

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.