Le Widget Connexion d’Elementor Pro est très utile pour réaliser une page d’authentification personnalisée et dans le cadre d’un middle-office. Cependant je trouve qu’il ne va pas assez loin dans la personnalisation et qu’il sait pas prendre en compte le paramètre d’URL redirect_to.
Le paramètre d’URL redirect_to et un paramètre natif et qui est passé à la page de connexion lorsque l’utilisateur tente d’accéder à une ressource qui requiert une authentification. Une fois l’authentification effectuée, on devrait logiquement être redirigé vers la page renseignée par redirect_to. Sauf que ça ne fonctionne pas avec le widget Connexion.
J’ai beau parcourir la documentation d’Elementor, mais aussi Internet et Chat GPT, je ne trouve pas de hook qui permettrait de forcer la valeur du champs hidden dans le formulaire généré par le widget Connexion.
Configuration du formulaire
Nous allons utiliser un petit script Javascript pour résoudre cette problématique. Mais en premier lieu, il faut apporter une petite modification au widget.
Modifiez avec Elementor la page contenant le formulaire de connexion. Allez dans l’onglet Avancé, et ajoutez loginform à l’attribut ID de CSS.
Script pour alimenter la valeur de retour
Placez ensuite ce code javascript dans un fichier appelé sur le site. Si vous n’êtes pas développeur ou si vous n’avez pas accès à un fichier javascript, vous pouvez utiliser Elementor et le module Code personnalisé.
document.addEventListener('DOMContentLoaded', () => {
// Récupère la valeur de "redirect_to" dans l'URL de la page
let redirectUrl = new URL(window.location.href).searchParams.get('redirect_to');
// Vérifie si la valeur de "redirect_to" est présente et n'est pas vide
if (redirectUrl !== null && redirectUrl !== '') {
// Trouve l'élément input hidden "redirect_to" dans le formulaire de connexion
let redirectInput = document.querySelector('div#loginform form input[name="redirect_to"]');
// Assigne la valeur de "redirect_to" au champ input hidden "redirect_to"
if (redirectInput) redirectInput.value = redirectUrl;
}
});
Et voilà, à présent, le widget Connexion prendra en compte la valeur de redirect_to pour vous rediriger après authentification.
