Still using Internet Explorer?

You'll have a happier experience on the TRU website — and most other sites — if you update to a modern web browser such as Firefox, Chrome, or Edge. You can continue to use Internet Explorer for certain tasks, such as using Banner.

Thompson Rivers University 50th Anniversary
Thompson Rivers University 50th Anniversary

Video

Adding Youtube and Vimeo Videos Responsively

Please Note: Using these examples will embed videos full screen, in whatever container they are located. After you have copied the embed code from Youtube, check the URL and ensure it includes "https://"

Single Video: Youtube

To avoid showing suggested videos at the end, add ?rel=0 after the 11-character embed code. If you'd like a video to play automatically (or not), add &autoplay=1 (or 0) after the snippet. If you are only adding a single modifier, it should always use a ?. Subsequent modifiers should use an &.

<div class="flex-video">
<iframe src="https://www.youtube.com/embed/vwWR92hH7W4?rel=0" frameborder="0"></iframe>
</div>

Single Widescreen Video: Youtube

<div class="flex-video widescreen">
<iframe src="https://www.youtube.com/embed/J7vSOyEBVEs?rel=0" frameborder="0"></iframe>
</div>

Single Widescreen Video: Vimeo

<div class="flex-video widescreen vimeo">
<iframe src="https://player.vimeo.com/video/141567420" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div>

Embedding a Youtube Playlist using listType and list parameters

<div class="flex-video">
<iframe src="https://www.youtube.com/embed?listType=playlist&list=FLRHajLnmFo4CVXcVa-ihsOA" frameborder="0"></iframe>
</div>

Embedding Youtube Video - Clean

Embedding a Youtube Playlist using the list parameter

<div class="flex-video">
<iframe src="https://www.youtube.com/embed/videoseries?list=PL426831BC08A165DC" frameborder="0"></iframe>
</div>

Using HTML5 Video Tag

<div class="flex-video">
<video src="http://int.nyt.com/data/videotape/finished/2014/11/1416002593/nade3-1050.mp4" loop preload="auto" autoplay="autoplay" poster="http://graphics8.nytimes.com/images/2014/11/17/technology/17celebrity-top1/17celebrity-top1-custom1.jpg"></video>
</div>
Search To Top