A Webhook is an automated HTTP request sent from one system (the source) to another (the destination) whenever a specific event occurs in the source system. When triggered, the webhook sends data about the event—called a payload—to the destination system’s URL, allowing it to receive and process the information instantly.
The QSM Webhooks add-on is designed to make it easy for administrators to send webhook data directly to other systems when specific events—like quiz submissions, results, or other key actions—occur. Instead of managing complex configurations, admins can set up webhooks straight from QSM and transfer data to any target system with just a few steps.
Installation/Setup
In case of manual setup, after purchasing the QSM Webhooks add-on, begin by downloading the plugin file to your device. To install it on your WordPress site, navigate to Plugins > Add New, then select Upload.
Next, upload the downloaded zip file to your site. Once installation is complete, the QSM Webhooks add-on will appear in your list of installed plugins. Simply click “Activate” to enable it.
With activation complete, you’ll also see the Webhooks tab on the QSM panel in the dashboard.
To get started, enter the license key provided with your purchase. To input your license key, go to the ‘Manage License’ tab in the Webhooks settings, which you can access through Extensions > Installed Add-ons.
Alternatively, there’s a quicker way to install and activate QSM add-ons: the QSM Addon Installer. Install this helper plugin on your site where the QSM plugin is active, and it will allow you to streamline the installation process.
For a full, step-by-step guide on installing add-ons— with the QSM Addon Installer—please see our detailed documentation on How to Install Addons.
Create Webhooks in QSM
Once the add-on is installed, you can start with creating a webhook. To do so, hover over the QSM option from the dashboard side panel and click on the Webhooks.
The Webhook tab will display the list of webhooks created. You can start by adding a new webhook by clicking on the “Add New” button, a pop-up window will appear with the following fields:
- Webhook Name: Enter a clear name for your webhook.
- Webhook URL: Provide the URL of the destination system where data will be sent.
- Webhook Type: Choose how requests will be sent as POST or GET. Most providers recommend POST, but select the option best suited for your needs.
- Send Data Format: Select the format in which to send the data payload—options include JSON (commonly used), Array, Form Data, and XML.
If you choose GET as your webhook type then only “Form Data” will be available to send the data format in. However, for the POST webhook type, you get all the format options to send the data
There are three main sections in the pop-up window:
- Payload – In this section, add the data to be sent to the webhook URL. Click the Add New Field button to add data fields—either by creating custom fields or selecting from the list of available Template Fields. For added flexibility, you have the option to send data in a structured format using nested fields through the “Nested Object” option.
- HTTP Headers – In this section, set the headers key-value pairs that define the request details, such as authorization and content type. You can add as many headers as needed or leave this blank if none are required.
- Preview – This section offers a live preview of your configured data as it will appear when sent. Any changes made to settings will be reflected in real-time, allowing you to verify the setup before saving.
Once the configuration is complete, click Save to store the new webhook. It will now appear in the webhook list, showing details like Webhook Name, Type, Webhook URL, Status, and settings options. Here, you can quickly edit, delete, or toggle the webhook status between active and inactive.
Implement Webhooks through Quiz
After you’ve created a webhook, you can easily implement it on the quiz result page.
Once you’ve created a webhook using the add-on, you can easily implement it on the quiz result page.
To get started, navigate to the QSM Quizzes & Surveys tab and select an existing quiz to edit, or create a new one.
Go to the Result Page tab, where you’ll find the Assign Webhook option. From the dropdown menu, choose the webhook you want to assign. You can also set specific conditions for the result so that the webhook triggers based on the quiz outcome.
Each webhook can be applied to multiple quizzes, and it will trigger whenever the defined result conditions are met for each quiz.
Webhook Logs
After your webhook is triggered, you can review its output in the Webhook Logs. Head back to the Webhooks tab, then click on Webhook Logs to view a record of all triggered webhooks.
This log updates automatically as webhooks are triggered, showing details like the status, response code, request type, webhook URL, and a preview of the data sent.
You also have the option to delete individual logs or set logs to auto-delete after a specified number of days.
Still stuck? How can we help?
