Playing a Flash (SWF) Video on a SharePoint Site

Jennifer Lewis

Playing a Flash Video on a SharePoint Site Page 2

Overview Sometimes you may want to enhance your SharePoint site with a video. For example, you may have to put a video of your CEO speaking on your site, or you may have to put a more interactive Flash/SWF file (like a quiz) on the SharePoint site. This document will show you how to embed a Flash/SWF file on your page. Requirements

Correct permissions to edit SharePoint pages (usually Administrator access) HTML knowledge

Instructions

1. Go to your SharePoint site.

2. On your SharePoint site, go to the page where you want to add the video. In this

example, I am putting the video on the default (first) page.

3. Select Site Actions – Edit Page

Date Written: 26 February 2009

Playing a Flash Video on a SharePoint Site Page 3

4. In the Web Part area where you want the video to play, click Add a Web Part. In this

example, I will be putting the web part on the left hand side.

5. Scroll down to the Miscellaneous section and select Content Editor Web Part.

Date Written: 26 February 2009

Playing a Flash Video on a SharePoint Site Page 4

6. Click the Add button 7. Click the open the tool pane link

Date Written: 26 February 2009

Playing a Flash Video on a SharePoint Site Page 5

8. Click the Source Editor button

9. Add the HTML that will embed a SWF video on the web page. If you are unsure on how

to do this, see the appendix at the end of this document, which explains the HTML code for embedding SWF files on pages.

Date Written: 26 February 2009

Playing a Flash Video on a SharePoint Site Page 6

You can store the SWF file in a document library on the SharePoint site, or you can reference an SWF file that is being stored on another web site.

You can also embed “interactive” SWF videos, like games and quizzes. “Interactive” – Flash

videos with interaction, such as drag-and-drop and button clicking.

10. Click the Save button

Date Written: 26 February 2009

Playing a Flash Video on a SharePoint Site Page 7

NOTE: Your video will start playing immediately. 11. Make modifications on how to display the web part, such as changing the title name and

displaying either the title, title and border or hiding the title altogether. In this example, I will be displaying the title only, and I am going to change the title.

Date Written: 26 February 2009

Playing a Flash Video on a SharePoint Site Page 8

12. Click OK

13. Select Exit Edit Mode Here are the results:

Date Written: 26 February 2009

Playing a Flash Video on a SharePoint Site Page 9

Appendix: Embedding SWF video on a Web Page The HTML code for embedding a SWF video on a Web Page is as follows: <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/ cabs/flash/swflash.cab#version=[version]" width="[width in pixels]" height="[height in pixels]" id="flashvideoplayer.swf" align="middle"> <param name="allowScriptAccess" value="sameDomain"> <param name="movie" value="[URL of where the movie is located, including the SWF file]"> <param name="quality" value="high"> <param name="bgcolor" value="[background color in hexadecimal]"> <embed src="="[URL of where the movie is located, including the SWF file]" quality="high" bgcolor="[background color in hexadecimal]" width="[width in pixels]" height="[height in pixels]" name="[name of SWF file without the URL]" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"> </object>

The parameters: [version] – the version of Shockwave/Flash player to use to play the video. The version

number is usually four numbers separated by commas. For example: 7,0,0,0 or 9,0,0,0. [width in pixels] – the width in pixels. [height in pixels] – the height in pixels.

You can find a hexadecimal color chart anywhere on the web by searching for “hexadecimal color chart” on Google. I like using the color chart on WebMonkey (http://www.webmonkey.com/reference/Color_Charts)

[URL of where the movie is located, including the SWF file] – The URL of where the movie is located, including the SWF file in the URL. For example: http://www.bogus.com/bogus.swf

[background color in hexadecimal] – The background color in hexadecimal notation. For example: #00000 for black, #FFFFFF for white.

[name of SWF file without the URL] – the name of the SWF file without the URL. For example: bogus.swf.

For example: You have an SWF file that you want to play on your site called bogus.swf. This site is found on http://www.bogus.com. You also want to use Flash Player version 9 when playing the video. To play this video on your site with a white background, a width of 400 pixels, and a height of 300 pixels, you would enter the following: <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/ cabs/flash/swflash.cab#version=9,0,0,0" width="400" height="300" id="flashvideoplayer.swf" align="middle"> <param name="allowScriptAccess" value="sameDomain"> <param name="movie" value="http://www.bogus.com/bogus.swf"> <param name="quality" value="high"> <param name="bgcolor" value="#FFFFFF"> <embed src="="http://www.bogus.com/bogus.swf" quality="high" bgcolor="#FFFFFF" width="400" height="300" name="bogus.swf" align="middle" allowScriptAccess="sameDomain" type="application/x-

Date Written: 26 February 2009

Playing a Flash Video on a SharePoint Site Page 10

Date Written: 26 February 2009

shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"> </object> To get a more detailed explanation of what this code means, read the Adobe Knowledge Base article, which can be found at http://kb.adobe.com/selfservice/viewContent.do?externalId=tn_12701