Comment changer la position du badge reCAPTCHA invisible v2

Souhaitez-vous changer la position du badge reCAPTCHA invisible de Google sur votre formulaire ? Vous pouvez facilement utiliser PHP pour changer la position par défaut.

Lorsque vous utilisez le reCAPTCHA invisible v2 de Google, un badge s'affiche dans le coin inférieur droit de la page Web. Par défaut, la position est toujours définie sur bottomright. Avec un petit extrait de code, vous pouvez changer cette position en bottomleft ou inline.

Dans ce tutoriel, nous allons utiliser un extrait de code PHP pour changer l'emplacement de ce badge de bottomright à inline.

Création de votre formulaire

Avant de créer notre formulaire, nous allons nous assurer que nos paramètres Google sont correctement configurés.

Si vous avez besoin d'aide pour configurer votre reCAPTCHA Google, veuillez consulter cette documentation.

Une fois que vous avez confirmé votre reCAPTCHA invisible Google, vous pouvez créer votre formulaire et ajouter vos champs.

Si vous avez besoin d'aide pour créer votre formulaire, veuillez consulter ce tutoriel.

Une fois que vous avez ajouté vos champs, cliquez sur l'onglet Paramètres dans le constructeur de formulaire, puis sélectionnez Protection anti-spam et sécurité. Cliquez sur le bouton pour activer l'option Activer le reCAPTCHA invisible v2 de Google.

Changer la position du badge reCAPTCHA

Dans notre exemple de code, nous allons changer cette position en inline. Vous devrez copier cet extrait sur votre site.

Si vous avez besoin d'aide pour ajouter des extraits à votre site, veuillez consulter ce tutoriel.

/**
 * 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 );

Une fois le code ci-dessus ajouté à votre site, le badge apparaîtra maintenant juste au-dessus du bouton Envoyer au lieu de flotter dans le coin inférieur droit.

Et voilà ! Vous avez maintenant ajusté avec succès la position du badge. Souhaitez-vous afficher des shortcodes dans votre champ de formulaire HTML ? Essayez notre tutoriel sur Comment afficher des shortcodes dans le champ HTML.

Filtre de référence

wpforms_frontend_recaptcha