Help Center Ad Gallery
Outstream Video Ad
Outstream video ads allow publishers to display stand-alone video ads outside a streaming video player. It is more advanced than a standard video ad. It can display in between articles, widget boxes or text lines. This opens up video ad serving to more publishers and expands reach for advertisers.Additionally, out-stream ads are not limited to just video ads and are loaded only when the user scrolls down to make the ad placement visible on screen. This means they actually watch the advertiser’s video ad and the viewability ratio is high. You can set the outstream video to hide when viewers scroll past the ad placement or press the Close button. Outstream ads can be set to auto-play without sound, and pause/hide as soon as they are out of view. If you are already use a premium video player, check if it supports outstream mode. Otherwise, you can use our ad template to create your own outstream advertisement.
Demo
Outstream Video Ad DemoCreate an Outstream Video Ad
- Click the menu "Ads / Create a new ad"
- Choose the ad type to be Rich-Media/HTML ad
- Enter the HTML/JavaScript code for the video ad into the text/code box (see sample ad code below)
- Check the box "Automatically try to process rich-media/HTML code to track clicks" to enable click tracking. Impression tracking is always enabled.
Sample Video Ad Code
In this first example, the video ad will auto-play without sound and with a Close (X) button.<div style="width:640px;height:360px;max-width:100%;position:relative;padding:0;margin:0;display:block;clear:both"> <a href="https://example.com/go.click"> <video style="width:100%;height:auto" fullscreen="false" webkit-playsinline controls muted autoplay> <source src="https://mcdn.adspeed.com/mp4/AdSpeedLogoIntro.mp4"> </video> </a> <button style="position:absolute;right:2%;top:2%;opacity:0.4" onclick="this.parentNode.style.display='none';">✖</button> </div>This is just one sample ad. You can use the same approach to display different kinds of ads, including non-video ads (like image banner ads, text-link ads, HTML ads, etc.) that auto-display and auto-hide as the viewer scroll along the page.
Integration into your website
For the outstream ad to display only when it becomes visible on screen, we use the viewable ad loading approach.- Put the ad container/placeholder where you want it to appear:
<div id="MyOutstreamVideo" asreq="https://g.adspeed.net/ad.php?do=js&aid=XX&oid=YY&wd=-1&ht=-1&target=_blank"></div>
- At the end of the page, init the outstream ad:
<script src="https://g.adspeed.net/js/jquery.viewablead.min.js"></script> <script> $(document).ready(function(){ jQuery('#MyOutstreamVideo').setupViewableAd(); // to enable auto-hide when user scrolls out of view, view source of demo page }); </script>
Other Articles in Ad Gallery
This section provides demo, sample and instructions for the most common and popular ad creative templates. Click on a template link to view the description, demo and instructions to create in the ad server, customize it to suite your purpose and integrate the ad with your platform.
- Catfish Ad
- Composite Ad
- Expandable Ad or Rollover Flash ad
- Expandable Image Ad
- Floating Ad or Layer Ad
- Grid-of-Buttons Ad
- Grid-of-Images Ad
- HTML5 Ad from a ZIP file
- HTML5 Adobe Animate Ad
- HTML5 Animate Ad
- HTML5 Video Ad
- Image Banner with Multiple Clickable Buttons
- Image Slideshow
- Interstitial Ad
- jQuery Popup Ad
- Mobile In-App Interstitial Ad with MRAID
- Mobile Interstitial Ad
- Multi-Click Image Ad
- Parallax Ad
- Peeling Ad
- Polite Ad or Two-Phase Ad
- QuickTime and Windows Media Video Ad
- Skin Background Ad
- Sticky Ad
Cannot find an answer for your question? Ask our Customer Care team
Related
- HTML5 Video Ad
"HTML5 introduces the new <video> tag that allows easy integration and display of videos, including video ads. This tag is ..."
in Ad Gallery - Campaign
"Documentation for API methods to manage your campaigns in our ad server. API Version1.4.6 (build 20240530). This page was updated ..."
- Catfish Ad
"A catfish ad appears (slides in or fades in) as a horizontal area at the bottom of a page. The ..."
in Ad Gallery - Website
"Documentation for API methods to manage one or multiple websites. API Version1.4.6 (build 20240530). This page was updated on Thu, ..."
- How do I mix image and text in an ad?
"Rich-Media ad type provides the most flexible option to create your ad. This page describes the steps to create a ..."