How to send surveys from a web page - using javascript and webhooks

How to send surveys from a web page - using javascript and webhooks

You might have a requirement to send an NPS survey directly from an action on your website or software platform.
A few examples are when you need to:
  1. Send an email survey if a user clicks on a button on your website
  2. Send an email survey if a customer completes a step in your e-commerce checkout
  3. Link your software to SightMill even if your software does not support webhook APIs
  4. Send an email survey if any event happens on your website
One of the best ways to achieve any of these actions is to use link your website with SightMill using our webhooks API and calling this API from your website using some simple javascript. Here's how to accomplish this:

Both examples below need your project's unique webhook for incoming data - you will find this in the Settings/Webhooks menu and it's the first field.
  1. Toggle on the feature (first toggle switch at the top of the menu screen)
  2. Select and copy your unique webhooks link that is displayed in the Email Survey field
  3. (If you want to store any incoming email survey requests as new contacts in SightMill - so you can then send them regular surveys in the future - switch on the 'Store Email Webhooks Data' toggle.

Example 1:
Send an email NPS survey from your website using javascript
A simple first example calls the webhook using javascript that you can copy and paste into your web page
  1. <script type='text/javascript'>
  2. var data = {
  3. 'email': 'sc@test.com', //mandatory field replace email address with your variable
  4. 'firstname': 'Simon', //optional field replace Simon with your variable
  5. 'lastname': 'Smith', //optional field replace Smith with your variable
  6. 'tags': 'first-tag', //optional field replace first-tag with your variable
  7. 'segment': 'gold', //optional field replace gold with your variable
  8. 'id': 'sc@test.com' //mandatory field replace email address with your variable
  9. };
  10. var xhr = new XMLHttpRequest();
  11. xhr.open('POST', 'https://sightmill.com/hooks/XXXXX/survey/email');    //replce https link between double quotes with your unique webhook link from the first field in the Webhooks menu
  12. xhr.send(JSON.stringify(data));
  13. </script>
The data that is used to complete the email survey is in lines 3-8 above - we've included example text, but you should replace this with the variables from your software that includes this information for the user.

Example 2:
Send an email NPS survey if a user clicks on a button on your website
Paste the following javascript into your webpage.
  1. <script type='text/javascript'>
  2. function postDataToWebhook(){
  3. //url to your webhook which is the top field in the Webhooks menu
  4. var webHookUrl="https://sightmill.com/hooks/XXXXX/survey/email";   //replace the link between double quotes with your unique webhooks address
  5. var oReq = new XMLHttpRequest();
  6. var myJSONStr = payload={
  7. 'email': 'sc@test.com', //mandatory field replace email address with your variable
  8. 'firstname': 'Simon', //optional field replace Simon with your variable
  9. 'lastname': 'Smith', //optional field replace Smith with your variable
  10. 'tags': 'first-tag', //optional field replace first-tag with your variable
  11. 'segment': 'gold', //optional field replace gold with your variable
  12. 'id': 'sc@test.com' //mandatory field replace email address with your variable
  13. };

  15. document.write(myJSONStr);
  16. oReq.addEventListener("load", reqListener);
  17. oReq.open("POST", webHookUrl,true);
  18. oReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  19. oReq.send(JSON.stringify(myJSONStr));
  20. }

  22. function reqListener () {
  23. console.log(this.responseText);
  24. }
  25. </script>
You should populate the data with variables from your website - for example, if you are using Wordpress, add the user's email address wiith Wordpress' user information variables.

To send out the email survey, you need to call the new function created above, which you can do either add it to an event (such as a button click) or use another small script:
  1. <script type='text/javascript'>
  2. postDataToWebhook();
  3. </script>


    • Related Articles

    • How to use webhooks to trigger SightMill to send an email survey

      You can link your CRM or application directly to SightMill so that an email survey is sent by SightMill when triggered directly from your application. This is a great way to send an email survey after, for example, a customer service call or when a ...

    • How do webhooks work in practice?

      Let's take an example of integrating SightMill with Salesforce CRM so that SightMill will generate and send out an NPS email survey when you change your contact settings in Salesforce to show the contact has bought your product. (Note: to send ...

    • What is the webhook format?

      Our webhook API is a simple, industry-standard method of linking different systems together to let you send out an NPS survey in response to an event on a different system. For example, you could: Link your helpdesk system to SightMill using webhooks ...

    • How to integrate with Zendesk

      It's easy to connect Zendesk to SightMill - which automates the process of sending email surveys. There's no coding and it uses the webhooks API that will take you just a few minutes to start sending email surveys in response to a trigger in Zendesk ...

    • Does SightMill have an API?

      Yes, we support an API concept called webhooks. Webhooks are an industry-standard, lightweight technology used to pass data between platforms in response to events. As more and more applications use real-time information and events, webhooks are ...