OM Documentation Extending

How to Show a Campaign After Video Has Ended

You can easily show a campaign after video play using a bit of JavaScript and a MonsterLink by following our documentation below.

IMPORTANT: this will only function with HTML5 Videos, it is not possible to use this with Flash video. Need help creating your HTML5 Video Embed Code? Check out the Video for Everybody Generator for assistance.
  1. Add a MonsterLink
  2. Trigger the Campaign

We’re going to make use of our MonsterLink functionality to show the campaign using JavaScript. The first step is to add a MonsterLink to your page and hide it using CSS. For example:

<a href="#" class="manual-optin-trigger" data-optin-slug="h95qqg9sqx9atrsl" style="display:none;"></a>

If this is your first time adding a MonsterLink to your site, be sure to read our full documentation on MonsterLinks to ensure you’ve done so correctly.

Step 2 – Trigger the Campaign

Next, we’ll use JavaScript to detect the playing state of the HTML5 video and trigger the MonsterLink to open our campaign. Add the following to the footer of your site:

<script type="text/javascript">
  jQuery(document).ready(function(){
    jQuery('video').on('ended',function(){
      jQuery('.manual-optin-trigger').trigger('click');
    });
  });
</script>

That’s it, your MonsterLink should now be triggered when the video ends to show your campaign!