Usabilla for Websites gives you great flexibility, especially when it comes down to the targeting of a Usabilla Campaign. One way of triggering a Usabilla Campaign is by using a Manual Trigger. A Manual Trigger allows you to trigger a campaign by initiating a Usabilla JavaScript API Command.
While you could use this to trigger a Campaign based on the click of a button or based on an event on your web page you could also use to trigger a campaign after a video has ended. A great use case for this is when you want to ask users for feedback regarding the video that they just watched.
First, we'll need to create a campaign that uses a Manual Trigger. In another article in our Support Center we outline the steps for creating a campaign that triggers using a manual trigger.
When you create your campaign you need to make sure you have set the manual trigger command "vjsEnded". By doing so your Campaign will only trigger when the following JavaScript API command is initiated:
window.usabilla_live('trigger', 'vjsEnded');Next, we'll need to add some JavaScript to your web page that interacts with your HTML5 video. To make it a little easier for you, we've already made the script that shows the full example. In the Github Gist below you'll find an example that includes both the implementing of the HTML5 video, as well as the setup for the manual trigger.
The script uses the HTML5 Video API to check for the event that is executed when the video has ended. More information about this can be found in the MDN web docs.
Using that event the script sends out a manual trigger to Usabilla which in turn will trigger the campaign. Prerequisite for implementing this is that your video is located on the same web page as where you have Usabilla implemented and that the video is played using HTML5 video player.
Note: The implementation explained in this article does not work with Youtube. If you want to trigger a Campaign after a Youtube video has ended you'll need to use the Youtube iFrame Player API.