How to Change the Position of the v2 Invisible reCAPTCHA Badge

Overview

Would you like to change the position of the v2 Invisible reCAPTCHA badge on your form? You can easily use PHP to change the default position. In this tutorial, we’ll show you the code snippet so that you can change the default position of the badge.

Setup

When using Google’s v2 Invisible reCAPTCHA, there is a badge that will show in the bottom right corner of the webpage. By default, the position is always set to bottomright. With a small code snippet you can change this position to either bottomleft or inline.

Adding the code

In our example code, we’re going to change this position to inline. Simply add the code shown below to your site,

/**
 * Google v2 Invisible ReCAPTCHA badge position
 *
 * @link https://wpforms.com/developers/how-to-change-the-position-of-the-v2-invisible-recaptcha-badge/
 *
 */
function wpf_dev_invisible_recaptcha_position( $data, $form_data ) {
	
	$type = wpforms_setting( 'recaptcha-type', 'v2' );
	if ( 'invisible' === $type ) {
		$data['badge'] = 'inline';
	}
	return $data;
}
add_filter( 'wpforms_frontend_recaptcha', 'wpf_dev_invisible_recaptcha_position', 10, 2 );

Setting up reCAPTCHA

Now you’ll need to set up the v2 Invisible reCAPTCHA, for assistance with this, please review this documentation.

Once the above code is added to your site, the badge will now appear just above the Submit button rather than floating in the bottom right corner.

With the code above you've now changed the position of the invisible reCAPTCHA badge

And that’s it! You’ve now successfully adjusted the position of the badge. Would you like to display shortcodes inside your HTML form field? Try out our tutorial on How to Display Shortcodes Inside the HTML Field.

Filter Reference: wpforms_frontend_recaptcha