I know a lot of people have proclaimed the “death of Flash,” but we still see it everywhere. So let’s use the best possible practice for including Flash — SWF files — in Web pages, shall we?
You can download it here. Don’t get the beta, get the regular one. The file is:
1) Unzip the file. Now you’ll have a folder named “swfobject”; double-click to open it.
2) Copy these files and paste them into a new folder so you can learn how to use them:
3) Open up the HTML file in Dreamweaver or Notepad or whatever you normally use. Examine the code there. Look in the HEAD for this:
swfobject.embedSWF("test.swf", "myContent", "300", "120", "10.0.0", "expressInstall.swf");
Of the next three lines, the keys are in the middle, between the parentheses.
test.swf This is the name of YOUR SWF. You will change this (unless your SWF is named “test.swf”).
myContent This is the ID of your DIV (in your HTML). You may change this. IT MUST MATCH the ID in the DIV in your HTML below.
300 This is the width of your SWF. You will change this.
120 This is the height of your SWF. You will change this.
10.0.0 This is the oldest version of the Flash player that will run your SWF. (You select this in Publish Settings, in the Flash application, before you spawn your SWF.) You may change this.
expressInstall.swf This may be omitted.
IMPORTANT: Note that the DIV used by SWFObject (for example, “myContent”) wil be REPLACED by your SWF. So if you want to create and style a DIV to style or position your SWF, that DIV must wrap around the “myContent” DIV.
Your HTML file can — obviously — have any filename. It does not need to be named index_dynamic.html.
View Source on this example page to see how the middle part has been edited. For me, this is the easiest way to set up the page (just copy a page that works). But note that your SWF’s filename, width, height, and (maybe) your DIV ID are all different from the example.
In the CSS for my example, the surrounding DIV is named “centerer.”
- Flash OBJECT and EMBED tag attributes: List of all attributes and what each one does (from Adobe).
- Detecting Flash Player versions and embedding SWF files with SWFObject 2: An in-depth tutorial on SWFObject, from Adobe.
- Embedding Flash with SWFObject 2.0, a video tutorial by the great Lee Brimelow. (16:10).
Alternative File Use
An alternative to keeping the SWFObject code file on your own site is to use the file at Google Code instead. Read an explanation.
swfobject.embedSWF("test.swf", "myContent", "300", "120", "10.0.0");