How to embed a Flash file in a page

There are several ways to embed a Flash object into an html page: each has pros and cons. You can use your favorite one.

If you use an HTML editor, it probably allows you to embed a flash movie in your page with a simple click and to customize parameters with a confortable interface. Refer to your software manual for more informations.

If you are using a Blog/Forum/CMS platform please visit the Blog, Forum, and CMS page. All informations reported in this page apply only if you are able to edit the source code of your (X)HTML page.

SWFObject

I suggest SWFObject: it is a clean, standard compliant, easy to maintain, and cross-browser solution. Your html code will look like the following (this refer to SWFObject 2, SWFObject 1.x was based on a different syntax).

In the header:

<script type="text/javascript" src="swfobject.js"></script>

When you need it:

<div class="container">
  <div id="mySlideShowDiv">This slideshow requires Adobe Flash Player 9 and JavaScript enabled.</div>
</div>
<script type="text/javascript">
  swfobject.embedSWF("yourpath/Carousel.swf",  // flash file
    "mySlideShowDiv",   // div id
    "750", "500",  // width and height
    "9.0.0",       // flash palyer version
    false,         // autoinstall 
    {xmlfile:"default.xml", loaderColor:"#0000FF"},  // flashvars
    {bgcolor: "#CCCCCC"},  // parameter
    {});                   // attributes
</script>

If the slideshow you are using requires Flash Player 10 change the 5th parameter (and the text message) appropriately.

A simple Object tag

You can use a simple object tag like this (may not work with legacy browsers):

<object width="750" height="500"
  type="application/x-shockwave-flash"
  data="yourpath/Carousel.swf">
  <param name="movie" value="yourpath/Carousel.swf" />
  <param name="bgcolor" value="#CCCCCC" />
  <param name="flashvars" value="xmlfile=default.xml&loaderColor=#0000FF" />
</object>

Notice that the flash file name must be written twice to work with all browsers: as data attribute and as movie parameter.

Other solutions

Other solutions include two nested objects/embed tags. These are quite confusing and many people fail to keep the two tags consistent with each other. I suggest you not to use them, unless you are already familiar with one such solution.

Also notice that the embed tag has never been included in any standardization of (X)HTML. My opinion is that if you use it you should expect that your page will not work properly in future.

For more options please visit:


Personal Tools