ElementsKit now supports Mailchimp integration. With it, you can personalize your sign-up form with attractive and multiple styles.

ElemntsKit MailChimp #

Conditions préalables:

Upgrade to ElementsKit Pro to unlock the Mailchimp integration.

Step 1: Open any page or post where you want to use Mailchimp #

Aller à Elementor editor and Rechercher MailChimp

Now, you have to set the API key

Step 2: Generate Mailchimp API Key #

Aller à ElementsKit → USER SETTINGS → MAILCHIMP DATA

Step 3: Get Mailchimp API Key #

Pour obtenir la clé API Créer un compte Mailchimp et connectez-vous avec votre Nom d'utilisateur et mot de passe.

1. Allez à votre account photo
2. Click on your Account & Billing

Élargir la Extras menu and click on API keys.

Click on the button “Create A Key”.

• Set an API Key Name
• Click on the button “Generate Key”

Your key is ready.

• Copy it by clicking on the “Copy To Clipboard”
• Clique sur le “Done” bouton

Step 4: Insert the MailChimp API #

Now go back to your dashboard.

1. Go to USER SETTINGS
2. Insert MailChimp API Key
3. Enregistrez les modifications

Step 5: Customizing the MailChimp Widget #

• Go to your page where you’ve draged and dropped Widget Mailchimp
• Sélectionner Liste dans la liste déroulante

Create a Campaign: Vérifier how to create a campaign list from your Mailchimp account.

Double Opt-in: It means when someone submits their email, they get a confirmation email first. They must click the link in that email to actually join your list. Without clicking, they won’t be added.

NOTE: As the warning says — if you turn this On here, you must also enable it inside your Mailchimp audience settings, otherwise it won’t work.

Here, you add extra input fields to your signup form beyond the default ones.

When you click on a field (e.g. Adresse e-mail) to expand it, you get these options:

• Taper: What kind of input the field accepts — Email, Text, Number, etc.
• Étiquette: Heading text shown above the input box.
• Espace réservé : Faded hint text inside the empty input box, disappears when user types.
• Nom: Internal field ID — must match your Mailchimp MERGE tag exactly (e.g. email, FNAME).
• Requis: If Yes, user cannot submit the form without filling this field.
• Montrer l'icône: Shows or hides the small icon inside the field.
• Icône: Choose which icon appears inside the field.
• Position de l'icône : Sets icon placement — Before (left) or After (right) of the placeholder text.

Customize MailChimp’s form button.

• Submit Button Text: The label shown on the button. Currently set to “Sign Up.”
• Montrer l'icône: Toggles the icon on the button visible or hidden.
• Button Icons: Choose which icon appears on the button. Currently an arrow (→).
• Position de l'icône : Sets where the icon sits on the button. Before means left side, After means right side.
• Form Style: Controls the button layout. Full Width stretches the button across the entire form.
• Message de réussite : Text the user sees after successfully submitting the form. Currently “Successfully listed this email.”

To style the form, click the Style languette in the Edit MailChimp panel. Here are the available sections:

• Étiquette: You can change the color, typography and margin of the labels.
• Input Wrapper: It lets you change the column gap, row gap, icon gap, border type, color, box shadow, etc.
• Saisir: For inputs, you can show or hide the width, change typography, border radius, padding, etc.
• Bouton: Customize the submit button by changing its position, color, background type, padding, and so on.
• Icône d'entrée : Controls the icon inside input fields with your chosen color, size, background type etc.
• Success & Error Message: You can style the messages shown after form submission by changing its width, padding, margin, text color, background type and others.

After finishing your customization, view the form, fill up the form and submit it.

Step 6: Do the Final Check #

• After submitting the form, go to Mailchimp → Audience → All Contacts
• Check your contact list. Here you can verify that the submitted details like email, first name, and last name are correctly saved.