Customize Form for Mailchimp

I bought a HTML template that had an email subscription form and I wanted to make it work with Mailchimp.  I wanted to keep the style of the template and not use a Mailchimp styled one.

It took some work, and I didn’t find documentation to do it, so here’s what I did:

(1) I went to my email list in Mailchimp and then Form Builder (Signup forms > Form Builder)

(2) Go to the URL provided for the form

(3) On the page that the URL takes you to (with the form), view the page source

(4) Copy these pieces of code from the source into your code:

(a) where your form should post to:

<form action="https://yoursite.us19.list-manage.com/subscribe/post" method="POST">  

    <input type="hidden" name="u" value="foo">
    <input type="hidden" name="id" value="bar">

(b) for each field that you want to capture, find the name of the field and paste it as the name into the matching fields on the form you’re updating:

<input type="email" autocapitalize="off" autocorrect="off" name="MERGE0" id="MERGE0" size="25" value="">

(c) form submission details:

<input type="hidden" name="ht" value="foobar"> <input type="hidden" name="mc_signupsource" value="hosted">

If you submit the form and it redirects you to the web form instead of subscribing you to the list, it probably means that you have a name attribute wrong on one of your fields (and when you submitted, Mailchimp didn’t know what to do with that field).

Advertisements