OptinMonster Documentation

Documentation, Reference Materials, and Tutorials for OptinMonster

Home

Docs

How to Show a Campaign After Video Has Ended

How to Show a Campaign After Video Has Ended

You can easily show a campaign after video play using Javascript and our MonsterLink feature.

In this article, you’ll learn how to show a campaign after a video has ended.

Before You Start

Here are some things to know before you begin:

  • MonsterLinks require a Pro or higher subscription.
  • This guide 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.
  • Due to the advanced nature of this guide, at this time we do not provide technical support for implementing any portion of this guide.

Add MonsterLink

To show a campaign after a video finishes playing, follow these steps:

Add MonsterLink
  1. To begin, create and add a MonsterLink to your site following our guide.
  2. Next, you’ll edit the MonsterLink by adding some CSS to visually hide it from visitors. For example:
<a id="manual-optin-trigger" href="https://app.monstercampaigns.com/c/h95qqg9sqx9atrsl/" target="_blank" style="display:none;"></a>

Self-hosted HTML5 Video

If you’re self-hosting your HTML5 video, add the following Javascript to the footer of your site to trigger the MonsterLink when the video ends:

<script type="text/javascript"> 
    document.querySelector('video').addEventListener('ended', function( evt ) { 
        document.getElementById('manual-optin-trigger').click(); 
    }); 
</script>

YouTube Video

If you’re using a YouTube video, you can use the YouTube API by following these steps:

Get the YouTube embed iFrame

  1. Follow these instructions to get the embed iFrame.
  2. Next, add ?enablejsapi=1 to the end of the src URL.
  3. Finally, add an id attribute to the iFrame, id="player", for example:
    <iframe id="player" width="560" height="315" src="https://www.youtube.com/embed/jbP9C9bQtv4?enablejsapi=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Now that you have the embedded iFrame in place add the following JavaScript to the footer of your site:

<script type="text/javascript"> 
    var tag = document.createElement('script'); 
    tag.src = "https://www.youtube.com/iframe_api"; 
    var firstScript = document.getElementsByTagName('script')[0]; 
    firstScript.parentNode.insertBefore(tag, firstScript); 
    function onYouTubeIframeAPIReady() { 
        new YT.Player('player', { 
            events: { 
                'onStateChange': function(evt) { 
                    if (evt.data === YT.PlayerState.ENDED) { 
                        document.getElementById('manual-optin-trigger').click(); 
                    } 
                 } 
             } 
        }); 
    } 
</script>

If you’re serious about jumpstarting your website business growth, then get started with OptinMonster today!

Get Started With OptinMonster Today!

BONUS: Done-For-You Campaign Setup ($297 value)
Our conversion experts will design 1 free campaign for you to get maximum results – absolutely FREE! Click here to get started →

Still stuck?

How can we help?

Last updated on


Start Getting More Leads & Sales Today with OptinMonster!

Start Getting More
Leads & Sales Today
with OptinMonster!

Create and launch smart capture forms today in minutes. What are you waiting for?

Create and launch smart capture forms
today in minutes. What are you waiting for?

OptinMonster has transformed our business. Before integrating their optins, our clients saw a 2% conversion rate from web traffic, which is slightly above the standard for their industry. With the integration of OptinMonster’s lightbox popup, exit-intent technology, split testing, and other tools, our client’s conversion rates soared by an unprecedented 500%. They attracted substantially more customers while spending less on digital advertising. Their success propelled them to the top of their markets, outperforming national chains and other medical spas with much bigger marketing budgets. Our client’s success in their market has distinguished us in our own. We are now one of the most sought-after marketing firms in the industry of aesthetic medicine. We know that the integration of OptinMonster, more than any other tool or marketing strategy, has supported this growth and achievement.

chris zelig medstar media

Chris Zelig

Partner, Medstar Media

OptinMonster has been a game-changer for us. From driving donations to collecting new leads, there is nothing that this simple tool has failed to accomplish. Our lead collection rate has jumped by over 1,000%.

joe lowe american bird conservancy

Joe Lowe

Director of Digital Communications, American Bird Conservancy

Through OptinMonster’s exit-intent popups, we have more than doubled our sales conversion rate. Best of all is the compound effect of using OptinMonster over a long period of time—more conversions mean more customers, which means more word of mouth.

mitch smith, managing director, shockbyte

Mitch Smith

Managing Director, Shockbyte.com