Intégrer des formulaires d’inscription MailerPress sur des sites externes

Les formulaires intégrables vous permettent de placer un formulaire d’inscription MailerPress sur un autre site que votre site WordPress : une page de destination, un site statique, une boutique sur une autre plateforme, ou toute page dans laquelle vous pouvez coller du HTML. Les visiteurs qui s’inscrivent sont ajoutés à vos listes MailerPress, comme avec un formulaire de votre propre site.

Cette fonctionnalité nécessite MailerPress Pro. Sans MailerPress Pro, MailerPress > Réglages > Intégrer des formulaires affiche seulement un message de mise à niveau.

Chaque formulaire externe utilise une clé API : un code secret, créé dans MailerPress, qui permet au formulaire de communiquer avec votre site. La clé peut être limitée à vos domaines et possède sa propre limite de requêtes (un nombre maximal d’inscriptions par période). Elle est visible dans le code de la page externe, mais elle sert uniquement à envoyer des inscriptions à MailerPress, pas à consulter vos contacts.

Créer une clé API

  1. Allez dans MailerPress > Réglages > Intégrer des formulaires.
  2. Cliquez sur Créer une clé API.
  3. Remplissez les champs du tableau ci-dessous, puis cliquez sur Générer la clé.
  4. Un message affiche la nouvelle clé. Cliquez sur Copier la clé API et conservez-la en lieu sûr : la clé complète n’est affichée qu’une seule fois.
  5. Dans ce même message, cliquez sur Générer le code d’intégration pour créer le code du formulaire avec la clé déjà incluse.
ChampDescription
Nom de la cléObligatoire. Un nom pour reconnaître le formulaire, par exemple « Formulaire landing page » ou « Site externe ».
Domaine autoriséDomaines autorisés à envoyer le formulaire, sans https:// (par exemple example.com). Séparez plusieurs domaines par des virgules. Laissez vide pour autoriser tous les domaines, mais il est vivement recommandé d’en indiquer un.
Nombre maximal de requêtesNombre d’envois autorisés pendant la période, de 1 à 1000.
Période (minutes)Durée de la période, de 1 à 60 minutes.
Notes (facultatif)Notes internes, par exemple l’endroit où le formulaire est utilisé.

Nombre maximal de requêtes et Période (minutes) sont préremplis avec vos valeurs de MailerPress > Réglages > Protection contre les indésirables. La limite s’applique par adresse IP de visiteur (sa connexion Internet) pour cette clé. Consultez Sécurité et protection anti-spam.

Construire le formulaire et récupérer le code

Concevez le formulaire dans la fenêtre Générer le code d’intégration. Le code affiché en bas se met à jour à chaque modification.

OptionDescription
Sélectionner des listesListes rejointes par le nouveau contact.
Sélectionner des étiquettes (facultatif)Étiquettes (des libellés pour trier les contacts) ajoutées au contact.
Champs standards à inclureAdresse e-mail (obligatoire) est toujours incluse. Cochez Prénom et Nom pour afficher ces champs.
Champs personnalisés (facultatif)Champs personnalisés MailerPress à afficher dans le formulaire. Chacun garde son type (texte, nombre, date, case à cocher ou liste déroulante) et son caractère obligatoire.
Case de consentement RGPDAjoute une case de consentement (exigée par des lois sur la vie privée comme le RGPD) que les visiteurs doivent cocher pour s’inscrire.
LibellésLibellé de l’adresse e-mail, Libellé du prénom, Libellé du nom, Texte du bouton d’envoi et Texte de consentement RGPD.
MessagesMessage de réussite, Message d’erreur, Message d’adresse e-mail invalide, Message de limite de requêtes, Message de consentement RGPD obligatoire et Texte pendant l’envoi.
CSS personnalisé (facultatif)Styles pour adapter le formulaire au design du site externe.

Cliquez sur Copier le code d’intégration. Le code contient un conteneur, un script chargé depuis votre site WordPress et les réglages du formulaire. Il ressemble à ceci (version abrégée) :

HTML
<div id="mailerpress-embed"></div>
<script src="https://your-site.com/wp-content/plugins/mailerpress/build/dist/js/embed-widget.js"></script>
<script>
  new MailerPressEmbed({
    apiKey: 'YOUR_API_KEY_HERE',
    endpoint: 'https://your-site.com/wp-json/mailerpress/v1/embed/contact',
    container: '#mailerpress-embed',
    lists: [1],
    tags: [],
    fields: ["email","firstName"],
    ...
  });
</script>

Collez le code complet dans le HTML de la page externe, à l’endroit où le formulaire doit apparaître. Au préalable :

  • Si vous ouvrez plus tard Code d’intégration depuis la liste des clés, le code contient YOUR_API_KEY_HERE à la place de la clé. Remplacez-le par la clé conservée lors de sa création.
  • Les deux URL du code reprennent l’adresse de votre site WordPress. Si WordPress est installé dans un sous-répertoire, ou si votre API REST utilise une autre adresse, adaptez les deux URL.

Ce qui se passe lorsqu’un visiteur s’inscrit

  • MailerPress vérifie la clé API, le domaine autorisé et la limite de requêtes, puis crée ou met à jour le contact avec les listes, étiquettes et champs sélectionnés.
  • Le double opt-in (le contact confirme en cliquant sur un lien dans un e-mail) suit le réglage MailerPress > Réglages > Confirmation d’abonnement. S’il est activé, le contact est en attente et reçoit l’e-mail de confirmation. Consultez Activer la confirmation de l’inscription (double opt-in).
  • Le visiteur voit la réponse de MailerPress : « Abonnement effectué ! », ou « Veuillez consulter votre messagerie pour confirmer votre abonnement. » si la confirmation d’abonnement est activée. Les erreurs renvoyées par MailerPress s’affichent telles quelles. Votre Message de limite de requêtes s’affiche lorsque la limite est atteinte.
  • Si la protection Honeypot est activée dans Protection contre les indésirables, le formulaire inclut un champ caché qui filtre les robots.
  • La source d’opt-in du contact est embed_form.

Gérer vos clés API

La page Formulaires intégrés liste vos clés avec leur Statut, leur Domaine (Tous si aucun domaine n’est défini), leur Limite de requêtes, le Total des requêtes et leur date de création. Depuis cette liste, vous pouvez :

  • Cliquer sur Code d’intégration pour une clé active afin de générer à nouveau le code du formulaire.
  • Modifier le nom, les domaines autorisés, la limite de requêtes ou les notes d’une clé. La clé elle-même ne change pas : les formulaires existants continuent de fonctionner.
  • Révoquer une clé pour la bloquer immédiatement. Vous pouvez la réactiver plus tard.
  • Supprimer définitivement une clé. Les formulaires qui l’utilisent cessent de fonctionner.

Pour agir sur plusieurs clés à la fois, sélectionnez-les et utilisez Révoquer la sélection, Activer la sélection ou Supprimer la sélection.

Dépannage

  • « Domaine non autorisé » : le domaine de la page externe ne figure pas dans Domaine autorisé. La correspondance doit être exacte : example.com ne couvre pas www.example.com, ajoutez les deux si nécessaire.
  • « Échec de l’authentification » : la clé est erronée, révoquée ou supprimée, ou YOUR_API_KEY_HERE n’a pas été remplacé.
  • Les visiteurs voient le message de limite de requêtes : augmentez Nombre maximal de requêtes ou réduisez Période (minutes) pour cette clé.
  • Le formulaire ne s’affiche pas : vérifiez que l’URL du script s’ouvre dans votre navigateur et que la page contient bien le conteneur mailerpress-embed.