Mailchimp est l’un des meilleurs outils d’automatisation du marketing par e-mail pour votre site web. Ses services peuvent organiser efficacement vos abonnés et leur envoyer du contenu qui les intéresse. Toutefois, les formulaires de contact Mailchimp peuvent ne pas s’aligner sur l’image de marque de votre site web.

Pour résoudre ce problème, vous pouvez intégrer Elementor et Mailchimp. Avec Elementor, vous pouvez facilement concevoir un formulaire d’inscription personnalisé et l’intégrer à votre site web. Ensuite, vous pouvez gérer les informations d’inscription directement depuis Mailchimp.

Dans cet article, nous allons voir pourquoi vous pourriez vouloir intégrer Elementor et Mailchimp. Ensuite, nous vous montrerons comment le faire en seulement cinq étapes. Nous avons également inclus une liste de modules pour accéder à des caractéristiques et fonctionnalités supplémentaires. C’est parti !

Les avantages de l’intégration d’Elementor et de Mailchimp

Que vous gériez une entreprise en ligne ou un blog, vous aurez probablement besoin d’un moyen de contacter votre public de manière cohérente. Avec Mailchimp, c’est exactement ce que vous pouvez faire.

Mailchimp est un service de marketing par e-mail qui permet de créer des listes d’abonnés et de concevoir des e-mails :

Mailchimp.
Mailchimp.

En utilisant Mailchimp, vous pouvez créer des listes d’e-mails avec les coordonnées de vos abonnés. En utilisant des modèles d’e-mails préétablis et l’optimiseur de contenu, vous pouvez envoyer des mises à jour engageantes et informatives aux membres de votre public.

Si vous débutez sur Mailchimp, vous pouvez créer un compte gratuitement. Vous pouvez accéder à ses fonctionnalités faciles à utiliser sans payer, tant que vous avez moins de 2 000 abonnés.

Lorsque vous essayez de développer votre liste d’e-mails, il est judicieux d’intégrer des formulaires d’inscription sur votre site web. Ils peuvent vous aider à générer des prospects à partir de votre trafic organique. Bien que Mailchimp dispose de cette fonctionnalité, ses formulaires intégrés sont souvent génériques et ne correspondent probablement pas à votre image de marque.

C’est là qu’intervient Elementor. Elementor est un constructeur de pages WordPress facile à utiliser que vous pouvez utiliser pour concevoir votre site web sans coder. Son éditeur de type glisser-déposer permet de créer facilement les caractéristiques et les fonctionnalités dont votre site a besoin :

Constructeur de pages Elementor.
Constructeur de pages Elementor.

En outre, Elementor peut facilement s’intégrer à Mailchimp. Par rapport aux autres constructeurs de pages, Elementor est l’une des meilleures options pour créer et gérer des formulaires d’adhésion (opt-in).

Avec Elementor, vous pouvez ajouter un formulaire de contact n’importe où sur votre site et lier Mailchimp dans ses réglages. Lorsque vos visiteurs en ligne s’inscrivent, ils sont automatiquement ajoutés à votre liste Mailchimp. L’utilisation des deux outils vous permet d’avoir des formulaires bien conçus sans perdre les analyses des abonnés.

Comment intégrer Elementor et Mailchimp (en 5 étapes)

Maintenant que vous savez comment Elementor et Mailchimp peuvent bénéficier à votre site web, voyons comment démarrer ce processus d’intégration !

Étape 1 : Ouvrir un compte Mailchimp

Tout d’abord, vous devez vous rendre sur le site web de Mailchimp et ouvrir un compte. Vous pouvez le faire gratuitement en saisissant simplement votre adresse e-mail, votre nom d’utilisateur et votre mot de passe :

S'inscrire à un compte Mailchimp.
S’inscrire à un compte Mailchimp.

Ensuite, Mailchimp vous enverra un e-mail avec un lien d’activation. En cliquant dessus, vous verrez une page avec différentes options de plan :

Options de plan Mailchimp.
Options de plan Mailchimp.

Si vous n’êtes pas sûr du plan qui vous convient, sélectionnez Comparer les caractéristiques du plan. Ici, vous pouvez voir tout ce qui est compris dans chaque plan :

Comparez les plans Mailchimp.
Comparez les plans Mailchimp.

Dans ce tutoriel, nous choisissons le plan gratuit, qui peut prendre en charge 2 000 contacts et 10.000 envois d’e-mails. Cela sera suffisant pour un plan de marketing par e-mail de base. Cependant, vous ne pourrez pas accéder aux annonces de re-ciblage, aux modèles d’e-mails codés sur mesure ou à la personnalisation de la marque.

Pour commencer le processus d’inscription, remplissez votre nom et les informations relatives à votre entreprise. Bien que cela soit facultatif, vous pouvez également entrer l’URL de votre site web et importer votre contenu :

Add name and business info
Ajoutez votre nom et vos informations commerciales.

Ensuite, remplissez les informations de votre adresse. Cette étape permet de s’assurer que vos e-mails ne contribuent pas au spam :

Ajoutez votre adresse dans le champ.
Ajoutez votre adresse dans le champ.

Mailchimp vous demandera ensuite si vous avez déjà des abonnés. Si c’est le cas, sélectionnez Oui et indiquez combien vous en avez :

Complétez le nombre d'abonnés que vous avez.
Complétez le nombre d’abonnés que vous avez.

Pour aider Mailchimp à comprendre votre activité, indiquez si vous vendez des produits ou des services. Pour contourner cette question, vous pouvez cliquer sur Ignorer (ou Skip) :

Option Produits ou services.
Option Produits ou services.

Après avoir terminé ce processus d’inscription, vous pourrez accéder à votre compte Mailchimp !

Étape 2 : Créer une audience et une clé API

Pour commencer à organiser vos abonnés dans Mailchimp, vous devrez créer une audience. Gardez à l’esprit qu’un compte gratuit ne prend en charge qu’une seule audience, mais que tout plan avancé peut en inclure trois ou plus.

Bien que vous puissiez être tenté de créer plusieurs audiences, Mailchimp recommande de commencer par une seule. Cette configuration peut vous aider à comprendre vos abonnés dans leur ensemble. Elle peut également simplifier votre processus d’envoi d’e-mails et maintenir vos contacts à mesure que votre entreprise se développe.

Même avec une seule audience, vous pouvez créer des balises et des segments pour organiser les contacts en différents sous-ensembles. Cependant, la création de plusieurs audiences peut présenter certains avantages.

Par exemple, si vous envoyez des e-mails à la fois aux vendeurs et aux acheteurs, vous devrez peut-être envoyer des messages distincts à ces groupes.

Dans votre tableau de bord Mailchimp, allez dans Audience > Tableau de bord des audiences. Ensuite, cliquez sur Ajouter vos contacts:

Ajouter des contacts dans Mailchimp.
Ajouter des contacts dans Mailchimp.

Cela vous amènera à une page pour importer les coordonnées de vos abonnés. Il suffit de copier et de coller leurs noms et adresses e-mail dans une zone de texte. Vous pouvez également importer des données depuis un service tiers ou téléverser un fichier CSV ou TXT :

Sélectionnez une méthode de téléversement.
Sélectionnez une méthode de téléversement.

Une fois que vous avez fait cela, allez dans votre tableau de bord d’audience et trouvez Gérer l’audience > Réglages. Ici, vous pouvez modifier le nom et les réglages par défaut :

Modifiez le nom et les réglages par défaut.
Modifiez le nom et les réglages par défaut.

Veillez à définir un nom et une adresse électronique « From ». Vous pouvez également activer une double adhésion (opt-in) pour envoyer aux abonnés un e-mail de confirmation après leur inscription :

Ajouter plus d'options de campagne.
Ajouter plus d’options de campagne.

Une fois que vous avez terminé de créer et de configurer un compte, allez dans votre profil. Puis cliquez sur Extras > Clés API:

Cliquez sur l'onglet Extras pour trouver l'option API.
Cliquez sur l’onglet Extras pour trouver l’option API.

Si vous n’avez pas de clé API, vous devrez cliquer sur Créer une clé. Mailchimp en ajoutera une automatiquement pour vous :

Créez une clé API.
Créez une clé API.

Une fois que votre clé API est active, copiez-la. Comme cette information donne accès à votre compte Mailchimp, ne partagez jamais ce code publiquement.

Étape 3 : Concevoir un formulaire d’inscription Mailchimp avec Elementor

Ensuite, vous devrez télécharger et installer Elementor Pro. Il comprend un constructeur de formulaire WordPress, que vous pouvez utiliser pour concevoir des formulaires personnalisés et recueillir les commentaires de votre public.

Après avoir activé Elementor Pro, allez dans Elementor > Réglages > Intégrations. Faites défiler jusqu’à la section Mailchimp et collez la clé API :

Collez votre clé API Mailchimp.
Collez votre clé API Mailchimp.

Cliquez sur Valider la clé API. Si l’intégration est réussie, vous verrez une coche verte à côté de ce bouton. Après cela, enregistrez vos modifications.

Vous pouvez maintenant commencer à concevoir votre formulaire d’inscription. Tout d’abord, ajoutez un nouveau message ou une nouvelle page et sélectionnez Modifier avec Elementor:

Sélectionnez Modifier avec Elementor.
Sélectionnez Modifier avec Elementor.

Dans l’éditeur Elementor, faites défiler la page jusqu’aux widgets Pro. Ici, vous verrez une option pour les Formulaires. Faites glisser et déposez ce widget sur la page :

Faites glisser et déposez le widget Formulaire sur la page.
Faites glisser et déposez le widget Formulaire sur la page.

Elementor créera automatiquement un formulaire de base qui comprend les champs nom, adresse e-mail et message. Cependant, vous pouvez continuer à personnaliser le formulaire jusqu’à ce qu’il réponde à vos besoins :

Personnalisez le formulaire comme bon vous semble.
Personnalisez le formulaire comme bon vous semble.

Par exemple, si vous voulez ajouter un formulaire d’abonnement, il n’aura généralement pas besoin de champs de message. Vous pouvez simplement cliquer sur le X à côté de cet élément.

Pour générer des prospects, vous devrez demander aux visiteurs de remplir à la fois leur nom et leur adresse de messagerie. Vous pouvez le faire en cliquant sur chaque champ et en sélectionnant Oui à côté de Nécessaire :

Cliquez sur les éléments appropriés.
Cliquez sur les éléments appropriés.

Ensuite, allez dans la section Boutons pour modifier le bouton d’action. Bien que le texte par défaut soit « Envoyer », envisagez de le changer en « S’abonner » ou « S’inscrire » :

Modifiez le bouton d'action dans Elementor.
Modifiez le bouton d’action dans Elementor.

Vous pouvez continuer à modifier la taille du bouton et la largeur de la colonne selon vos besoins. Si vous préférez, vous pouvez également ajouter une icône.

Étape 4 : Connecter Mailchimp

Après avoir personnalisé votre formulaire à votre guise, il est temps de connecter votre compte Mailchimp. Pour cela, trouvez la section Actions après l’envoi :

Accédez à l'option Actions après l'envoi.
Accédez à l’option Actions après l’envoi.

Ensuite, cliquez sur l’icône + et choisissez Mailchimp dans le menu déroulant :

Choisissez Mailchimp dans le menu déroulant.
Choisissez Mailchimp dans le menu déroulant.

Cela créera une nouvelle section en dessous intitulée Mailchimp. Lorsque vous cliquez dessus, vous verrez des options pour définir une clé API et une audience :

Définissez les options API et audience si besoin.
Définissez les options API et audience si besoin.

Si vous avez saisi votre clé API dans les réglages d’intégration, vous pouvez laisser la section Clé API par défaut. Ensuite, sélectionnez l’audience que vous souhaitez lier à ce formulaire d’abonnement :

Sélectionnez l'audience appropriée de Mailchimp.
Sélectionnez l’audience appropriée de Mailchimp.

Vous pouvez également choisir tout groupe ou étiquette que vous avez créé dans Mailchimp. Enfin, personnalisez les réglages de mappage des champs en fonction des champs que vous avez fournis dans le formulaire. Cela indiquera à Mailchimp les informations à cataloguer dans son système.

Pour cet exemple, notre formulaire d’abonnement ne contient qu’un champ de nom et d’e-mail. Cela signifie que nous n’inclurons que ces informations dans la section Mappage des champs :

Options de mappage de champs.
Options de mappage de champs.

Enfin, naviguez vers Options supplémentaires et trouvez Messages personnalisés. Activez cette option pour fournir un message de réussite après que quelqu’un a rempli le formulaire :

Ajoutez un message de réussite pour vos utilisateurs.
Ajoutez un message de réussite pour vos utilisateurs.

Le message par défaut sera « Ce formulaire a bien été envoyé » Vous pouvez envisager de le changer pour quelque chose comme « Merci pour votre abonnement » Vous pouvez également ajouter des messages personnalisés pour les erreurs et les champs obligatoires.

Étape 5 : Ajouter le formulaire à votre site

Une fois que vous avez fini de personnaliser le formulaire, sélectionnez Publier. Pensez à utiliser vous-même le formulaire d’inscription pour vérifier qu’il fonctionne correctement. Ensuite, vous pouvez voir si la nouvelle adresse e-mail est enregistrée dans votre compte Mailchimp.

Vous pourriez également vouloir ajouter ce nouveau formulaire à plusieurs endroits de votre site web. Vous pouvez l’enregistrer en tant que Widget global pour faciliter ce processus.

Tout d’abord, trouvez l’icône Modifier le formulaire sur le côté droit du formulaire. Cliquez dessus avec le bouton droit de la souris et sélectionnez Enregistrer comme global:

Enregistrer comme Global.
Enregistrer comme Global.

Cela ajoutera le formulaire d’abonnement à vos réglages globaux. Lorsque vous ajoutez une nouvelle page ou un nouvel article, vous pouvez simplement aller dans GLOBAL, trouver le formulaire préconçu et le faire glisser et le déposer où vous le souhaitez :

Glissez et déposez le formulaire Global où vous voulez.
Glissez et déposez le formulaire Global où vous voulez.

Lorsque vous réfléchissez à l’endroit où placer vos formulaires d’abonnement sur votre site web, vous pouvez penser à la visibilité. Vous pouvez potentiellement collecter plus de prospects sur une page de destination bien conçue, que les visiteurs peuvent voir lorsqu’ils entrent sur votre site. Toutefois, les utilisateurs ne seront peut-être pas intéressés par une inscription aussi rapide.

Parfois, une meilleure option consiste à inclure des formulaires de contact dans votre contenu ou dans une colonne latérale. Bien que cela ait un peu moins de visibilité qu’une page de destination, ce placement peut permettre aux visiteurs de s’abonner pendant qu’ils interagissent avec votre site web.

L’ajout du formulaire à un pied de page peut également être une option pratique. Les utilisateurs qui défilent jusqu’au bas de votre site web sont souvent curieux de votre contenu, ce qui signifie qu’ils sont plus susceptibles de s’abonner. Toutefois, ce placement n’est pas aussi visible que les autres options.

Principaux modules pour votre intégration Elementor/Mailchimp

Avec les meilleures extensions WordPress, vous pouvez créer un site web sur mesure pour votre public. Elementor Pro vous offre de nombreuses options pour concevoir des formulaires et intégrer des services tiers comme Mailchimp.

Pourtant, vous pourriez avoir besoin de fonctionnalités plus avancées. Avec certains modules, vous pouvez avoir plus de contrôle sur l’apparence et la fonctionnalité de vos formulaires.

1. Essentials Addons

L’utilisation des Essential Addons est un excellent moyen d’étendre les fonctionnalités de base d’Elementor. Avec cet outil, vous pouvez accéder à des éléments plus créatifs. Il s’agit notamment de fonctionnalités interactives telles qu’une grille de produits Woo, un compte à rebours et une galerie filtrable :

Essential Addons.
Essential Addons.

Caractéristiques :

  • Des widgets de contenu avancés pour ajouter des calendriers d’événements, des boîtes d’information, des témoignages, etc
  • Des éléments WooCommerce tels que les galeries de produits, les grilles et les carrousels
  • Intégration avec des plateformes tierces comme Mailchimp et Ninja Forms

Lorsque vous installez Essential Addons sur votre site WordPress, vous pouvez intégrer Mailchimp en utilisant Form Styler Elements. Ici, vous pouvez simplement saisir votre clé API Mailchimp, ce qui ajoutera un widget EA Mailchimp à l’éditeur Elementor. Ensuite, vous pouvez glisser et déposer le widget sur une page et continuer à le personnaliser selon vos besoins.

Prix: Les plans d’abonnement pour Essential Addons commencent à 39,97 $ pour un site web. Il comprend plus de 70 widgets et sept extensions.

2. Happy Addons

Avec Happy Addons, vous pouvez choisir parmi plus de 400 blocs et widgets préconçus à importer dans l’éditeur Elementor. Pour accélérer le processus de création, vous pouvez définir des pré-réglages de conception.

Happy Addons permet également de copier des éléments d’un site web et de les coller dans un site avec un domaine différent :

Happy Addons for Elementor
Happy Addons.

Caractéristiques :

  • Emboîtement de sections
  • Copier-coller inter-domaines
  • plus de 400 ensembles de conception pré-établis

Après avoir saisi votre clé API Mailchimp sous Credentials dans les réglages de Happy Addons, vous pouvez utiliser Elementor pour glisser et déposer un Widget de formulaire Mailchimp sur une page.

Ensuite, vous pouvez modifier les réglages avancés de l’outil pour personnaliser les marges, les couleurs et la typographie du formulaire. Vous pouvez également redessiner les champs et les boutons pour qu’ils aient un arrière-plan, une ombre, une taille de police et un espacement uniques.

Prix: Happy Addons propose des plans d’abonnement annuels à partir de 39 $ pour un site.

3. ElementsKit

Comme les autres options de cette liste, ElementsKit est un paquet d’extensions tout-en-un avec des widgets et des extensions supplémentaires pour Elementor. Il peut offrir plus de personnalisation lors de l’édition de caractéristiques fonctionnelles telles que les en-têtes, les pieds de page ou les menus.

De plus, ElementsKit comprend un constructeur de widgets personnalisés si vous ne trouvez pas d’option qui vous convienne :

ElementsKit.
ElementsKit.

Caractéristiques :

  • Contrôles personnalisés tels que Multi Widgets, AjaxSELECT2, et Image-Picker
  • plus de 85 widgets et extensions
  • plus de 500 blocs web préconçus

Vous pouvez utiliser ElementsKit pour intégrer Elementor et Mailchimp entièrement via l’éditeur Elementor. Il vous suffit de glisser-déposer le widget Mailchimp sur une page et de définir la clé API. Ensuite, vous pouvez ajouter des champs et des icônes personnalisés à votre formulaire.

Prix: Les plans annuels pour ElementsKit commencent à 39 $ pour un site.

4. The Plus Addons

The Plus Addons se présente comme un outil Elementor conçu pour tous. Avec des modèles prêts à l’emploi et des tutoriels YouTube approfondis, même les débutants peuvent apprendre rapidement à concevoir un site web fonctionnel.

En outre, The Plus Addons est également doté de nombreux widgets qui offrent des fonctionnalités personnalisables pour les concepteurs :

The Plus Addons.
The Plus Addons.

Caractéristiques :

  • Plus de 96 widgets Elementor avancés
  • Des options de liste pour afficher les produits, les articles de blog et les galeries d’images
  • Un constructeur facile à utiliser conçu pour les types de publication personnalisés

L’outil Plus Addons offre l’une des façons les plus simples d’intégrer Elementor et Mailchimp. Depuis votre compte Mailchimp, copiez la clé API et l’ID de liste de votre audience. Ensuite, allez dans les réglages de connexion API et collez ces informations. Après cela, vous pouvez faire glisser et déposer un widget d’abonnement Mailchimp et modifier sa disposition et sa structure.

Prix: The Plus Addons dispose d’une version gratuite. Toutefois, sa sélection de plans contient plus de widgets et d’extensions. Ces forfaits commencent à 31 $ par an.

Résumé

Bien que combiner Mailchimp et Elementor puisse sembler intimidant, n’importe qui peut intégrer ces deux outils. En procédant ainsi, vous pouvez créer des formulaires d’abonnement personnalisés qui répondent à vos attentes en matière d’apparence et de fonctionnalité.

Pour récapituler, voici les cinq étapes simples pour intégrer Elementor et Mailchimp sur votre site web :

  1. Créez un compte Mailchimp.
  2. Créez une audience et une clé API.
  3. Concevez un formulaire d’inscription Mailchimp avec Elementor.
  4. Connectez Mailchimp.
  5. Ajoutez votre formulaire à votre site web.

Le marketing par e-mail et la conception sont essentiels pour le succès de votre site web. Vous voudrez également vous associer à un hébergeur dédié.

Chez Kinsta, nos plans d’hébergement (hébergement d’applications, hébergement de bases de données et hébergement WordPress infogéré) peuvent faire passer les performances de votre site au niveau supérieur. Contactez-nous pour en savoir plus !

Avez-vous des questions sur l’intégration d’Elementor et Mailchimp ? Posez-les-nous dans la section des commentaires ci-dessous !

Matteo Duò Kinsta

Rédacteur en chef chez Kinsta et consultant en marketing de contenu pour les développeurs de plugins WordPress. Connectez-vous avec Matteo sur Twitter.