Paramètres du widget Mailchimp

Un Formulaire Elementor Mailchimp est l'un des moyens les plus rapides de transformer un visiteur en abonné Le Widget Mailchimp dans Modules complémentaires principaux pour Elementor place un formulaire d'inscription du plugin gratuit MC4WP : Mailchimp pour WordPress dans votre mise en page, et il vous donne deux façons de l'exécuter : afficher le formulaire MC4WP enregistré, ou écrire votre propre balisage de champ Ci-dessous je couvre les deux, du panneau Élémenteur jusqu'à la page en direct.

Comment fonctionne le widget de formulaire Elementor Mailchimp #

Le widget rend a Formulaire d'inscription Mailchimp dans Elementor en affichant un formulaire de MC4WP : Mailchimp pour WordPress, un plugin gratuit par ibericode MC4WP détient la clé API, les messages d'audience, de double opt-in et de formulaire Le widget ajoute un choix de type de formulaire : afficher le formulaire MC4WP enregistré, ou remplacer ses champs par votre propre balisage MC4WP traite l'inscription dans un sens ou dans l'autre.

Avant de commencer #

• WordPress avec Élémenteur installé et actif.
• Modules complémentaires principaux pour Elementor installé et actif Si vous ne l'avez pas encore installé, suivez le guide d'installation.
• Le widget Mailchimp activé dans le panneau d'options Master Addons.
• Le gratuit MC4WP : Mailchimp pour WordPress plugin installé et actif Sans lui, le widget affiche une“MailChimp pour WordPress is Not Activated !” notice au lieu d'un formulaire.
• Un compte Mailchimp et une clé API.

Ajoutez le widget à votre page #

Ouvrir le Editeur d'éléments et recherchez dans le panneau des widgets “Mailchimp.” Faites glisser les modules complémentaires principaux Mailchimp widget dans la section où vous voulez le formulaire Il montre votre formulaire MC4WP, ici un champ de courriel, une case à cocher termes et un bouton “Sign up” La ligne rouge à propos de la clé API Mailchimp vient de MC4WP Seuls les administrateurs connectés le voient, et elle disparaît une fois MC4WP connecté.

Utilisez un formulaire d'inscription Mailchimp par défaut #

Dans l'onglet Contenu, laisser Formulaire Type sur Défauts. Le Formulaire d'inscription MailChimp dropdown répertorie les formulaires enregistrés dans MC4WP, comme “opt dans.” Choisissez celui que vous voulez et le widget le restitue sur le canevas avec les champs que vous définissez sous MC4WP > Form. La version gratuite de MC4WP comprend un formulaire.

C'est le moyen le plus rapide d'obtenir un Formulaire d'inscription Mailchimp dans Elementor en direct, puisque MC4WP mappe déjà les champs à votre public.

Construire un formulaire Mailchimp personnalisé #

Définir le Formulaire Type déposer à Personnalisé. UN Formulaire personnalisé la boîte de code apparaît pour votre propre balisage de champ, qui remplace les champs du formulaire MC4WP Ne collez pas le code d'intégration de Mailchimp lui-même, car sa balise de formulaire se brise à l'intérieur du formulaire MC4WP. Atteignez-le lorsque vous avez besoin de champs supplémentaires, d'étiquettes personnalisées ou d'une disposition de case à cocher particulière.

Le balisage de démonstration dans la vidéo utilise une structure simple que vous pouvez adapter :

<p>
  <label for="email">Email address:</label>
  <input type="email" id="email" name="EMAIL" placeholder="Your email address">
</p>

<p>
  <label>
    <input type="checkbox" name="AGREE_TO_TERMS" value="1" required>
    I have read and agree to the terms & conditions
  </label>
</p>

<p>
  <input type="submit" value="Sign up">
</p>

Si vous préférez écrire et prévisualiser le balisage en dehors d'Elementor, cet éditeur de code côte à côte avec l'aperçu en direct provient du gratuit Mailchimp pour WordPress (MC4WP) plugin, pas Master Addons lui-même Marquage à gauche, aperçu en direct à droite, afin que vous puissiez obtenir la mise en page juste avant de la coller dans le widget.

Une chose qui fait trébucher les gens avec un balisage personnalisé : votre name les attributs doivent correspondre à vos balises de fusion d'audience Mailchimp. Le champ de messagerie en particulier doit être utilisé name="EMAIL"(ou Mailchimp ne reconnaîtra pas l'adresse de l'abonné et l'inscription échoue silencieusement.

Configurez votre clé API Mailchimp #

La ligne de clé API s'efface une fois MC4WP connecté Dans l'administrateur WordPress, ouvrez MC4WP > Mailchimp, collez votre clé et enregistrez, et l'état change pour Connecté Puis ouvrez MC4WP > Formulaire« , cochez l'audience qui devrait recevoir les abonnés, et cochez l'onglet Paramètres La double option d'adhésion est activée par défaut là-bas, et vous pouvez également ajouter des balises d'abonné ou une URL de redirection. ».

Générez une clé à partir de votre Paramètres du compte Mailchimp. Gardez-le privé et ne le collez jamais dans le balisage du formulaire personnalisé lui-même, car ce balisage est visible par toute personne qui consulte la source de la page.

Style le formulaire #

Le widget n'a pas Style onglet. Les addons principaux chargent une petite feuille de style qui donne au champ de courriel et au bouton une hauteur de 50 px, un bouton sombre et des cases de succès et d'erreurs colorées Le MC4WP peut ajouter son propre look à partir de l'onglet Apparence du formulaire, soit les styles de base, soit un thème Lumière, Foncé, Rouge, Vert ou Bleu Utilisez l'onglet Élémenteur Avancé pour l'espacement et l'arrière-plan Pour les couleurs du champ ou du bouton, ajoutez CSS avec le Extension CSS personnalisée et cible .jltma-mailchimp donc le Formulaire d'inscription par e-mail Elementor correspond au reste de votre conception.

Le résultat sur la page live #

Sur le front-end, le formulaire affiche le champ de messagerie, la case à cocher des conditions et le bouton Soumettre exactement comme vous les avez définis. Avec MC4WP connecté, chaque inscription est adressée au public coché dans le formulaire MC4WP, après que l'abonné a confirmé par e-mail si la double inscription est activée.

Cas d'utilisation courants #

• Bulletins d'information du blog : déposez un simple champ de messagerie dans le pied de page ou la barre latérale d'un blog.
• Aimants en plomb : associez le formulaire à un bouton de téléchargement pour que les visiteurs s'abonnent avant d'obtenir le guide.
• Pages de lancement de produits : collectez des e-mails d’accès anticipé sur une page de destination.
• Inscriptions à l'événement : utilisez le balisage personnalisé pour ajouter des cases à cocher nom, entreprise ou consentement.
• Abonnements aux pieds : intégrer un compact Widget Mailchimp pour Elementor dans le pied de page du site.

Pour plus d'options de formulaire, consultez le Widget Formulaire de contact 7. Pour qu'une barre d'annonce soit assise à côté d'un formulaire d'inscription, essayez le Widget News Ticker.

Tutoriel Vidéo #

Préférez regarder ? cette procédure pas à pas met en place le widget Mailchimp bout à bout, du choix d'un type de formulaire au formulaire d'inscription sur la page en direct :

Foire aux questions #

Envelopper #

Les modules principaux Widget Mailchimp est un moyen direct d'ajouter un Formulaire Elementor Mailchimp vers n'importe quelle page. partez avec un formulaire par défaut pour la vitesse, ou passez en mode personnalisé lorsque vous souhaitez un contrôle total sur le balisage et les champs. Quoi qu'il en soit, les abonnés atteignent votre audience Mailchimp une fois MC4WP connecté Parcourir l'ensemble complet de Widgets et extensions Master Addons pour plus d'outils pour faire croître votre liste.