Here are some handy capture Video and Audio tools that allow you to save and embed content from the web.¬† Additionally I have placed some other handy add-on's and tools that make for a better web surfing experience.
Goals of this Post:
1.¬† Learn how and why to manipulate and save video from the Web.
2.¬† Learn how and why to convert video from various video codecs for playback on mobile devices.
3.¬† Learn how to extract audio tracks from Video files on youtube.
4.¬† Learn how to add plugins to Firefox that allow customizations and more features.
5.¬† Learn how to embed video as a link on a WordPress Page.
6.¬† Learn how to embed Video directly and have it play natively in a WordPress based page.
Get Latest Version of Firefox and Other Useful Apps
To Start lets pick the browser that allows the most customizations - Mozilla Firefox.¬† (Chrome or Chromium would be a close second).
Latest Version of Firefox (14.01 Mac)
HandBrake - best Overall Video to iOS Converter for Mac (Great Converter for other things as well)
VLC (VideoLAN) - Best Overall Video Player for all Computers Period.¬†¬†
Here is a quick Podcast tutorial on how to install
(Click Here to Download or Watch Below)
¬†Add Plugins to Firefox
With the latest version of Firefox installed now lets add a couple of basic plugins that will make overall surfing the web better/ faster.
¬†AdBlock Plus(Firefox Version)
This is a great plugin as it simply is designed to try and remove/block advertisements from as many websites as possible.¬† In terms of both network flow and user enjoyment advertisements waste both bandwidth and time.¬† With more and more people connecting to the web it has evolved since the early 90's and now is heavily inundated with adds and at times can resemble TV.¬† Not a perfect plugin but overall helps things run smoother and web pages are slightly less annoying with ads.
Video Download Helper Version 4.99 for Firefox
This is my favorite video download plugin.¬† What it does is extract the source file from as many video based sites as possible allowing you to save the video file locally.¬† Site works well on youtube and many other popular video hosting sites.¬† Look youtube is great,¬† easy to use, easy to upload but in the last year or two has taken a couple steps closer to TVness.¬† Notice the number of advertisements in the form of 30 second commercials and banners across the bottom, yes believe it or not there was a time when youtube did not have ads.¬† Now with the help of Adblock Plus and Video Download helper you can quickly download a video and save it, allowing you to play it back to your class or embed in your own website advertisment free :).
Using Download Video Helper
Here is a screenshot of me using Video Download Helper to download a YouTube Video.¬† Notice where I have put a little red circle,¬† if you see the little triangle next to the floating balls symbol this is where you can save the video.¬† When the three colored balls are lit up and rotating this means that video download helper has found video it can extract.¬† If the three balls are grey and not moving, Video Download helper is unable to access the video source.
In the example below notice there are lots of different options to choose from.¬† You will see 240p flp, 360 flp, something.3gp, etc.¬† The rule of thumb here is always get the MP4 Version if it is available.¬†¬† Apple and Apple Products (iPad, iPhone) like MP4.
¬† You can see in my screenshot I have selected the MP4 option and can now DOWNLOAD and save where I want.
Okay so lets say that you have done this but none of the optoins let you save the file as MP4.¬† You are not out of luck here you just now need to do an extra step and convert the video to MP4.¬† You will want to convert the Video to MP4 if you want visitors to be able to view your video on an iPad, iPhone, iPod, etc.¬† If your audience is using a full computer this is uncessary.
Converting Video to MP4
Okay again let me cover the why this is something you may want to do.¬† MP4 is a video container and codec that Apple uses and this format can be played on iPad, iPhones, iPods, Computers you name it.¬† The FLV format is flashed based and can only be played by devices that have flash installed - there is no flash on ios devices.
Video download has a built in converter but I have found that it does not really work that well with FFMpeg installed.¬† So instead to convert I recommend using Handbrake.
With VLC and Handbrake installed - Handbrake can convert videos into formats that are easily playable on the ipad.¬† For example I will download a FLV video off of youtube and then convert with Handbrake to MP4 (iPhone Optimized).¬† Here is a quick podcast on doing a conversion with Handbrake.
Click Here to Download Podcast or Watch Below
Converting YouTube to MP3 Audio Files
Often users find it useful to create a quick audio file from a youtube video. ¬†This process is quite easy thanks to a useful site called youtube-mp3.org
¬†. ¬†Process is easy to do you simply copy and paste a youtube URL into the youtube-mp3.org box and hit convert.
Click here to download a quick podcast on using youtube-mp3.org or watch below.
Embedding into WordPress using the Embed-Width Plugin
If you would like to make it so someone visiting your website can view the video natively on iPads, iPhones, iPods, Android Based, PC or Mac directly on your website itself you can using a plugin called Embed Width. ¬†There are actually a few plugins and methods in which you can do this but this one seems to work well and have tested it out on iOS and Android devices.
Here is a screenshot viewing this site from an iPhone notice the videos can be easily played and viewed.
To do this takes a bit more effort so I have placed this final podcast at the bottom of the post. ¬†So lets say you have a video you have saved from the internet and converted to mp4 and now want to embed to play natively in the web browser. ¬†Watch the Podcast Below to show how I embed a video using the Embed-Width plugin.
Click here to download the Podcast or Watch Below.
Other Ways to Embed - HTML 5 Method & Podcast Producer
Link to my website on Post on HTML 5 Direct Embedding Method.
Using Podcast Producer and Embedding (older version)
Another way to save YouTube - Keepvid.com