How to integrate Mailmunch with Feedburner

I used to rely on Feedburner to deliver daily email digests to my subscribers. But their opt-in form is very limited in terms of design, and I couldn’t find the right code to turn it into a popover that’s responsive and non-invasive (‘cos don’t we all hate popups?).

Then I saw this pretty form from other blogs and immediately signed up to get one too.

I joined Mailmunch mainly because their form is pretty, responsive, and has flexible display options.

But just recently, I discovered that while I’m getting a bunch of email subscribers, I couldn’t do anything with them. I couldn’t send email blasts and updates. I can only stare at the list, and maybe manually add them to my Feedburner list. I wanted to sync the list to my Feedburner subscriber base so they could receive regular digests as well, but there is no straightforward option.

As of writing, Mailmunch doesn’t have any option to integrate with Feedburner yet. But after googling about it, I stumbled upon this tutorial that shows you how to integrate the Feedburner opt-in form to the Mailmunch popover.

The result is successful!

Now, everyone who subscribes to this form will now be part of my Feedburner list. They will not appear in my Mailmunch list though, but they can finally receive blog updates to their email addresses. Yay!

If you want the same results, read on!

Prerequisites

1. Feedburner account with active Email Subscriptions

2. Mailmunch popover that is active on your blog/site

3. UNDERSTANDING that this is not an official integration, but more of a hack where you can use the Mailmunch popover to display your Feedburner opt-in form instead. In the future, we’d like the two to team up to provide this feature. But until that happens, this should serve as a good trick.

Steps

1. Login to Mailmunch and edit your form

2. Navigate to Fields and select Custom HTML under Choose Layout

3. Paste the following code into the HTML field, and make sure to replace YourFeedburnerID with… well, your Feedburner ID hehe

<form style="padding:3px;
             text-align:center;" 
      action="https://feedburner.google.com/fb/a/mailverify" 
      method="post" 
      target="popupwindow" 
      onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=YourFeedburnerID', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
  <input type="text" 
         style="display: block;
                border: 1px solid #ccc;
                color: rgba(0,0,0,0.75);
                font-size: 14px;
                font-weight: normal;
                font-family: inherit;
                padding: 8px;
                height: 37px;
                width: 100%;
                margin-top:-10px;
                margin-bottom: 15px;" 
         name="email" 
         placeholder="Enter your email"/>
  <input type="hidden" value="YourFeedburnerID" name="uri"/>
  <input type="hidden" name="loc" value="en_US"/>
  <input type="submit" 
         style="min-width: 30%;
                padding: 10px 20px;
                margin: 0 auto;
                border: 0;
                -moz-border-radius: 3px;
                -webkit-border-radius: 3px;
                border-radius: 3px;
                font-weight: normal;
                display: block;
                width: auto;
                height: 55px;
                font-size: 14px;
                text-align: center;
                max-width: 100%;
                overflow: hidden;
                text-overflow: ellipsis;
                color: #000000;
       background-color: #faae1e;"
         value="Subscribe" />
  <p style="font-size:12px; 
            color: #333;
            margin-top:10px;
            text-align:left">
    Delivered by <a href="https://feedburner.google.com" target="_blank">FeedBurner</a></br>
    Promise, no spam! You may unsubscribe anytime.
  </p>
</form>

<style type="text/css">
  .foot-note{
   display:none;
  }
  a:active, a:link{
   color:#d6464f;
   text-decoration: none;
  }
  a:hover{
   color: #368fe2;
  }
</style>

I have customized the code to reflect the original style of the Mailmunch opt-in form.

4. Save and publish, and you’re done!

I hope this works for you as it did with me. If you have any questions, feel free to ask by commenting, I’ll do my best to answer! 🙂 If you want to see the form live: on the navigation bar above, hover on Follow, and click Subscribe, the form should appear. 😀

How to integrate Mailmunch with Feedburner

Share this: