This is a question I am often asked and, although I covered it in one of my ‘iWeb Questions of the Week’ posts a while back I still get e-mails asking me every now and again so I thought it was about time that this subject got a post all to itself.
To get a flash movie into iWeb you will need 2 things; A flash movie clip and a bit of code to stick into a HTML snippet. That’s it really, it’s that easy. If you look around the WWW there are lots of different codes for inserting a flash movie into a web-site (not just iWeb) and I have been testing a few. The one I show below is the one I had most success with.
Not that I had many problems, but I wanted to find the best code possible that would work on the most amount of browsers as possible. Of course there is the problem that Internet Explorer users have with the fact that they have to click on any flash elements to get them working, but isn’t there always problems with IE?
Before we start I have to issue a minor warning. If you want to achieve this effect in iWeb and you are not hosting your iWeb site on MobileMe then you will have to publish to a folder and upload your iWeb site via a third-part FTP application such as CyberDuck. This is because we have to copy the flash file itself to the web-site ‘post production’.
So let’s assume you have your flash movie already made, open iWeb and navigate to the page you want to have the movie added to.
Insert an HTML Snippet and when the transparent black window opens, paste in the code shown below.
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash /swflash.cab#version=6,0,40,0" width="320" height="240" id="mymoviesname"> <param name="movie" value="http://www.mydomainname.com/sample.swf" /> <param name="quality" value="high" /> <param name="bgcolor" value="#ffffff" /> <embed src="sample.swf" quality="high" bgcolor="#ffffff" width="320" height="240" name="mymoviename" align="" type="application/x-shockwave-flash" pluginspage="http://get.adobe.com/flashplayer/"> </embed> </object>
You will notice that there are various elements highlighted in red. These are the elements that you can/will have to change in order for your flash movie (swf file) to work.
The width and height values are self-explantory, they must match those of your flash file. If they don’t then it will appear squashed and mishapen on your web-page.
The other 2 elements are the name of your flash file. You will notice that in the latter file name I have included the domain name too; that is because this part of the code is where your iWeb page will look for where you have stored your flash file within your iWeb site.
There is a really easy way of finding out the full and correct path for your flash file that involves a little bit of work beforehand.
Simply pick any file on your Mac, such as a photo or text document but nothing important or too big. Copy it to your desktop and then, in iWeb, on the page that you want to have displaying the flash movie type a bit of text (anything you want, but just one word will do) and select it all.
Select the Hyperlink tab in Inspector and add a hyperlink to the word(s) you typed. From the drop-down menu select ‘A File’ and then browse to your desktop and link to that file you copied there earlier.
Save your iWeb site and publish as normal. Now open your site in Safari, Firefox or whatever browser you choose and navigate to the page you just created. Find the hyperlink you added and right-click (Ctrl-click) on it, from the drop-down menu select ‘Copy Shortcut’. Job done. You now have the correct URL for the flash movie (apart from the name but you know that already). It you go back to the code I added earlier you can highlight the path that is there and paste your correct URL over the top, remembering to change the filename at the end.
If you want to read more about inserting Flash into a webpage I found this really interesting article on AListApart, why not take a look.