Popup Form Widget Installation

After completing the Installation step, add the following HTML in your site. Once published the Viral Loops form widget will appear there.

<form-widget mode='popup' ></form-widget>;

If you install multiple campaigns on the same page don't forget to include the ucid property on the widget

<form-widget ucid='YOUR_CAMPAIGN_ID' mode='popup' ></form-widget>;

If you'd like to have custom button to trigger the popup add the following attribute on the form widget:

<form-widget mode='popup'  component="customButton"></form-widget>

And add the class .vrlps-trigger on the buttons that should trigger the popup:

<button type="button" class="vrlps-trigger"> Trigger </button>

Alternatively, you can use the SDK to open the popup programmatically:

ViralLoops.getCampaign().then((campaign) => {
  campaign.customButtonTrigger();
});

The programmatic approach is more suitable for scenarios where dynamic rendering is involved (Single Page Applications, island architecture, etc).