shadow_tr

Embedding a Video / Slideshow

These recommendations are for embedding a video or slide show into the CMS. We use YouTube and Flickr for our examples as they are commonly used.

YouTube.com

You can start by posting your video directly to YouTube, or, if appropriate for a general audience, add it to the Tulane University or Tulane Athletics YouTube channel sites, by contacting Kathryn Hobgood Ray.

Flickr.com

You can also follow the steps for embedding a Flickr slide show. The only requirement is that the images be available for public display.



STEPS


1.

You will need to have access to the HTML in the rich text editing. If you do not see the 'HTML button' html button in your 'Formatted Text Block,' please contact the Web Communications office.

 

2.

Go to youtube, find the video you want, and look on the far right for a section that says "Embed." Copy all the code. The code will look like this:

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

To resize the image, change the both sets of width and height values. Reducing the size by half would be:

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

To align right, enter code: align="right":

<object align="right" width="212" height="172"><param name="movie" value="http://www.youtube.com/v/rSnXE2791yg&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/rSnXE2791yg&hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="212" height="172"></embed></object>

To align center, put <center></center> around the object:

<center> <object width="212" height="172"><param name="movie" value="http://www.youtube.com/v/rSnXE2791yg&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/rSnXE2791yg&hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="212" height="172"></embed></object></center>

 

3.

Then, go to your CMS page, and in Editing mode, click “Insert New Element.”
Under Text elements, choose the “Formatted Text Block without header”

4.

After you define your new element, switch to the HTML view. This is the green square that says 'W/H' htmlicon  In that blank window, paste your YouTube code. Click out of the  'W/H' (you won’t see anything) and then hit 'Finish'.

5.

Voila! Once you publish your page, all will see it.


Tulane University, New Orleans, LA 70118 504-865-5000 website@tulane.edu