A Much Requested Solution Is Here!
Use Mailchimp Groups with Bloom Opt-In Plugin
After we released our tutorial on how to add Mailchimp groups to the Divi Option module, we had a lot of requests for how to do this with Bloom. Oddly enough, there are no tutorials on this subject and no documentation from Elegant Themes, so I decided to make a quick video and show you guys how to do this. It’s not super clear out of the box how to do this, and many people said it’s impossible, but once you see how I figured it out you will think it is easy. Alright, lets show you how to add Mailchimp groups to the Bloom Opt-In plugin by Elegant Themes!
Why Add Groups?
Groups let you categorize subscribers by things like interests and preferences. Your Bloom Opt-In subscribers can select Mailchimp groups for themselves, or you can put subscribers into groups without them knowing.
Groups are an easy way to add segmentation and personalization to your email subscriber list. This allows you to send emails to specific audiences who have specific interests, ultimately leading to a much higher conversion rate.
Step 1
In your Mailchimp account, go to “Audience”. Once you get to the Lists page, decide which list you want to add groups to and select it. Click on “View Contacts.”
Step 2
Under “Manage Contacts” and click on “Groups.” Then click the button to “Create Groups.”
Next, you will see a question, “How should we show group options on your signup form?” Go ahead and leave the first option selected since this will work best and is the option I’m going to be using in this tutorial.
First, enter a name for the group category.
Under the category, enter at least one group name. Three come up by default, but you can add or remove them.
Hit the save button.
Step 3
Before we jump into Bloom, we need to double-check on something to verify the fields are showing correctly and to help you understand what’s going on here.
Once again in the audience menu, click on “Signup Forms.” Select the first one called “Form Builder.” Here you will see your form with the fields you chose in step 2 and the groups from step 3.
You will notice the group fields are visible by default. That is very important, and the MUST BE VISIBLE here in Mailchimp (we will hide this later with CSS on your website).
Step 4
Go to your website and go to Bloom>Email Accounts. The reason you are going here first is so that you can refresh your connection between Mailchimp and your website since you have added the group in Mailchimp.
Step 5
If you haven’t already, create a new popup style option in Bloom. The most important part here is adding the custom fields. So first of all, go into the optin design settings and toggle on the button to enable “Custom Fields.”
Create a new custom field. In the “Field” dropdown, choose the group category that we set up in step 2.
Also be sure to select and check the box beside the “Options,” since this is the actual Mailchimp group and it needs to be selected so that subscribers are automatically added to the group.
Step 6
Now once you finish up the other design settings for your Bloom opt-in, we are ready to go! Let’s go take a look and see if the custom field shows up.
Step 7
Now let’s hide the custom field, since it is not necessary for the user to see that and could lead to confusion. We don’t want them unchecking the box, and we don’t really need them to know what group they are in. It also looks bad. So let’s get rid of it with some CSS. Copy and paste the following snippet into your Divi>Theme Options>Custom CSS Box.
So then here you can see the CSS removed the custom field Mailchimp group.
Step 8
As a final step, go back to Mailchimp and confirm everything is working. Submit a test subscriber with the Bloom popup form, and then after a minute or two it will show up perfectly in your Mailchimp audience. To double check the group feature is working (which is the point of this tutorial), go to “Groups” and you will see the test email address. That’s it, you’re all set!
Hi Nelson, great tutorial!
One quick question – as this works perfectly is there a way to not disturb how to form look in mobile view as the Custom Hidden form takes a half of the pop up screen.
So it looks really not professional.
Hi Pawel, thanks so much! Sounds like you missed adding the CSS snippet to hide that custom field. Try that and you should be good 🙂
Hi Nelson, i didn’t unfortunately.
I will try to replicate the situation an show it to you.
But long story short, while the block is display:none – the email address field is shortened like on your screen
Desktop view could be OK with that, but when you display it on mobile – it is a disaster.
So is there a way to have the fields hidden and the correct layout – pre-fielding ? 🙂
So, does this put this information next to the person’s name under the Tag column? That’s what I’m confused about. If “Tag” is available under a column, why use Groups? And what if you just want the subscriber to come in with a particular “Tag” assigned to them?
Hi Tracy,
Historically, their was no support for Tags, and groups are the only method of any segmentation. However, if you have found some way to use Tags, please share 🙂
Interesting. So it’s not in Divi, but when I’ve used the Mailchimp for WordPress Plugin (MC4WP) on other sites, it is hard-coded into the setup that you can assign a tag. I wish I could figure out how to do it with Divi!
I wish too, but don’t waste your time trying – the reason I made this tutorial was because it’s the only solution know to mankind to get any sort of segmentation. 🙂
Thank you for this tutorial. 1. Everything worked up until actually being added to my mailchimp group or audience. When I tried the optin with a less-used email address of mine, it responded that an error occured with both attempts. Then I tried with my main email address which was accepted as subscribed. However, it is not on my Mailchimp list. 2. These is a bit of CSS code in the Theme Option area that solved a problem from years ago. I don’t actually know if I still need it, but nervous to delete it. Can I simply add the… Read more »
Hi Claudio, Just an FYI, you can test signups by putting +1 and +2 and +3 etc after your name in your email. Unlimited fun! So just use claudio+1@claudiaklann.com etc. Anyhow, I’m not really sure, this tutorial is more for the Divi/Bloom connection rather than troubleshooting Mailchimp. Often it takes a few minutes for it to sync. Now sure if you have any luck now or not. As for the CSS, my snippet will remove the custom fields, so if your other forms have those custom fields like in this tutorial then yes, it will hide them everywhere. As for… Read more »
Hola Nelson, que tal? espero me puedas ayudar. Seguí tus pasos al pie de la letra y funcionó perfecto. Ahora bien, yo solía agregar un campo para que los suscriptores aceptaran las políticas de privacidad y también queda oculto con ese código… Como podría ajustar el código para que no me ocultara ese campo?
Hi Melanie,
I would have to see your site to inspect the code, without the snippet added. You can share that if you still need help with this!
Does this update a excising subscriber on mailchimp or does it “only” add new ones?
If he subscriber are on other groups in the same mailchimp list but not on this specific group for this pop up
Hi Rebecca, that type of thing is set in Mailchimp. You can set your groups to update previous subscribers.
Nice post Nelson. I’ve done this successfully, however, it appears that it only add’s new subscribers. If I have a test subscriber that is in another group, it doesn’t seem to update that subscriber. Am I missing something here? Would appreciate your thoughts on this.
Hi Tom, I just tested it on my site and it auto updates. I don’t remember if there is a Mailchimp setting or not, but it works for me!