Adding flash animation to a website

How do you

import your flash animation

into your website?

Presentation by www.bubblefruit.com Website design & development


First save your file in aknown folder


Now click on publish settings


Ensure you are on the formats tabCheck boxes flash & HTML are checked


1. Click on HTML tab2. Depending how you wouldlike the animation to run check and un-check the required boxes.

In our example we want the animation to run when loaded and play just once.

By checking loop for example would cause the animation to keep repeating.3. Click publish


Once you have clicked publish Flash will generate 3 files in the folder you saved the animation in.


Now these file are stored locally on your PC in your named folder.

We have to get these 3 files onto your website domain. If you have created your own website and used a website design package then you should be able to upload the files via the FTP facility.

If you have no idea what I'm talking about then we do have a free user guide to FTP Coming soon on this blog. Don't be scared this is just a way of getting files from your PC to a website......cont


If your using a 3rd party design package like Webeden or 1on1 websites the these will have a container to drop the flash Java script into.

I know this part can get complicated as there is so many methods and packages that can do this FTP process. To list and show you all these would take a lifetime :-)

In this example I'm going to use FileZilla, this is a FTP (file transfer protocol) program and free to download and use, we like free stuff :-)


1. Enter your website FTP settings,Host, username & password


2. This window contains your local ( that's files on your PC's hard disk)Find the folder you saved you flash animation in.


3. Once Filezilla connects to your website these boxes will fill with folders andfiles. These are folders and files that make up your websites file structure. Just like your PC choose a destination for this flash animation. Note, remember where you save this so you can find it on your websites URL e.g. www.bubblefruit.com/demo/


4. Highlight the folder with the files in and left click, this now brings up an uploadwindow. Click Upload and the file transfer process will start to upload the folder to your designated location on your website .


Once this process completes you will see the new folder appear on the your websites file structure


We can now test the animation on the website, the animation will run in a web browser under the URL that you saved it in.

In our example we saved the demo folder in the root directory of our website e.g.

www.bubblefruit.com/demo/

The file the browser will run is the .html file. We saved our animation as demo so the file will be demo.html. Full URL will be

www.bubblefruit.com/demo/demo.html


Although we have managed to test and run our animation within the browser, this does not help use get this snippet of animation into a website page with other text and images.

We need to copy the Javascript code that has been placed in the demo.html file and paste it into our desired website page.

This is easy to copy ... cont


1. Go to the browser displaying the animation and right click the blank part of the page away from theanimation. Now select view page source.


2. The code we need to copy is between and including the

Adding flash animation to a website

Technology

Transcript of Adding flash animation to a website