MailChimp Signup Form
Time Delay Popup
The popup window loads a MailChimp signup form after a preset time delay.
Although the modal can be closed by clicking or tapping anywhere on the overlay, there is an optional "close" button which appears at the upper right of the modal.
The background overlay can be styled for color and its opacity adjusted so that, when the modal is visible, the rest of the page content can be either blacked out, partially or fully visible.
The modal itself can by styled with a box shadow and/or a border.
In this example, the time delay is set to 3 seconds and the overlay color is set to black with 80% opacity.
The widget uses the MailChimp signup form and there is an instructional video showing how to set this up and generate the embed code.
The only part of the embed code required is the URL which will look something like this …
http://domain-name.us1.list-manage.com/subscribe/post?u=xzab34bc56ef&id=a1234b5c5dThis is pasted into the ID box in the widget settings.
Inserting The Widget
The widget should be the last item to be inserted on the page.
Once the widget has been set up and the time delay entered, open the Metrics inspector, check the "Full Width" and the "Always on top" boxes, set the height to 10px and the position Y to zero
The instructional text, the labels for "Name", "Email" and the "Subscribe" button text can be changed if a language other than the default is required.
The widget can be styled for font family, size, color and background color. It can use a web safe font or a non web safe or Google hosted font with a web safe fallback.
The name and email fields can have either an all around border or a bottom border with controls for border width and color.