BiddingStack Video Player for Web

Embeddable video player for websites. Supports outstream video ads, single video, playlist, and vertical (shorts-style) layouts, floating playback, video content from SyncCMS, MRSS feeds, or manual video lists, and video advertising through Google Ad Manager and Prebid.

Integration

1. Configure the Video content

Create and configure the player in the BiddingStack Console (see Player Configuration below for all settings).

The player can load its video content from three sources, selected with Content Source in the Video Content section of the player configuration:

• Video / Playlist ID: content hosted on SyncCMS. A SyncCMS account is required to upload and manage videos and playlists.
• MRSS Feed URL: the player loads its video list from an MRSS feed you host (see MRSS Feeds below).
• Manual Videos: a list of video URLs entered directly in the console.

There are two ways to assign the content to a player:

Option A: in the BiddingStack Console

1. Set Player Type to Single Video or Playlist in the player configuration.
2. In the Video Content section, choose the Content Source and enter the Video ID (for Single Video), the Playlist ID (for Playlist), the MRSS Feed URL, or the manual video list.

Option B: on the page

Set data-videoId, data-playlistId, or data-mrssUrl on the player container (see step 3) to override the console configuration per page:

<!-- Single video -->
<div id="bsvp-video-player-1" data-videoId="YOUR_VIDEO_ID"></div>

<!-- Playlist -->
<div id="bsvp-video-player-1" data-playlistId="YOUR_PLAYLIST_ID"></div>

<!-- MRSS feed -->
<div id="bsvp-video-player-1" data-mrssUrl="https://www.example.com/feed/mrss.xml"></div>

If more than one attribute is present, data-mrssUrl takes precedence over data-playlistId, which takes precedence over data-videoId.

2. Add the player tag

Add the loader script to your page. The script tag id must be bssdk-tag-vid, and data-bslid must be set to your publisher ID (provided by BiddingStack):

<script id="bssdk-tag-vid" data-bslid="YOUR_PUBLISHER_ID" src="https://pubtm.com/vpid/tag.js" async></script>

You can also find the ready-to-copy player tag in the SyncCMS UI.

3. Add a player container

Add an empty container element where the player should render. The container is matched by the selector defined in your player configuration:

<div id="bsvp-video-player-1"></div>

On page load the player automatically finds each configured container and renders a player into it.

The player supports two UI modes, set by Player Mode in the BiddingStack console:

• Normal: the player renders inline in the container element on the page.
• Float: the player renders in a floating container fixed over the page. No placeholder container is needed in this mode; you can skip this step.

Player Configuration

Each player is configured per domain in the BiddingStack console.

General

Where and whether the player runs.

Setting	Default	Description
Domain	required	The website domain the player runs on, e.g. www.example.com
Enable	on	Turns the player on or off for the domain
CSS Selector	#bsvp-video-player-1	The container element the player renders into

Player Behavior

How the player plays and behaves.

Setting	Default	Description
Player Type	Playlist	Single Video or Playlist
Layout	Standard	Shown when Player Type is Playlist. Standard or Vertical (Reels / Shorts), a vertical swipe feed
Playlist Style	Outer	Shown when Player Type is Playlist and Layout is Standard. Outer (playlist below the player) or Inner (dropdown modal)
Player Mode	Float	Normal (inline in the container) or Float (fixed over the page)
Auto Play	on	Starts playback automatically
Enable Sound	off	Starts playback with sound on
Loop Playback	off	Restarts the content when it ends
Show Controls	on	Shows the playback controls
Full Screen Mode	Screen	Screen (browser fullscreen) or Window (fixed position)
Lite Mode	off	Lightweight player UI
Defer on Hidden	off	Defers loading until the container becomes visible

Vertical Layout

Shown when Layout is Vertical.

Setting	Default	Description
Ad Interval	0	Inserts an ad slide into the feed after every N videos. 0 disables ad slides

The vertical player uses the Player Size from Container Style (a 9:16 preset such as 264x470 is recommended). Each video shows its title, a progress bar, and swipe/arrow navigation automatically.

Advertising

Ad sources and playback options. The settings below are shown when Enable Ads is on.

Setting	Default	Description
Enable Ads	on	Enables video advertising
Only Ads Mode	on	Plays ads only, without video content
GAM Ad Unit Path	empty	Google Ad Manager ad unit path, e.g. /12345678/your_network/ad_unit_name. Used to generate the VAST ad tag URL

Prebid Configuration

Setting	Default	Description
Enable Prebid	off	Enables header bidding for video ads
Prebid Video Ad Unit (JSON)	empty	Shown when Enable Prebid is on. The Prebid videoAdUnit configuration as JSON, including mediaTypes.video (context, player size, mimes, protocols) and the bids array

Ad Options

Setting	Default	Description
Ad Count	3	Number of ads to play; use -1 for unlimited
Show Ads Progress Bar	on	Shows a progress bar during ads
Show Ads Audio Button	on	Shows a mute/unmute button during ads

Ad Schedule

When and where ad breaks play in the content.

Setting	Default	Description
Pre-Roll	on	Plays an ad break before the content starts
Mid-Roll	off	Plays ad breaks during the content
Mid-Roll Positions	empty	Shown when Mid-Roll is on. Comma-separated positions in the content: seconds (300) or percentages of the duration (50%), e.g. 300, 50%
Post-Roll	off	Plays an ad break after the content ends

Video Content

Optional. Choose where the player loads videos from.

Setting	Description
Content Source	Video / Playlist ID (SyncCMS-hosted content), MRSS Feed URL, or Manual Videos
Video ID	Shown when Content Source is Video ID and Player Type is Single Video. The SyncCMS video ID
Playlist ID	Shown when Content Source is Playlist ID and Player Type is Playlist. The SyncCMS playlist ID
MRSS Feed URL	Shown when Content Source is MRSS Feed URL. The player loads its video list from this MRSS feed, e.g. https://www.example.com/feed/mrss.xml (see MRSS Feeds)
Videos	Shown when Content Source is Manual Videos. A manual list of videos, each with a video URL, title, and poster image if you don't use SyncCMS to manage your video content

Style & Layout

Player size, colors, float position, and share URLs. All fields have sensible defaults.

Container Style

Setting	Default	Description
Player Size	Auto	Auto (100% width of the container) or a fixed preset: 320x180, 480x270, 640x360, 854x480, 1280x720 (16:9), 640x480 (4:3), 270x480, 360x640, 405x720 (9:16 vertical / reels), 480x600 (4:5 vertical)
Main Color	#cccccc	Accent color of the player UI
Hover Color	#ffffff	Accent color on hover

Float Position

Controls where the floating player is placed, with separate settings for desktop and mobile. The position settings are shown when Enable Float is on (the default).

Setting	Desktop default	Mobile default
Width (px)	320	180
Top (px)	unset	70
Right (px)	unset	unset
Bottom (px)	100	unset
Left (px)	unset	unset

Share URLs

Base URLs for the share buttons: WhatsApp, Twitter / X, and Facebook.

Page-Level Overrides

Any player configuration option can be overridden per page with the data-config attribute on the container. Its value is a JSON object merged into the player configuration on load, taking precedence over the console settings:

<!-- Compact single-video embed without the playlist strip -->
<div
  id="bsvp-video-player-1"
  data-videoId="YOUR_VIDEO_ID"
  data-config='{"type": "single", "listStyle": "none", "enableSound": true}'
  style="width: 320px"
></div>

A vertical (shorts-style) playlist with custom container styling:

<div
  id="bsvp-video-player-1"
  data-playlistId="YOUR_PLAYLIST_ID"
  style="width: 264px; aspect-ratio: 264 / 470"
  data-config='{
    "type": "list",
    "layout": "vertical",
    "autoPlay": false,
    "enableFloat": false,
    "containerStyle": {"size": "264x470", "mainColor": "#cccccc", "hoverColor": "#ffffff"},
    "verticalConfig": {"size": "264x470", "adInterval": 2}
  }'
></div>

Commonly used options:

Option	Description
type	single or list
layout	vertical for a shorts-style swipe feed
listStyle	none hides the playlist strip
autoPlay, controls, enableSound	Playback behavior
enableFloat, lite	Floating behavior when the player scrolls out of view
containerStyle	size (auto or a fixed size such as 320x180), mainColor, hoverColor
verticalConfig	Vertical layout options: size (e.g. 264x470) and adInterval (ad slide after every N videos, 0 disables)
adConfig	Ad options, e.g. {"enableAds": false} disables ads on the page
prebidConfig	Prebid options, e.g. {"enable": false} disables header bidding on the page
videoId, playlistId, mrssUrl	Content source overrides. Also available as the dedicated data-videoId, data-playlistId, and data-mrssUrl attributes

MRSS Feeds

Instead of hosting content on SyncCMS, the player can load its video list from an MRSS (Media RSS) feed. Set the MRSS Feed URL in the console, or the data-mrssUrl attribute on the container.

The player reads each <item> in the feed:

Feed element	Used for
<link>	Video URL (preferred; use it for an HLS stream URL)
<media:content url="...">	Video URL fallback when <link> is absent, e.g. an MP4
<title>	Video title
<media:thumbnail url="...">	Poster image
<media:content duration="...">	Duration in seconds
<guid>	Video ID
<description>, <pubDate>	Description and publish date

Items without a video URL are skipped. Example feed:

<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:media="http://search.yahoo.com/mrss/">
  <channel>
    <title>Example Video Feed</title>
    <item>
      <title>My Video Title</title>
      <link>https://cdn.example.com/videos/abc123/master.m3u8</link>
      <guid>abc123</guid>
      <description>Video description</description>
      <pubDate>Wed, 08 Jul 2026 10:00:00 GMT</pubDate>
      <media:content url="https://cdn.example.com/videos/abc123.mp4" duration="95" />
      <media:thumbnail url="https://cdn.example.com/videos/abc123.jpg" />
    </item>
  </channel>
</rss>

Notes:

• The feed must be reachable from the visitor's browser: serve it over HTTPS with CORS enabled (Access-Control-Allow-Origin) if it is on a different domain than the page.
• The player injects VideoObject JSON-LD structured data for the first feed item, so search engines can index the video.
• If the feed cannot be fetched or parsed, the player falls back to the manual video list from the player configuration.

Google Ad Manager Setup

Video ads are served through the Google IMA SDK. To serve ads:

1. Create a video ad unit in Google Ad Manager.
2. Enter the ad unit path (e.g. /12345678/your_network/ad_unit_name) in the GAM Ad Unit Path field of the player configuration. BiddingStack generates the VAST ad tag URL from this path.
3. Make sure Enable Ads is on.

To add header bidding demand on top of GAM, turn on Enable Prebid and provide the Prebid video ad unit JSON in the Prebid Configuration section.

Empty VAST in Only Ads Mode

When the player runs in Only Ads Mode as a creative inside a BiddingStack ad slot and the VAST request returns nothing to play (no ad, malformed response, request failure, or load timeout), the player notifies the page tag with a bs_vast_empty postMessage instead of leaving the slot blank. The BiddingStack Web SDK then refills that slot once with the targeting bs_novideo=1.

To make the refill serve a different creative, add the targeting bs_novideo is none of 1 to the GAM line items that serve the video player creative. See Refill an ad slot when a video creative gets no ad and the bs_novideo key-value.

This requires the BiddingStack Web SDK on the page; the player sends the message automatically and no configuration is needed on the player side.

If you do not have your own video ads demand, BiddingStack can provide demand for your inventory. Contact the BiddingStack team to get set up.

Known Constraints

The vertical layout uses position: fixed in expanded mode. Do not apply transform, filter, perspective, or will-change to any ancestor of the player container, because these CSS properties change the containing block and break fixed positioning.