News
Embedding Video
The Embedding function enables you to publish our videos outside the our Commodity-TV website and to use the content directly on your website. You can embed a video in your Blog too and viewers can watch it without first going onto Commodity-TV.
To receive the embedding code for a video, please go to the respective video on the website and click the button „Embed“. All videos can be found through the search function.
Code example
https://www.commodity-tv.com/embed/watch&v=[VIDEO_ID]
Embed via iframe
Default iframe not responsive (not recommended)
<iframe width="640" height="360" src="https://www.commodity-tv.com/embed/watch&v=[VIDEO_ID]" frameborder="0" allow="autoplay; encrypted-media;" allowfullscreen></iframe>
Bootstrap (responsive)
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="https://www.commodity-tv.com/embed/watch&v=[VIDEO_ID]" allow="autoplay; encrypted-media;" frameborder="0" allowfullscreen></iframe>
</div>
Example with additional CSS (responsive)
<div class="embed-container">
<iframe class="embed-responsive-item" src="https://www.commodity-tv.com/embed/watch&v=[VIDEO_ID]" allow="autoplay; encrypted-media;" frameborder="0" allowfullscreen></iframe>
</div>
<style>
.embed-container {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
/* padding-bottom: 75%; *//* 4:3 */
height: 0;
overflow: hidden;
max-width: 100%;
}
.embed-container iframe, .embed-container object, .embed-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>
Embed via JavaScript
<script src="https://www.commodity-tv.com/ctvplayer.js"></script>
<div id="your_id"></div>
<script>
ctv = new ctvPlayer('your_id',{
videoId: 1919, //required [VIDEO_ID]
width: 960, //optional in px, default is 640
height: 540, //not required see notes below but optional in px, default if no width is 360
addClass: 'embed-responsive-item', //optional inserts a certain class, useful for responsive settings
//optional options
options: {
autoplay: 1 //default is 0
}
});
</script>
Notes: The integration via Javascript creates an iframe in the given div. The height of the iframe is calculated automatically in 16:9 based on the width. For a responsive implementation you can add your own class to the iframe with 'addClass'.
Additional parameter
The following parameters are available and optional.
https://www.commodity-tv.com/embed/watch&v=[VIDEO_ID]?[PARAMETER]
Parameter | Info |
---|---|
autoplay | This parameter specifies whether the initial video will automatically start to play when the player loads. Supported values are 0 or 1. The default value is 0. |
Recommended 16:9 sizes in pixel
640 x 360
854 x 480
960 x 540
1024 x 576
1280 x 720
1366 x 768
1600 x 900
1920 x 1080