How to integrate mailerlite into your bubble.io application

Integrate mailerlite with bubble.io

E-Mail marketing is still a very important marketing activity. Even though the importance, especially European-based companies struggle how to handle the confidential personal information in order to be compliant with the GDPR. Mailerlite is a European-based company that fills that gap. They offer a brilliant service, handy features, and guarantee to be GDPR-compliant. Unfortunately, there is no plug-in yet existing that lets you integrate your mailerlite account within your bubble.io application. Until now! As we are using mailerlite and Bubble.io for ourselves, we decided to build it ourselves. This tutorial shows you exactly what to do. For free and in less than 5 minutes.

Enjoy!

Features of the Mailerlite plugin – powered by the Biberei

This plug-in allows you to do the following actions:

  1. Show all subscribers
  2. Show all groups
  3. Show all subscribers within a group
  4. Show a specific group based on a name
  5. Add subscribers
  6. Add subscribers to a specific group

If you need more features, just let us know. We are happy to make this plug-in even more valuable to you.

Step-by-Step instructions to use the mailerlite plug-in with your Bubble.io application

Start the countdown – it only takes 5 minutes. Please make sure that you already have a bubble.io application and a mailerlite account. This won’t be part of this tutorial.

1. Install the mailerlite plugin – powered by the biberei

You can either search in the plug-in section within your bubble.io application or just click this link. Make sure that you install the plug-in from the .

2. Enter the API-Key

The authentication is fairly easy. You just need to enter your API keys once, so that your bubble.io application is allowed to have access to your mailerlite account. You can find your API-Key on the settings page if you click on „Integrations“. On this page, you will not only find the API key, but also the groups you have created in mailerlite as well as the Group-IDs.

Please copy this API-Key and paste it in the API-Key section within the plug-in

Mailerlite API key and subscriber groups
Mailerlite API key and subscriber groups
API key within bubble.io application
API key within bubble.io application

3. Show all Subscribers

Once you set everything correctly, you are now able to retrieve the data from your mailerlite account into your bubble.io application. We start with listing all subscribers.

Create a page and a repeating group. You name the repeating group as you like. There are two important aspects when you create the repeating group.

The type of content must be All Subscribers (Mailerlite) and the data source must be „Get data from an external API“.

Choose the content type "All Subscriber (Mailerlite)" in bubble.io
Choose the content type „All Subscriber (Mailerlite)“ in bubble.io

When choose „Get data from external API“ please choose the option „All Subscribers“.

Choose the external API to get data for all subscribers
Choose the external API to get data for all subscribers

Once you did that, you can now work with the repeating groups as you are used to it. For example, you can now show the ID, name, e-mail, or created date of the subscribers.

Choose text field and show the subscribers data.
Choose the text field and show the subscribers‘ data.

4. Show all groups

In order to show all groups, you almost do the same steps as in the previous explanation. Create a page with a repeating group. But this time you will need to have the type of content „All Group (MailerLite)“ with the Data Source (All Groups).

Repeating group settings to show all mailerlite groups in bubble.io
Repeating group settings to show all mailerlite groups in bubble.io

5. Show all subscribers within a group

The next functionality becomes handy if you want to filter subscribers based on the belonging group. In order to do this, you would need some kind of filter element where the user can choose the actual group. For this case, a drop-down field could be a good case.

Create a dynamic drop-down field that uses the external data from the API as a choice source. Please find below a picture that shows all required settings.

Drop-Down settings in Bubble.io to show all mailerlite groups
Drop-Down settings in Bubble.io to show all mailerlite groups

You have now two choices. You can either set the data source of the repeating group in the repeating group with a reference to the drop-down field, or you use a workflow to do this. This depends on your use case and personal preference. The two pictures below show both variants.

Use the data source of the repeating group
Use the data source of the repeating group
Display a list in repeating group within  a workflow
Display a list in a repeating group within a workflow

6. Add subscribers

So far we only retrieved data from our mailerlite account. In the next step, we will add new subscribers to our account. This functionality is by far the most exciting one. You will probably use this function if you want to allow users to subscribe for newsletters or other email campaigns.

You will need at least one input field where the user can insert its email address. When adding a new subscriber, the additional field of „name“ can also be used. However, this is an optional field. When pressing the send button (or however you want to call it) the action „New Subscriber“ has to be called. Go to „Plugins“ and choose the right action call.

Choose Plug-in Workflow "New Subscriber"
Choose Plug-in Workflow „New Subscriber“

After that, the input parameters can be chosen. In our case, an email (mandatory) and a name (optional) are possible input parameters. Choose the right input field to read the value which is entered by the user.

Input parameters to create a new subscriber in mailerlite
Input parameters to create a new subscriber in mailerlite

7. Add subscribers to a specific group

In certain situations, you want to organize your subscribers within groups. You can do this manually in your subscriber management within mailerlite. If you don’t want to do that, you can also organize the subscribers into the right group while creating it. This becomes handy if you want to manage several subscribers within one account. For example one for newsletters and one for a waiting list.

To add subscribers to a specific group, you will also need at least one input field where the user can the e-mail address. Once the user clicks on the button, the action call „New subscribers to a group“ has to be called. In this workflow you will need to give the ID of the group as an input parameter. You can either do this directly and look up the ID beforehand (for example in the mailerlite settings or in the repeating group where you show all groups). If you have no clue about the ID, created a way to look it up first with the group name.

Add subscriber to a specific group
Add subscriber to a specific group

In this scenario we do not enter a group ID, we are calling another API that searches a group by name. The result of this will deliver the right ID. Be aware that the name which you are entering must be the EXACT name as shown in mailerlite. Therefore, we do recommend using the ID right away. Whenever you are changing the group name in mailerlite you would need to change in this workflow as well.

8. Enjoy

I hope you liked this tutorial, and you were able to integrate mailerlite with your bubble.io application. If you are looking for more tutorials, please check out our YouTube channel and make sure that you are subscribed.

https://www.youtube.com/channel/UCNc6S5lrR75bsKSkcstt8Xw