Prerequisite You should have basic knowledge of JavaScript and your website should be hosted on a platform like Vercel to load the library via a CDN.

​
Step 1.

Embed the Saypien JavaScript Library in your website.

​
Step 2.

Add the JavaScript file to the <HEAD> section of your HTML file:

​
Step 3.

Initialize the library with a configuration:

​
Step 4.

Add a button that will trigger the overlay:

The Saypien JavaScript Library is now integrated into your website, and you can customize it as needed.

​
Configuration Options

The library can be configured with the following options:

  • buttonId (Optional): The ID of the button that triggers the event listener. Set this to null if no button is used and the overlay should appear directly when the page loads.
  • surveyId (Required): The survey ID used for the iFrame URL.
  • onComplete (Optional): Callback function to be executed when the survey is completed.
  • onClose (Optional): Callback function to be executed when the close button is clicked.
  • onOpen (Optional): Callback function to be executed when the overlay is opened.
  • onStart (Optional): Callback function to be executed when the survey is started.

​
Example Configuration

Here is an example of a typical configuration:

​
Troubleshooting

Here’s how to solve some common problems when integrating the Saypien JavaScript Library.