My last article described how to embed SWF in your web page. The main problem associated with this is that the flash video plays automatically. If the video is 10 minutes long viewers will need to wait patiently for it to finish or click out of the web page. This can be very frustrating and may turn off your visitors. It’s better to offer them a control bar.
One of the best solutions to this problem is to use the Flash Player named Flowplayer. It enables you to easily embed a flash video file in your web page and allow visitors to control the playing (ie start or stop the video).
To see how the flash media player looks on a web page visit:
Paul Koko Fashion Design Gallery
What is Flowplayer?
It’s a flash media player that allows you to easily play and control the video from your web page. It’s hosted on a global streaming network and allows extensive customization.
Video formats supported by Flowplayer include FLV, MP4 and H.264. To convert your original video to any of these formats use youconvertit.com…a free online service that converts media files to different formats.
The free version of Flowplayer is sufficient to play your flash video however you can purchase a commercial license if you don’t want the logo displayed at the beginning of the video. (I hardly noticed it).
How to embed flash video on your web page with a control bar
1. Download the flash video player (Flowplayer)
After downloading the zipped file, unzip it it to a folder on your hard drive
The Flowplayer folder contains all these files:
2. Upload the Flowplayer folder to your server.
This will enable you to first test if the example video works on your server. After uploading the folder insert this URL in your browser ie http://www.yourdomain.com/flowplayer/example/index.html (replace yourdomain.com with your own domain).
If it doesn’t work check you uploaded all the files correctly and used the correct file paths.
3. Create folders on the server to play your own video
Create a folder on your server named “video” and put these 3 files inside it:
video.flv (your own video file)
Upload both these folders to your web server.
4. Create the html code to add your video file and the flash media player (Flowplayer)
<!-- this A tag is where your Flowplayer will be placed. it can be anywhere -->
<!-- this will install flowplayer inside previous A- tag. -->
The center tags are to center the video on the web page.
Make sure you save the web page to retain your changes.
5. Upload the web page to your server
Your video won’t play correctly if the web page containing the code is not uploaded to the server.
6. Test your video
Enter the URL of your web page in your browser. It should play immediately and display a control bar underneath so your visitors can stop the video whenever they want.
For most users the default behavior is sufficient however Flowplayer allows you to further configure how the video displays on your web page. Customization options may include:
- changing the background color
- use a different control bar
- place a clock on the screen
- have a splash image displayed
- load playlists
Now you have no excuse to play a cool video on your web page.
Embed SWF in Your Web Page
And now I would like to invite you to claim your FREE report titled:
7 Habits of Highly Effective Traffic Generation
Herman Drost is the owner and author of
Web Design, SEO, Article Marketing