javascriptvideojwplayervast

How to add vast advertisement to jw player

I am trying to add a vast advertisement from advertising sites on jwplayer This is what I got from the advertising site

Bebi Video Ads :: Vast Instructions

To get vast url you should first include Bebi script on top of your page:

<script type="text/javascript" data-cfasync="false" src="//st.bebi.com/bebi_v3.js"></script>

then to get a vast url you should call:

BB.getVASTUrl(209831);

wherever you need it.


More information and examples can be found at:

https://bebimedia.freshdesk.com/solution/articles/14000075614-how-to-use-bebi-video-ads

I tried and don't know the next step

<script type="text/javascript" data-cfasync="false" src="//st.bebi.com/bebi_v3.js"></script>

<script src="https://cdn.jwplayer.com/libraries/SNAMyqnD.js"></script>

<div id="player"></div>

<script>
var videoPlayer = jwplayer("player");
videoPlayer.setup({
sources: [{file: "https://www.w3schools.com/tags/mov_bbb.mp4"}],
width:"100%",
height:"100%",
});
</script>

Solution

  • First, you need to fulfill these two requirements:

    Second, this code should load your Bebi ads in a pre-roll ad break in the JW Player. If you have additional ad breaks (mid-rolls, post-rolls), take a look at JW Player's advertising documentation. 

    <html>

<head>
    <script type="text/javascript" data-cfasync="false" src="https://st.bebi.com/bebi_v3.js"></script>

    <script src="https://cdn.jwplayer.com/libraries/SNAMyqnD.js"></script>
</head>

<body>
    <div id="player"></div>

    <script>
        var videoPlayer = jwplayer("player");
        var vasturl = BB.getVASTUrl(your_placement_id); 

        videoPlayer.setup({
            "playlist": [{
                "file": "https://www.w3schools.com/tags/mov_bbb.mp4"
            }],
            "height": 360,
            "width": 640,
            "advertising": {
                "client": "googima",
                "schedule": [{
                    "offset": "pre",
                    "tag": vasturl                  
                }]
            }
        });
    </script>
</body>

</html>