簡介
導視廣告通常是一段非常短的視頻(10 秒或更短),自動插入任何前置廣告和您的內容之前。導視廣告不用於獲利,而是傳遞公司徽標或品牌等信息。海報是為內容視頻顯示的,但是當播放器開始播放時,先顯示預告片,然後是內容視頻。在以下示例中,公司介紹保險槓顯示在內容視頻之後。
顯示內容視頻的海報、標題和簡短描述,但是當開始播放時,先播放內容視頻。
功能性
以下是有關 Bumper 視頻的一些詳細信息:
- 導視廣告兼容客戶端廣告 (CSAI) 和服務器端廣告 (SSAI)
- 在任何前置廣告和您的內容之前播放導視廣告
- 播放器在保險槓視頻播放期間是可配置的:
- 顯示/隱藏播放器控件
- 防止在播放過程中尋找
- 更改搜索欄顏色以指示保險槓
- 分析數據將與任何內容視頻一樣被跟踪
實作
可以通過三種方式實現視頻緩衝,它們是:
- 在高級(嵌入)代碼中使用屬性
- 在標準 (iframe) 代碼中使用查詢字符串
- 添加到播放器的 JSON 配置
詳情如下。
高級(嵌入)代碼
要使用高級播放器代碼啟用播放器,請添加數據緩衝器 id=" 你的_bumper_id“
屬性添加到您的播放器代碼,如以下 HTML 中突出顯示的那樣。
<div style="width: 960px; height: 540px;">
<video-js data-account="1752604059001"
data-player="Wj0445Avw"
data-embed="default"
controls=""
data-video-id="5755775186001"
data-playlist-id=""
data-application-id=""
width="960" height="540"
class="vjs-fill"
data-bumper-id="4446983094001"></video-js>
<script src="https://players.brightcove.net/1752604059001/Wj0445Avw_default/index.min.js"></script>
</div>
當然,HTML 中屬性的順序並不重要,所以數據緩衝器 id=" 你的_bumper_id“
可以放在任何地方<視頻>
標籤。
標準(iframe)代碼
要使用標準 (iframe) 代碼啟用播放器,請添加查詢參數&bumperId= 你的_bumper_id
到您的查詢字符串,如以下 HTML 中突出顯示的那樣。
<iframe src="https://players.brightcove.net/1752604059001/
Wj0445Avw_default/index.html?videoId=5715315990001
&bumperId=4446983094001" allowfullscreen=""
allow="encrypted-media" width="960" height="540">
JSON配置
您可以通過更改播放器的配置在特定播放器的所有實例上啟用保險槓視頻。這意味著您不必向頁面上的播放器代碼添加任何內容,如上面兩個實例所示。
要在 Studio 中更改播放器的配置,請轉到球員模塊,然後單擊要更改的播放器。在播放器的屬性中單擊JSON 編輯器 .添加到視頻雲部分保險槓視頻信息,如突出顯示。
{
"compatibility": true,
"video_cloud": {
"policy_key": "BCpkADawqM0iKt-2XVs6ZMVqw2zuJ7m2yqfET7SgonzI3dAhYFcmJDRgD3EjLhEC6hMLQBa08qAdYf0G55vTI9bcz3NuP1DojBtiGNnGHG0XRBCww9FjZAJNYoFIuO4tkaNW8-Oz9GPqE65R",
"bumper": {
"id": "4446983094001"
}
},
"player": {
"template": {
"name": "single-video-template",
"version": "6.66.2"
}
},
...
選項
使用 JSON 配置時,您還可以使用以下選項:
顯示控件
- 當 false 時在保險槓播放期間刪除控件(默認情況下為 true)進度條顏色
- 指定時更改進度條顏色(默認未定義 - 繼承正常播放器進度條顏色)防止尋求
- 指定時防止查找(默認為 false)
可以將選項添加到播放器的 JSON 配置中:
{
"compatibility": true,
"video_cloud": {
"policy_key": "BCpkADawqM0iKt-2XVs6ZMVqw2zuJ7m2yqfET7SgonzI3dAhYFcmJDRgD3EjLhEC6hMLQBa08qAdYf0G55vTI9bcz3NuP1DojBtiGNnGHG0XRBCww9FjZAJNYoFIuO4tkaNW8-Oz9GPqE65R",
"bumper": {
"id": "4446983094001",
"show_controls": true,
"progress_bar_color": "#654321",
"prevent_seeking": true
}
},
...