dcsimg
A Flash Developer Resource Site

Results 1 to 5 of 5

Thread: How to put video on your web site?

  1. #1

    How to put video on your web site?

    What is FLV and why choose FLV video format?

    FLV (Flash Video) is a proprietary file format used to deliver video over the Internet via Adobe Flash Player (formerly known as Macromedia Flash Player) version 6, 7, 8, or 9.

    Recently FLV video format is the preferred and most popular video format for web video delivering. A number of notable Websites, such as Youtube, Google video and Reuters, use FLV format. FLV video is supported by all popular browsers (IE, Firefox, Safari, Opera…) and viewable on different operating systems (MacOS, Windows, and Linux). You just need a SWF file working as a media player with screen and playback controls, and embed Flash video in (or link it to) the SWF player to display the video on your web page.
    Useful Software

    * Video Encoder for Adobe Flash
    * JW FLV Player
    * Free FLV Player

    Host the video on your own site

    If you don’t want your video to be watermarked by Youtube or other video hosting website, you should convert your video yourself, and host the converted FLV video yourself. And you can specify the conversion settings freely (such as bitrate, sample rate, frame rate), so that you can get the FLV video with better quality.
    Choose an appropriate Flash video converter and Flash video player

    There are a number of video to FLV converters which you can find on the Internet ranging in price from free to over $100, such as Riva FLV converter (free), Video Encoder for Adobe Flash ($45), Geovid Video to flash Converter ($99.95), Flash Video MX Pro($89), Flash Video Studio(49.95), Sorenson Squeeze 4.5 ($249), Some converters can only convert video to FLV format, not providing Flash video player which is a SWF file you must have to play Flash video on the Web. You can create a Flash video player yourself using Flash authoring tool, or you can download a free Flash video player directly (JW FLV Player is recommended). And some Flash video converters provide Flash video players. For example, the software Video Encoder for Adobe Flash I chose here, enables users to configure the conversion settings freely to get the ideal quality, and can create a Flash video player automatically with customizable playback control skins. The created Flash video player can auto-adapt to the video’s width, height and aspect ratio, thus the FLV video can be displayed without black bars (See the screenshot below). It’s very impressive!

    Youtube Flash video player:

    Flash player provided by Video Encoder for Adobe Flash:

    Convert video to FLV format step by step

    * Step 1. Load the video
    Launch Video Encoder for Adobe Flash. Click “Select…” and choose a video file that you want to convert.
    * Step 2. Edit the video
    Click “Crop & Trim”, if you want to edit the source video. You can crop the video, if you want to remove blackbars, or just want a part of the picture. You can trim the video, if you just want to convert a certain duration of video.
    * Step 3. Configure the conversion settings
    Select “User-defined” to enable yourself to customize the audio and video settings. And specify the audio setting and video settings properly. You can check the help file to find more detailed guidance.
    * Step 4. Specify output settings
    Specify an output folder to save the created FLV and SWF files. Check both “Generate FLV” and “Generate SWF “.If you want to create a SWF player which can play different FLV files dynamically, you should choose “Get the FLV path from a URL variable and play progressively“. Then you need to specify a URL variable name (in the right blank), then the created SWF player can get the FLV path from HTML code using this variable name.
    Otherwise, you can simply choose “Play the created external FLV file progressively“.
    * Step 5. Choose skin for Flash video player
    Select a color scheme and style you like. Choose “Classic (Black, Full)” for example. “Full” control panel provides all controls including Play, Pause, Fast forward/backward, Volume control, Mute, Elapsed Time and Duration.
    * Step 6. Start conversion
    Click “Next” to start conversion. It will take a few minutes.
    After the conversion finishes, open the output folder, then you can see the created “.flv” and “.swf” files. You can also use free software FLV Player to play the .flv video directly to see if its quality is good enough. If not, you need to convert the video again, and try some different conversion settings.


    Put the FLV video on Web page step by step.

    * Step 1. Upload the created “.swf” file and the “.flv” video file to the same folder on your server. For example, if you want to show the video on http://www.myhomepage.com/index.htm, then upload the “.swf” and “.flv” files together to the path http://www.myhomepage.com/.
    * Step 2. Add the following html code to your page and customize the relating parameters.If you have chosen “Get the FLV path from a URL variable and play progressively” , then
    add code:
    <object classid=”clsid:d27cdb6e-ae6d-11cf-96b8-444553540000″ codebase=”http://download.macromedia.com/pub/shockwave/
    cabs/flash/swflash.cab#version=7,0,0,0″ width=”400″ height=”300″
    id=”flashvideoplayer.swf” align=”middle”>
    <param name=”allowScriptAccess” value=”sameDomain”>
    <param name=”movie”
    value=”http://www.myhomepage.com/flashvideoplayer.swf?
    flv=http://www.myhomepage.com/myvideofile.flv“>
    <param name=”quality” value=”high”>
    <param name=”bgcolor” value=”#ffffff”>
    <embed src=”http://www.myhomepage.com/flashvideoplayer.swf?
    flv=http://www.myhomepage.com/myvideofile.flv” quality=”high” bgcolor=”#ffffff” width=”400″ height=”300″ name=”flashvideoplayer.swf
    align=”middle” allowScriptAccess=”sameDomain” type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer”>
    </object>

    And customize the parameters:
    Replace “myvideofile.flv” with your FLV filename;
    Replace “flashvideoplayer.swf” with your SWF filename;
    Replace “http://www.myhomepage.com/” with your own address;
    Replace the “width” and “height” with your flv file’s width and height. Specify the “quality” and “bgcolor” as you want.
    In the code above, flv is just the URL variable name that you should have specified before conversion. The player can automatically get the URL variable’s value (http://www.myhomepage.com/myvideofile.flv), and play the Flash Video.

    If you have chosen “Play the created external FLV file progressively “, then
    add code:
    <object classid=”clsid:d27cdb6e-ae6d-11cf-96b8-444553540000″ codebase=”http://download.macromedia.com/pub/shockwave/
    cabs/flash/swflash.cab#version=7,0,0,0″ width=”400″ height=”300″
    id=”flashvideoplayer.swf” align=”middle”>
    <param name=”allowScriptAccess” value=”sameDomain”>
    <param name=”movie”
    value=”http://www.myhomepage.com/flashvideoplayer.swf“>
    <param name=”quality” value=”high”>
    <param name=”bgcolor” value=”#ffffff”>
    <embed src=”http://www.myhomepage.com/flashvideoplayer.swf” quality=”high” bgcolor=”#ffffff” width=”400″ height=”300″ name=”flashvideoplayer.swf” align=”middle” allowScriptAccess=”sameDomain” type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer”>
    </object>

    And customize the parameters:
    Replace “flashvideoplayer.swf” with your SWF filename;
    Replace “http://www.myhomepage.com/” with your own address;
    And replace the “width” and “height” with your flv file’s width and height. Specify the “quality” and “bgcolor” as you want. The Flash video player has the “.flv” file’s URL when it is created. So you don’t need to specify it in the code.

    Key steps summary
    It is simple to put your video on your own site: Step 1, convert your video to FLV format, and create a Flash video player for it; Step 2, Upload the created files to your server, add the code to your webpage, and specify the right

    Tags: converter, flash video, flash video encoder, flv, flv encoder, share flv, upload flv, video share, video to flash, video to flv, web video

  2. #2
    Member
    Join Date
    Apr 2009
    Posts
    45
    looks like that did it. thanks. i'll post back if there are any problems when the whole thing is done. thanks again.

  3. #3
    Banned
    Join Date
    Oct 2008
    Posts
    74
    In my own opinion, you can convert your video to FLV (recommended with Video4Web Converter)
    Then make a flash video player in Adobe Flash CS3, drag the FLVPlayback component to the stage, set the source FLV fils, add control bar, and set other parameters of the player.
    If it is too technical, you can use the flash video player maker called Web Player Pro, it is a easy solution with its graphical interface.

  4. #4
    Junior Member
    Join Date
    Apr 2009
    Posts
    1
    I recommended Web-Anatomy player (http://flv-player.web-anatomy.com/), easy installation and configuration

  5. #5
    Member
    Join Date
    Apr 2009
    Posts
    45
    wonderba, thanks for sharing, I try it, I like it and I haven't any problem with converting my camera avi video files to flv for puting on my homepage.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center