How to use Syntage's Widget
What is this widget script?
This project is responsible for including the registry in third-party applications.
Using the script widget
To use the widget it is necessary to include our JS in your application.
The basic configuration for adding the widget is the script below.
Add the script below to your application:
<script
async
id="satws-widget-id"
type="text/javascript"
src="SCRIPT_URL"
data-key="COMPANY_SLUG"
></script>
To start the registration you must run the command below:
window.Satws.init();
To terminate the widget, run:
window.Satws.destroy();
Widget Information
You can get the SCRIPT_URL and COMPANY_SLUG from the dashboard at:
Account > Widget > Widget script
In the widget screen you can customize the widget.
Test environment
For people to see the "sandbox" warning they would have to pass this parameter. This does not interfere with the operation, only the token makes this enter production and sandbox rule. It's just a warning. The script with this parameter will look like this:
<script
async
id="satws-widget-id"
type="text/javascript"
src="SCRIPT_URL"
data-key="COMPANY_SLUG"
data-sandbox="true"
></script>
Events (experimental)
Event | Description |
---|---|
registerWithSuccess | Fired when the integration was successful. |
errorOnRegister | Fired when there was an error sending user data. |
Using the events
To use events we must use window.Satws.subscribe
to subscribe to widget events.
Example:
registerWithSuccess:
window.Satws.subscribe("registerWithSuccess", () => {
// your code here
});
errorOnRegister:
window.Satws.subscribe("errorOnRegister", () => {
// your code here
});
Tips
Using dynamic loading in SPA's or GTM it can happen that when executing the Widget codes it is not ready yet, to get around this type of problem we can use the code below:
try {
window.Satws.init();
} catch {
// This event is listening for the `widgetScriptLoaded` event to be fired
window.addEventListener("widgetScriptLoaded", (e) => {
window.Satws.init();
});
}
Updated 5 months ago