Video Ads
Demo
Installation
bash
npm install artplayer-plugin-ads
bash
yarn add artplayer-plugin-ads
bash
pnpm add artplayer-plugin-ads
html
<script src="path/to/artplayer-plugin-ads.js"></script>
CDN
bash
https://cdn.jsdelivr.net/npm/artplayer-plugin-ads/dist/artplayer-plugin-ads.js
bash
https://unpkg.com/artplayer-plugin-ads/dist/artplayer-plugin-ads.js
Usage
▶ Run Code
js
var art = new Artplayer({
container: '.artplayer-app',
url: '/assets/sample/video.mp4',
autoSize: true,
fullscreen: true,
fullscreenWeb: true,
plugins: [
artplayerPluginAds({
// HTML ad, ignored if it's a video ad
html: '<img src="/assets/sample/poster.jpg">',
// URL of the video ad
video: '/assets/sample/test1.mp4',
// Ad redirect URL, no redirection if empty
url: 'http://artplayer.org',
// The duration that must be watched, which can't be skipped, in seconds
// If this value is greater than or equal to totalDuration, the ad can't be closed early
// If this value is less than or equal to 0, then the ad can be closed at any time
playDuration: 5,
// Total duration of the ad, in seconds
totalDuration: 10,
// Whether the video ad is muted by default
muted: false,
// Multilingual support
i18n: {
close: 'Close ad',
countdown: '%s seconds',
detail: 'See details',
canBeClosed: '%s seconds until the ad can be closed',
},
}),
],
});
// ad is clicked
art.on('artplayerPluginAds:click', (ads) => {
console.info(ads);
});
// Ad skipped
art.on('artplayerPluginAds:skip', (ads) => {
console.info(ads);
});