# Advertisement

Note

This feature is available only to ByteArk Video Cloud for Business customers. Please contact sales@byteark.com if you would like to use it.

ByteArk Player supports advertisement playback using the Google Interactive Media Ads SDK (Google IMA SDK for HTML5) (opens new window), following the Video Ad Serving Template (VAST) (opens new window) standard.

ByteArk Player can request ads from many ad servers, including:

Google DoubleClick for Publishers (DFP)
Google AdSense network
Any VAST-compliant ad server

# Supported ad formats

Because ads are rendered via Google IMA SDK for HTML5, refer to Google's Support and Compatibility (opens new window) document for supported formats.

# Advertisement display

# Enable advertisement

Enable advertisement playback by specifying plugins.bytearkAds in options. Configure the parameters per the options table below.

{
  fluid: true,
  poster: '/assets/samples/player/images/poster-big-buck-bunny.jpg',
  sources: [{
    title: 'Big Buck Bunny',
    src: '<MEDIA_URL>',
    type: 'application/x-mpegURL'
  }],
  plugins: {
    bytearkAds: {
      adTagUrl: '<VAST_TAG_URL>',
    }
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14

# Options

Name	Type	Required	Description
adTagUrl	String	No	URL of the VAST, VMAP, or VPAID ad tag
integration	String	No	Ad integration to use: `google-ima`
adTagParameters	Object	No	Key-value parameters to send to the ad server
adsResponse	String	No	XML string of the VAST/VMAP/VPAID response
showAdMarker	Boolean	No	Show ad markers on the control bar
ads	Array	No	List of inline ads

# Example

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <div id="video-player"></div>
    <script src="https://byteark-sdk.cdn.byteark.com/player/v2/byteark-player.min.js"></script>
    <script>
      var player = bytearkPlayer('video-player', {
        fluid: true,
        sources: [{
          title: 'Big Buck Bunny',
          src: '<MEDIA_URL>',
          type: 'application/x-mpegURL'
        }],
        plugins: {
          bytearkAds: {
            adTagUrl: '<VAST_TAG_URL>',
          }
        }
      });
    </script>
  </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

# Sending adTagParameters to Google Ad Manager

Add integration: 'google-ima' to the bytearkAds plugin options.
Add adTagParameters with the keys and values you want to send. See the VAST ad tag URL parameters documentation for Google Ad Manager (opens new window).

Note

If a key in adTagParameters matches a key already in the adTagUrl query string, the value from adTagParameters overrides the one in adTagUrl.

# Using macros for Google Ad Manager

The ByteArk Ads plugin substitutes known macros automatically — e.g., [url] is replaced with the current page URL before sending to Google Ad Manager.

{
  ...
  integration: 'google-ima',
  adTagParameters: {
    url: '[url]'
  }
}

1
2
3
4
5
6
7

Supported macros

Macro	Type	Value	Description
url	String	`[url]`	Current page URL where the video is playing