Companion ads for video

Companion ads allow you to link non-video display ad slots to the ads that play in a video player on the same web page. They always rely on the master video ad to serve.

  • Creative sets include a video ad and up to 6 corresponding display ads.
  • Labels can prevent video and display ads from competing advertisers from serving at the same time.
  • Ability to backfill from the publisher's network if the VAST response contains fewer companion ads than there are defined display slots on the page.

With auto-play videos, companion ads load immediately when the video starts, so the two load simultaneously. With click-to-play videos, a regular (non-companion) ad could load in the companion ad slot before the video starts. When the video is clicked to play, the companion ad then replaces the regular ad.

Fluid sizes are not supported for video companion ads.

See how a video and companion display on the same page

Video ad units contain at least one video size. This example also illustrates an optional companion ad.

Video and video companion ad illustration

Learn more about video ad units.  

Available companion creative types

If your creative set includes companion creatives, you can use any of the following:

Image: Supported file formats are GIF, JPG, or PNG.

Third-party HTML: These can be highly customizable and interactive creatives. You can use custom HTML, JavaScript snippets, and tags from a third-party ad server or Campaign Manager.

Custom code snippet: This includes all of the options of third-party HTML, plus the ability to upload any number of files. Use a source URL (iFrameResource) or HTML (HTMLResource).

Ad Manager tag: Creatives hosted by Ad Manager, and require a URL. They appear in VAST format as an HTMLResource with the contents of the tag.

The code snippet for Ad Manager tag companions might include the ]]> character sequence, which is not allowed in a CDATA block. As a workaround, you can traffic Ad Manager tag companions using the "Third-party HTML" companion type, and select Use URL.

Studio: Creative must be from Studio, and you must have permission to use the creative.

Custom template: Creatives defined by a pre-existing template. Templates may be created by both Google and your organization for your use.

 

In order to serve video ads with companion creatives, your player and site must both be configured correctly.

  • A video player using the IMA SDK should set companion sizes into the ciu_szs parameter on the request.
  • Display ad slots should be defined using GPT tags that specify how companion ads should behave.
  • If your video player is an iframe, you need to include a GPT proxy script in your HTML. Learn more
You can find implementation details about how to use companion ads with Google Publisher Tags. If you are not using the GPT library, your developers may be able to implement support for companions using the ad API, but the content shown below focuses on GPT features.

GPT methods that support companion ads

GPT javascript Example code in the <head> of a web page

companionAds()

The companionAds() service declares that an ad slot may load with a display ad, but it should defer to the video companion if one is available with the video ad which serves in a video player on the same page.

googletag.defineSlot('/1234/video-parent/child-ad-unit', [300, 250], 'ad‑div‑1')
.addService(googletag.companionAds())
.addService(googletag.pubads());

setRefreshUnfilledSlots()

The setRefreshUnfilledSlots() method with a param of true will ask for companion slots that have not been filled to be automatically backfilled.

googletag.companionAds().setRefreshUnfilledSlots(true);

enableVideoAds()

The enableVideoAds() method ensures that both the GPT call and the IMA SDK ad calls will use the same correlator.

This allows competitive exclusions to work across the video and display ads.

googletag.pubads().enableVideoAds();

disableInitialLoad()

Optional for "auto-play" video.

The method can prevent the scenario in which a display ad loads to the ad unit, but is displayed for only a few seconds before the video companion ad is delivered.

Compare this with click-to-play ads, where it's not necessary to disable initial load because the display ad should show until the user clicks play, thus loading the companion.

googletag.pubads().disableInitialLoad();

 

Sample GPT code including companion display ads

The full <head> of a page might look like this:


<script type='text/javascript'>
 window.googletag = window.googletag || {cmd: []};
 (function() {
  var gads = document.createElement('script');
  gads.async = true; gads.type = 'text/javascript';
  gads.src = 'http://securepubads.g.doubleclick.net/tag/js/gpt.js';
  var node = document.getElementsByTagName('script')[0];
  node.parentNode.insertBefore(gads, node); })();
</script>

<script type='text/javascript'>
 googletag.cmd.push(function() {
  googletag.defineSlot('/12345/path/to/adunit', [300, 250], // ← set with actual ad unit and sizes for your website    'ad‑div‑1').addService(googletag.companionAds()).addService(googletag.pubads());   googletag.defineSlot('/12345/path/to/aduni', [160, 600], // ← set with actual ad unit and sizes for your website    'ad‑div‑2').addService(googletag.companionAds()).addService(googletag.pubads());   googletag.defineSlot('/12345/path/to/adunit', [728, 90], // ← set with actual ad unit and sizes for your website    'ad‑div‑3').addService(googletag.companionAds()).addService(googletag.pubads());   googletag.companionAds().setRefreshUnfilledSlots(true);
  googletag.pubads().enableVideoAds();   googletag.pubads().disableInitialLoad(); // ← only necessary on auto‑play video pages
  googletag.enableServices();
 });
</script>

 

While the <body> code might look like this:


<div id='ad-div-1' style='width:300px; height:250px;'>
 <script type='text/javascript'>
  googletag.cmd.push(function() { googletag.display('ad-div-1'); });
 </script>
</div>
<div id='ad-div-2' style='width:160px; height:600px;'>
 <script type='text/javascript'>
  googletag.cmd.push(function() { googletag.display('ad-div-2'); });
 </script>
</div>
<div id='ad-div-3' style='width:728px; height:90px;'>
 <script type='text/javascript'>
  googletag.cmd.push(function() { googletag.display('ad-div-3'); });
 </script>
</div>

 
Was this helpful?
How can we improve it?