LQ Widget for Verizon Business
Easy to plugin widget that can be integrated in any consuming application to engage customer to check Internet Availability for business. The following documentation provides various ways this widget can be added.
1. Emit a Custom Event
This is a recommended approach for pages constructed using AEM and also if the consuming application wants to keep the widget code out of their source package. Insert the following code in the head of your index.html

<script type="text/javascript" src="https://www.verizon.com/foryoursmallbiz/lqwidget/business-lq-widget.js" ></script>

Insert a placeholder div Element with attribute id="internet-lq-widget" for the modal to load on your page and

<div id="internet-lq-widget" style="display: inline-block" ></div>

Emit a custom Event as below from your code on button / link click ( Or could be any User action)

window.dispatchEvent((new CustomEvent('showlqwidget')));

Try Now


2. Use as a Webcomponent
This is a recommended approach for pages constructed using AEM and also if the consuming application wants to keep the widget code out of their source package. Insert the following code in the head of your index.html

<script type="text/javascript" src="https://www.verizon.com/foryoursmallbiz/lqwidget/business-lq-widget.js" ></script>

Use the Custom Web Component that we provide in your application (HTML / React / Angular / Vue) . You must provide a custom attribute type as shown below. It takes either "button" or "link" as values.

<internet-lq-widget type="button" size="small" > </internet-lq-widget>

Try Now

2. Use as a Form

<script type="text/javascript" src="https://www.verizon.com/foryoursmallbiz/lqwidget/business-lq-widget.js" ></script>

<internet-lq-widget type="form" > </internet-lq-widget>