How do I embed a video in my page?

Skidmore College doesn't support streaming video internally.  It's recommended that you host your video on a site such as YouTube or Vimeo, and then link to it from your site.  Video hosting sites offer a variety of customizable video player widgets to display your video content on your web page.

You can create a free account on one of these services.  We recommend that you create a department account, with a departmental email, versus a personal account, for this purpose -- for example, Residence Life at Skidmore College might be the channel name, and you would use a generic email address for contact, so that the channel belongs to the department and not to an individual user.  

As an alternative, the Office of Communications maintains a Skidmore College YouTube channel where we are happy to upload Skidmore College video for you.  All videos must be free of copyright conflict, under 2G in size, and under 10min in length.  You should make arrangements with a member of the Web Team to upload your video, and they will provide you with a link to it.  

Then follow these steps to share it on your site:

  1. Go to the video's page and locate the embed code.  On Vimeo there is a button on the video itself, on YouTube the <Embed> link is often below the video.  Here are some screen shots of what to look for:
Vimeo options    
YouTube example 
Vimeo Options

YouTube Options

  1. The embed code will be lengthy, and can be customized to the height and width of your page, as you can see if you investigate the options highlighted in red in the YouTube example.  A full CMS page without a right column is 559 pixels wide.  With a right column it is approximately 400 pixels wide, so you would need to use a custom sized widget.  Just fill in the desired width, and YouTube will auto-fill the height in proportion. 

  2. In YouTube, you must click on the "Use old embed code" option!  This is very important, as that is what our widget is current scripted to use.Then highlight and copy the embed code.

  3. Go to the webpage for embedding your video, and get into Author mode.

  4. Locate the link that says, "Click here to insert a new element" in the area that you want your video.  Click the link.

  5. From the popup, select the Miscellaneous Elements section, and then select a Custom Script Element.

  6. The page will reload.

  7. Click the gear icon for your new Custom Script Element, and select Edit. Type /www/customcf/video/video.cfm in the Explicit Module text box.

  8. Click the Parameters Tab toward the top of the window.

  9. Type videoCode=EMBED CODE in the large textbox where EMBED CODE is replaced with the video code associated with video online.

    Video custom script screenshot

  10. Click Finish.

  11. Publish your changes.


Troubleshooting: My player isn't showing!

First, be certain that you have published the page, and gotten into Read mode.  Changes will never display in Read mode until published.  Some videos will not render while you are in Author mode, so it's important to check your work in Read mode. 

If it still does not render, double check your embed code.  Does it start with <object width=   >?  If not, you may have forgotten to check on the option in YouTube that uses the old method of embedding.  Go back and try again to retrieve the code using the old format.

Did you edit your code in any way after pasting it?  Or perhaps not copy it all?

Did you forget to put in the videoCode= tag before pasting in your embed code?

If your player still does not render, please call Jenn at x8117 for assistance.

Advanced Topic: Further customizing the size of your player

You may have noticed both much smaller and much larger video widgets on various Skidmore pages.  You can further customize your widget to fit the space you have available.  

The embed code that you paste will look something like the following:

<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/8Nehh3DbFvc&hl=en_US&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/8Nehh3DbFvc&hl=en_US&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>

Notice that width and height are specified in pixels, and are both listed twice. You can adjust the width and height to fit the space available on your page.  Keep the numbers proportional to each other, and remember to fill in both sets of width and height.  Since you cannot center in a Simple Text Block, this is the best way to make sure that your player fills all of the available space and doesn't seem off-balance on the page.