Ajouter un formulaire MailerPress avec Elementor pour capturer les emails

Avec Elementor, vous pouvez collecter des abonnés de deux façons : le widget Formulaire MailerPress, qui fonctionne avec la version gratuite d’Elementor, ou une action MailerPress ajoutée au widget Formulaire d’Elementor Pro.

Cette intégration nécessite MailerPress Pro 1.2 ou supérieur. L’action MailerPress pour les formulaires Elementor nécessite aussi Elementor Pro.

Option 1 : le widget Formulaire MailerPress

Modifiez une page avec Elementor, recherchez Formulaire MailerPress dans le panneau des widgets et faites-le glisser dans votre contenu. Cliquez sur le widget pour ouvrir ses réglages.

Ajouter des champs au formulaire

Dans l’onglet Contenu, la section Champs du formulaire contient un champ e-mail par défaut. Ajoutez un élément pour chaque champ supplémentaire et définissez :

  • Type de champ : E-mail, Texte, Zone de texte, Téléphone, Nombre ou Date.
  • Libellé, Nom du champ et Texte indicatif. Le nom du champ sert à la correspondance décrite plus bas.
  • Obligatoire : indique si le visiteur doit remplir le champ.

Faites glisser les éléments pour réordonner les champs.

Faire correspondre les champs à MailerPress

Faire correspondre les champs consiste à indiquer à MailerPress quel champ du formulaire remplit quel champ du contact.

  • Correspondance des champs : pour chaque élément, saisissez le Nom du champ du formulaire (la valeur de Nom du champ, pas le libellé) et choisissez le Champ MailerPress : E-mail, Prénom ou Nom. Si vous laissez cette section vide, les champs nommés email, firstname ou first_name, et lastname ou last_name sont associés automatiquement.
  • Correspondance des champs personnalisés : saisissez le Nom du champ du formulaire et choisissez le champ personnalisé MailerPress dans Clé du champ personnalisé. Créez d’abord vos champs personnalisés dans MailerPress (consultez Gérer vos champs de contact).

Choisir les listes, les étiquettes et le double opt-in

Dans Réglages MailerPress :

  • Listes MailerPress : une ou plusieurs listes. Laissez vide pour utiliser la liste par défaut.
  • Étiquettes MailerPress : étiquettes (des libellés pour trier les contacts) ajoutées au contact.
  • Double opt-in (activé par défaut, recommandé) : les nouveaux contacts reçoivent le statut En attente et doivent cliquer sur le lien d’un e-mail de confirmation pour être abonnés. Désactivé, ils sont abonnés directement. Les contacts déjà abonnés gardent leur statut ; seuls leurs listes, étiquettes et champs sont mis à jour.
  • Source d’inscription : un libellé facultatif (par exemple landing-page) affiché comme source d’opt-in du contact dans MailerPress > Audience > Contacts. Laissez vide pour utiliser la valeur par défaut.

Définir les messages et la redirection

Dans Réglages du formulaire :

  • Colonnes du formulaire : affiche les champs sur 1, 2 ou 3 colonnes.
  • Texte du bouton d’envoi, Message de réussite et Message d’erreur.
  • Activer la redirection après l’envoi : choisissez ensuite la page dans Page de redirection et le Délai de redirection (secondes) (2 par défaut, 0 pour rediriger immédiatement).

Personnaliser le design

Dans l’onglet Style, réglez la Largeur du formulaire. Utilisez l’onglet Avancé pour les marges, les espacements et les autres réglages, comme pour tout widget Elementor.

Option 2 : l’action MailerPress pour les formulaires Elementor Pro

Si vous utilisez déjà le widget Formulaire d’Elementor Pro (par exemple pour un formulaire de contact), vous pouvez envoyer ses soumissions à MailerPress sans modifier le formulaire.

  1. Modifiez le widget Formulaire.
  2. Dans Actions après envoi, ajoutez l’action MailerPress. Vous pouvez conserver vos autres actions, comme la notification par e-mail.
  3. Ouvrez la nouvelle section Réglages MailerPress et réglez Listes MailerPress (vide = liste par défaut), Étiquettes MailerPress, Double opt-in et, si besoin, Source d’inscription. Ces options fonctionnent comme dans le widget.
  4. Dans Correspondance des champs, ajoutez un élément par champ : saisissez l’ID du champ dans Champ du formulaire et choisissez le Champ MailerPress. L’ID se trouve dans l’onglet Avancé de chaque champ du formulaire (par exemple email ou name).
  5. Dans Correspondance des champs personnalisés, associez d’autres champs du formulaire à des champs personnalisés MailerPress avec Champ du formulaire et Clé du champ personnalisé.
  6. Mettez à jour la page.

Sans aucune correspondance, MailerPress utilise les ID des champs : email, e-mail ou mail pour l’e-mail ; name, firstname ou first_name pour le prénom ; lastname, last_name ou surname pour le nom. Si aucun e-mail n’est trouvé ainsi, le premier champ E-mail du formulaire est utilisé. Une soumission sans e-mail valide affiche une erreur dans le formulaire.

Vous préférez le shortcode ? Consultez Ajouter un formulaire MailerPress avec votre Page Builder pour collecter des emails. Pour la confirmation d’inscription, consultez Activer la confirmation de l’inscription (double opt-in).