When you create a list in MailChimp, we automatically generate acustomizable signup form for that list. In addition to this full form we host for you, we also provide mobile responsive code for small forms that you can embed on your website. Below we'll walk you through each of our form options and how to add them to your site.
Contents
- Add the Embed Form to your website
- Embed Form options
- About HTTPS forms
- Add the full form to your website
- Troubleshooting the embed form
- Add form to a third party website
Add Embed Form to your website
- Navigate to the Lists page.
- Click on the list drop down menu and select Signup forms.
- Click the Select button under the Embedded forms option.
- Select a form style: Classic Form, Super Slim Form, or Naked Form to generate the embed code for your form.
- Copy all text in the Copy/paste onto your site box.
- Paste the code into the appropriate location on your website.
Embed Form options
Super Slim Form
A simple form with only an email address field. You can only change the title and width of the Super Slim form. If you have required fields other than email address in your list or would like more customization for your form, check out one of the other form options below.
Classic Form
A more robust form with additional customizable options:
- Show and specify the title for the embed form.
- Toggle between showing only required fields and showing all visible fields for your list.
- Show or hide groups on your embed form.
- Show or hide the indicator for required fields.
- Specify a width for your form; default will expand to fit the area where the form code is placed.
- Additional options to Enhance your form include: turning on evil popup mode, disabling JavaScript for the form, including an archive link to view past campaigns sent to the list, and including a MonkeyRewards link. Click the i icon next to an option to see additional information.
If you enable evil popup mode - when your visitors go to your website, your site waits for a certain amount of seconds (that you set) and then greys out your site in the background to display a popup signup form. Some people find those forms really helpful. Some find them really annoying.
The cookie we use to note that the evil pop up mode has already popped up should also prevent the popup from being displayed again and again on the site regardless of the page your visitors are on within your website. If you have the ability or the resources, you are welcome to download the JavaScript code we're providing (the included xs-js one is what you need) and modify the behavior however you wish.
Some decent JavaScript skills will be required to take care of that modification as it's proprietary code for your own site.
Naked Form
Similar to the Classic Form, but with no CSS or JavaScript, allowing greater control and flexibility. Customizable options:
- Show and specify the title for the embed form.
- Toggle between showing only required fields and showing all visible fields for your list.
- Show or hide groups on your embed form.
- Show or hide the indicator for required fields.
- Specify a width for your form; default will expand to fit the area where the form code is place.
- Additional options to Enhance your form include adding an archive link to view past campaigns sent to the list and including a MonkeyRewards link. Click the iicon next to an option to see additional information.
About HTTPS forms
There is not an HTTPS version of MailChimp's signup form embed code. An HTTPS signup form requires an SSL security certificate hosted on your site to handle encryption. A signup form using an SSL certificate will submit subscriber information with 128 bit encryption, the same encryption level Amazon and other major online retailers use for transactions.
Since the encryption is hosted on your site, the default collection process provided by MailChimp must be bypassed to maintain a secure connection. The embedded form must submit to scripts within your website domain to hand data off to MailChimp via an API connection.
If the proper API calls aren't set up on your website, a security warning may appear in the web browser when someone submits their subscription through the embedded form.
To ensure subscribers don't see a security warning, have a developer take a look at our API documentation to see how to make the appropriate API calls on your site.
Add the full form to your website
If you prefer to add the full form that you've created and designed instead of our smaller embed code forms, here's how:
- Navigate to the Lists page.
- Click on the list drop down menu and select Signup forms.
- Click the General forms option.
- Copy the Signup form URL.
- Open a new web browser window or tab.
- Paste the Signup form URL into the browser address bar and press the enter key on your computer's keyboard.
- After your form loads, right-click the page and select your browser's page sourceoption.
- Copy/paste this code into your website.
Even though you've added the full form on your own website, once people click the submit button they'll be directed to the MailChimp hosted Thank You page. If you'd rather keep people on your site, you can set the Thank You page to redirect to your website.
Troubleshooting the embed form
If you'd like to have more than one MailChimp signup form on a single page, only one of the forms should utilize JavaScript. Our hosted signup form as well as ourClassic Form embed code use a bit of JavaScript for validation purposes. If there are two forms that utilize JavaScript on a single page, the forms may not validate or submit information as expected. If you're an experienced coder or have one at your disposal, you might also consider placing one of your forms in an iFrame to help prevent validation conflicts.
Our Super Slim and Naked forms don't include JavaScript by default so they can be used in combination with a form that does. Our Classic Form embed code can also be created without JavaScript! Click here for additional details on each of of our embed code form options.
It may also be beneficial to look into using Groups within your list instead. Rather than creating multiple lists and forms, you can create a single list that uses groups. Take a look at this article for information on how to create groups in your MailChimp list.
Add form to a third party website
MailChimp signup forms can be added to third party website platforms. Check the list below for some common third party website providers you can add MailChimp forms to. If you use another platform, be sure to check your website provider's support page for guidance.
0 comments:
Post a Comment