Website Subscription Widget

There are two types of webform widgets you can use to collect contacts for your email marketing campaigns (click links below to go to the type you want to use).

Embedded Widgets
Pop-In Widgets

Embed Widgets:

The newsletter widget for you website is a great way to build your newsletter subscription base and create a solid lead funnel. The system allows you to create both an embedded newsletter form or Pop In widget.

To get started, first log in to your account and go to the email marketing tool. Once there, click "Contacts" and then "Form Builder." From here you can either create a new widget or you can scroll down to edit widgets you've created in the past.

The form builder will walk you step-by-step through building your form.

Notes: 

The builder allows you to have a success page be created through the system or have the page redirect to a page you've created (great for creating gateways to pages you want a sign-up before giving access to).

Once you are done creating your widget the way you want, click next.

You'll create your opt-in email, and your confirmation page, as well as select what contact list you want new contacts to be sent to from this form.

For the embedded widget you'll just put the code in as HTML wherever you want your form to show up, and the script code in the header of your site. The code will be found when you click "View Code" at the bottom of the form builder page. It should look similar to this (Note, do not copy and paste this - you need to copy the code specific for your account and add it.

Pop-In:

With the pop-in you can select if you want it to come in via a button, link, event, or timer. Once you've walked through the steps, you'll come to your code for the widget. Here you'll have 2 pieces of code dependent on how you want your pop-in to come in. Here is an example of a pop-in based on a button.

If you'd like the pop-in to be time based, you'll grab the code in the first section and input it into the head of your site just like you did for the button implementation, but this time, do not copy the 2nd iframe code:

Just below that, copy and paste the following code batch into the head of the site.

<script>
// Set widget cookie
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
document.cookie = cname + "=" + cvalue + ";expires="+d.toUTCString() + ";path=/";
}
// Get widget cookie
function getCookie(name) {
return document.cookie.match(RegExp('(?:^|;\\s*)' + name + '=([^;]*)'));
}
setTimeout(function(){
if (!getCookie('mjPopinShown')) {
 const popIn = document.querySelector('[data-w-type="pop-in"]')
if (popIn && typeof mjOpenPopin !== "undefined") {
setCookie("mjPopinShown", true, 1);
 // Or use the data-w-token of your pop-in iframe or trigger directly.
mjOpenPopin(popIn.attributes?.['data-w-token']?.value);
}  
}
}, 10000);
</script>

Save your code and you are good to go.