Log in

No account? Create an account

rhoboat in vidding

Tutorial: Streaming from your own website

I'm posting this in response to the news posted by vchrusch that Imeem will no longer be allowing vids on their site.

Here's the tutorial for how to stream on LJ.

This tutorial shows you how to stream video from your own website using free software and HTML. The settings here are for SUPER (Win only) which are different than the ones I use with On2's Flix ($39 Win or Mac). It seems that Flix generates better quality, and to me, it's an easier program to use. guest_age has also recommended Visual Hub for Mac users.

1) Windows users can download SUPER to convert videos to Flash (FLV) format. (It's free software, so they make it kinda hard to find the actual download link.) I think SUPER will convert pretty much whatever video file type you can throw at it.

Once you've installed SUPER, you'll see something like this:

For a 16:9 streaming video file, try these settings.
Output: swf/flv (Flash), Flash video codec, mp3 audio codec
Video: 640x360, 16:9, 25fps, 1056 kbps bitrate. Keep Hi Quality, Top Quality, and Stretch It checked, and Uncheck 48K audio.
Audio: 22050 Sampling Freq, 2 Channels, 64 kbps bitrate

You can try different settings to suit the frame sizes and frame rates of your own videos. I try to keep my streaming files around 25 mb or less, depending on the length of the vid.

Once you have your FLV file, you can upload it to a folder on your website.

For Mac users using Visual Hub, guest_age has posted some settings screen shots here.

2) Download the JW FLV Media Player. Unzip the file and upload all of those files into a folder on your website. (The folder is "flvplayer" in this example.)

3) Lastly, you need the embedding code. Use this SETUP WIZARD.

Click on the "Embed parameters" link and enter the following:
Source:http: //www.YOURWEBSITE.com/flvplayer/player.swf
Height: 380 (Note: +20 pixels to make room for the control bar on the bottom)
Width: 640

Click on "File properties" and enter the location of your FLV file.
File: http: //www.YOURWEBSITE.com/streaming/YOURFLV.flv

Click on "Update Preview & Code" and copy/paste the generated code into an HTML file and upload that HTML file to your website.

That's it for a very bare-bones streaming video file hosted on your own website! Click here for a sample.

You can play with all the embedding code parameters for different colors and such, and you can even download pretty skins for your FLV player. If you want to change the video frame size, you might want to test out different embedding heights and widths so that you don't have black bars with your video.

If you're using a blog or any other content management system, you might need a plug-in to work with streaming files. For anyone wondering, on my own site, I use Joomlawith the All Videos plug-in.

I'll be tracking this post, so if anyone has any questions, hopefully I'll be able to answer. :)


This is great. Thank you! I'm going to bookmark it to try in the future.
You're welcome! If you run into any issues, I'm tracking this post, so hopefully I'll see and be able to answer any questions. Or PM me even. :D
Seconded. This looks like a great resource.
Thank you so much for this tutorial. I'll be trying it out!
Thanks for doing this - I really ought to pull my finger out and try this sometime.
This looks really, insanely awesome. Thankyou!
fantastic, thank you so much!
(It's free software, so they make it kinda hard to find the actual download link.)

Yeah, you're right, they really do. So where *is* the actual download link? The one at the top of the page appears to be for an entirely different program. :-\
There's a link at the bottom of the page that says "Start Downloading SUPER." Click on that, and then on the next page, there should be a link that says "SUPER is a FREE Multimedia software to download and use." Click the part that's underlined, and then on the bottom of the last page, click "Download SUPER setup file."

The problem with linking directly is they periodically change the locations of the actual files/links, so only the main page is a reliable link.
Okay, thanks. I've followed all the steps but I must be doing something wrong because it's still not working. Do I have to disable hotlink protection or something?

(Thank you so much in advance for your help!)
Yup, you might need to disable hotlink protection. I have hotlinking protection in place as well, but I also have a set up where I can allow a few select sites for streaming, hosting pics, etc. Hope that helps!
Okay, I've done that but I'm still getting the same thing, which is a line of text saying "This text will be replaced" instead of the actual player. Do I need to do an IMG SRC type of thing?
Do you have a script blocker with your browser? You might need to allow the outside sites that link the player to play the flash files.
I've been using these steps for a while now and just realized that I never commented. Thanks so much for this, it's been really helpful. In addition to videos, I also use the player for posting music including whole playlists. That JW player is really pretty awesome.
What settings do you recommend to get a full quality vid? I upped mine and it's still not quite up to what I'm used to with vimeo. Any suggestions would be great.

ETA: I can't seem to get the sizing right either.

Here's my practice embed:

It's under the vimeo embed. I chose "no change" when I ran SUPER so I'm not sure why it seems to be cutting off the edges. Are there any settings I may be missing?

Edited at 2011-03-31 12:58 am (UTC)
With SUPER, you're probably not going to get the same kind of quality at the same file sizes. For one, VIMEO encodes to an MP4 container. As far as sizing, it'd help to know what your embed coding is, but otherwise, it's a lot of trial and error to get rid of the bars.
Do you have any suggestions for creating an MP4 that will stream using the JWPlayer? I used zarx to compress with my last video and and that turned out beautifully. (Although it took almost two weeks to figure out how to get it to play in quicktime because I'd made a dumb rookie mistake.)

But when I try to use that to stream at my site, it doesn't play. I know very little about file types and apparently some MP4s are suited for streaming and some or not. The question is how do I get my MP4 to work on my site.

Have you had any experience with this?
Sorry, I've only ever streamed FLVs. I know that MP4s are newer/prettier, but I haven't had time to work it out for streaming. Besides which, my MP4 downloads tend to be twice as big as my FLV streams, so there's bandwidth to consider. I'm sure someone out there has figured out the proper settings for MP4 streaming. Maybe at other forums like AMV.org?
Thanks. I will probably go over there. They helped me figure out my quicktime compatibility issue, but I thought I might see if you knew anything about the streaming issue first.

charmax 2

February 2018



Powered by LiveJournal.com