Documentation:UBC Content Management System/How to/How do I add or upload a video to my site
|Welcome to the support documentation for the|
UBC CMS Service.
|UBC Collab Theme|
UBC CMS is not a hosting service and videos cannot be directly uploaded. To add video to a page it needs to be referenced or embedded from a service like YouTube.
NOTE: Please keep in mind that YouTube is a US service.
The following sections will explain how to set up and embed your videos using YouTube:
Uploading to YouTube
Many UBC department/units have their own UBC YouTube Accounts. Additionally, UBC has a YouTube channel that lets you upload unlimited amount of data - in other words you are not limited to 10 min long videos.
Please refer to the following on How to upload a video to YouTube EDU
Embedding a YouTube video to a page or post
WordPress supports oEmbed just enter the URL to the YouTube Video and magic will happen. That is,
- in your web browser, open the YouTube video you want to embed
- copy the video URL (similar to http://www.youtube.com/watch?v=tMPjq3fHL_) from the browser's address bar
- edit the page, post, or widget on which you want to embed the video, and paste the URL
- optional: you can clean up the video’s URL by deleting any characters after and including an ampersand
Other services supported by WordPress oEmbed include:
- Flickr (both videos and images)
- WordPress.tv(only VideoPress-type videos for the time being)
- SmugMug (WordPress 3.0+)
- FunnyOrDie.com(WordPress 3.0+)
- Twitter (WordPress 3.4+)
Using Custom Fields With Embed Code:
Before you can use custom fields, you have to make sure that the "Conditional Custom Fields Shortcode" plugin is enabled (How do I enable plugins?).
Once you've enabled custom fields, they will be available on the Edit/Add New Page and Edit/Add New Post pages (if you they are still not visible, check that their visibility is enabled in the "Screen Options" drop-down tab at the top of the page).
Embedding videos with custom fields is the same as embedding Google Maps with custom fields; therefore, please refer to the "Embedding Through Custom Fields" section of this page for more information on using custom fields.
Embed video from other sources
Videos can be embedded on a CMS website or any web page using html. Using the block editor you can add an html block to a page. If you are hosting videos on Panopto you can get a link by allowing the file to be downloaded from anywhere and choosing the 'podcast' output. Not all video hosting services allow referencing the video file, those that do allow for more functionality such as background video.
Add HTML to a widget. <video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video>
If you would like to learn more about the video tag you can do so at https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video