support@brightsign.biz
Note: This article outlines how to display a single YouTube video on a BrightSign player. For instructions on how to display a YouTube playlist on a BrightSign player, refer to this article. If you are unsure whether your URL is for a single video or playlist, refer to this article.
Step-By-Step Instructions
1. Open the YouTube video or playlist you wish to display on your player in a web browser on your computer.
2. Locate the URL that is located in the address bar to identify the type of YouTube video. Below is an example of a single video and it's URL is https://www.youtube.com/watch?v=y1XxnZA1yiQ.
3. For the video to be playable on a player, we need to extract a few elements from the URL. First, we need the ID of the video, which is a "v" parameter and appears after the v= in the URL. For https://www.youtube.com/watch?v=y1XxnZA1yiQ the video ID is y1XxnZA1yiQ.
4. The base of the URL that will be given to the player to display the video is https://www.youtube.com/embed/. Add the video ID to the end of the base URL, for example,
https://www.youtube.com/embed/y1XxnZA1yiQ.
5. Next, we need to add the playlist, to do this add ?playlist= to the end of the URL: https://www.youtube.com/embed/y1XxnZA1yiQ?playlist=.
6. The playlist ID needs to be added, which for this link is the same as the video ID as it is a single video, not a playlist: https://www.youtube.com/embed/y1XxnZA1yiQ?playlist=y1XxnZA1yiQ.
7. A series of parameters need to be added to control the aspects of the video. To automatically start playing the video without interaction, we need to add &autoplay=1: https://www.youtube.com/embed/y1XxnZA1yiQplaylist=y1XxnZA1yiQ&autoplay=1.
Note: These steps outline the parameters used for a non-interactive display. Different parameters are needed if you wish to display the video interactively.
8. Add &rel=0 to the end of the URL to eliminate related videos appearing at the end of the video: https://www.youtube.com/embed/y1XxnZA1yiQ?playlist=y1XxnZA1yiQ&autoplay=1&rel=0.
9. Add &controls=0 to turn off video controls as they aren't useful in a non-interactive environment: https://www.youtube.com/embed/y1XxnZA1yiQ?playlist=y1XxnZA1yiQ&autoplay=1&rel=0&controls=0.
10. Add &showinfo=0 to the URL to eliminate video info/titles displaying: https://www.youtube.com/embed/y1XxnZA1yiQ?playlist=y1XxnZA1yiQ&autoplay=1&rel=0&controls=0&showinfo=0.
11. To loop the video when it reaches the end add &loop=1: https://www.youtube.com/embed/y1XxnZA1yiQ?playlist=y1XxnZA1yiQ&autoplay=1&rel=0&controls=0&showinfo=0&loop=1.
12. In BrightAuthor:connected copy and paste the finished URL into a HTML 5 widget (State properties > Source > Site Source).
13. In State Properties > Source > Options ensure that Enable BrightSign javascript, Enable native video playback, and Enable cross domain policy checks are all enabled.
Note: BrightAuthor:connected does not know when a YouTube video ends. If you want your presentation to move to a different state after the video is complete, make sure that there is a Timeout Event set to the HTML 5 state.
14. Publish the presentation.
Note: Not all YouTube videos can be embedded, and some aren't in a compatible format for our players.
For more URL parameters, see YouTube's Player Parameters page: https://developers.google.com/youtube/player_parameters
1 Comments