Show number of subscribers from Mailchimp
Show number of subscribers from Mailchimp
Today I’ll try to show you how to get the number of subscribers from Mailchimp. I have been using Mailchimp with great success so far for 2 years now. Can’t really complain about them really. However in all honesty, I was looking today at my account and couldn’t find any type of widget-like that could be used to show how many subscribers I have, so was feeling a bit down due to this.
But, I did however remembered I played a few months ago with their API system and remembered they had a lot of options there that I can use. Checked it again and it appears that you can use the API to get the total number of subscribers. And so … here we are a little tutorial on how to do this.
For this, I used a php library made by Drew McLellan, you can easily build this yourself if you wish, but rather than making the wheel, I thought I should just make it spin.
Anyway, you can download the library from here:
https://github.com/drewm/mailchimp-api
You also have there documentation for how to use it. All in all, I really like this library.
Getting the total number of subscribers
For this, you would need to pretty much know only two things
- The api key
- The list id
The API key can be created using the option in your Mailchimp account, section Account / Extras / API Keys. You only need to create the API key and save it for later use.
The list id can only be found if you query the API for it, I don’t know any other way. So then you would use the following code for getting the list id and save it.
1 2 3 4 5 6 7 8 9 10 |
<?php require("vendor/autoload.php"); $MailChimp = new \Drewm\MailChimp('Your-API-KEY-HERE-us7'); $result = $MailChimp->call('lists/list'); foreach ($result['data'] as $list) { echo "List: " . $list['name'] . ' has id: ' . $list['id'] . "<br/>"; } ?> |
This will show you an output with your list name and its id. Save the id please as you will need it.
Then you will need to save the subscribers to a text file locally, let’s not call the API on each page refresh as it will just slow our site down.
So make the following script to dump the subscribers to a text file:
1 2 3 4 5 6 7 8 9 10 11 12 |
<?php require("vendor/autoload.php"); $MailChimp = new \Drewm\MailChimp('Your-API-KEY-HERE-us7'); $result = $MailChimp->call('lists/members', array( 'id' => 'YOUR-LIST-ID-HERE', 'status' => 'subscribed' )); $file = 'subscribers.txt'; file_put_contents($file, $result['total']); ?> |
With the url to this second code I recommend setting a cronjob, like twice a day for collecting subscribers. I use a twice per day option and used cPanel to create the cronjob. The Cronjob command I use is:
1 |
/usr/bin/lynx --dump http://yourhowto.net/get_total_subscribers.php > /dev/null 2>&1 |
Update it to match the url to your site!
An thats all, you can now use the content in your subscribers.txt file to show them to your users.
The frontend side …
So far you’ve done the collection of subscribers data from Mailchimp, now we need to show it to our users.
I use a code like bellow personally, but you can use almost any other code you wish, your mind is the limit, design it however you like.
1 2 3 4 5 6 7 8 9 |
<div class="text-center"> <div align="center" id="subscribers_list"> <span class="badge_subs"></span> <span class="desc"> subscribers</span> </div> <div class="poweredby"> powered by <span class="gray">MailChimp</span> </div> </div> |
And some CSS style:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
span.desc { font-weight: bold; } .poweredby { display: inline-block; padding: 3px 5px; font-size: xx-small; } .gray { color: #999; } span.badge_subs { display: inline-block; padding: 2px 4px; font-size: 11.844px; font-weight: bold; line-height: 14px; color: #ffffff; vertical-align: baseline; white-space: nowrap; text-shadow: 0 -1px 0 rgba(0,0,0,0.25); background-color: #3AA1E5; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } div#subscribers_list { width: auto; margin: 0 auto; color: #fff; background: #136FBE; display: inline-block; padding: 3px 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } |
I’m using a bootstrap based theme so some of the css classes like .text-center would be automatically included by it and I’m using them.
What is next, please add to your footer page or javascript file a code similar to:
1 2 3 4 5 |
jQuery(document).ready(function ($) { $.get("http://www.yourhowto.net/subscribers.txt", function ( data ) { $(".badge_subs").text(data); }); }) |
And that’s about it really, its really your choice how you pull out the data from the subscribers.txt file and show it to your users, but since I’m using cached / static pages for my site, it is best to rely on ajax to pull this data.
You can see a demo of this just in the right side in my sidebar. Its pretty shiny looking there 🙂
If you have further questions, please comment below.
Cheers!