Skip to main content
Sign In

University Web Services (UWS)

University Web Services, University of Colorado Denver

 

 
 
 

Use Flash/SWF files with supporting external files

SharePoint 2010 Web Part Concepts


Flash .swf Files that Use Supporting External Files

For flash files (.swf) that link to external resources, usually an XML file or image files, you will need to use the Form Web Part.  Use the code below to embed the flash object in your web site. Do NOT use the swfobject.js. This JavaScript file causes conflicts with the SharePoint JavaScript.

DO NOT EDIT THIS CONTENT IN INTERNET EXPLORER – USE FIREFOX OR SAFARI

Upload Supporting External Files
  1. Do not use the swfobject.js file, it will conflict with SharePoint. If JavaScript is required for the alternate content, add it to the subsite js file (or theme.js).
  2. Add any necessary CSS to the subsite or theme CSS files.
  3. Upload supporting files to the desired folder.
  4. Publish all supporting files.
Upload and Publish a .swf File
  1. Navigate to the images folder where you will upload your .swf file from the Manage Content and Structure menu.
    images

  2. In the Images folder, upload the .swf file by selecting New Item.

    new item

  3. Complete the Upload Document screen fields and select OK.
    upload

  4. Update the properties for the uploaded document. Select the Content Type (Document, Image, Audio, Video) and complete the rest of the fields and select Save.
    content type

  5. Select the check box by the .swf file and choose the Actions menu and Publish.
    publish

Add Form Web Part and HTML Code
  1. Navigate to the page where you would like a Form Web Part to appear.
  2. Select Edit Page under the Site Actions menu.
    edit page

     
  3. To insert a web part, choose Add a Web Part from one of the web part zones on the page, or place your cursor in a content area.
    add a web part

  4. Select the Insert tab in the ribbon, select the Web Part button.
    insert tab

  5. The web part gallery will open underneath the ribbon. The web part gallery shows the categories, web parts, and a description of the selected web part.
    gallery

  6. Choose the Forms category and the Form Web Part. Click Add.
  7. Once the Form Web Part is placed on your page, mouse over the web part title and click the dropdown arrow ont he right.
  8. Choose Edit Web Part
  9. The web part editing interface will appear on the top right of the page, you may need to scroll up to see it.
  10. Select the Source button from the web part editing interface.
  11. Cut and paste the following code into the HTML Source window, but do not use swfobject.js.
  12. Change the data, width, height, and directory values to match the needs of your .swf file.

    <object type="application/x-shockwave-flash" data="/flash/EXAMPLE.swf" width="950" height="390">
    <param name="movie" value="/flash/EXAMPLE.swf" />
    <param name="wmode" value="transparent">
    <param name="flashvars" value="xmlDirectory=/flash/&amp;xmlFileName=EXAMPLE.xml&amp;picDirectory=/flash/images/"/>
    <!-- begin alternative Content -->
    <div id="homeFlash">
    … 
    </div>
    <!-- end alternative Content -->
    </object>

    source

  13. Click OK on the HTML Source window
  14. In the Edit Web Part window located in the upper right of your screen, use the Appearance section to adjust the title and dimensions of the web part.
  15. Choose Chrome TypeNone to hide the web part title. 
    full edit menu

  16. Select OK to apply changes.
  17. When you are done making adjustments, Check In, Save and Close, or Publish your page.
  18. Your .swf file should appear in your page
University of Colorado Denver

© The Regents of the University of Colorado, a body corporate. All rights reserved.

All trademarks are registered property of the University. Used by permission only.