JavaScript EditorBest javascript editor debugger     Ajax website 
↑


Main Page

Previous Page
Next Page

Embedding Google and YouTube Video

Google and YouTube (and others) now offer a server where you can upload your video files (which tend to be of considerable size) and make them available to your visitors.

To embed Google Video:

1.
Go to Google Video and display the video you want to embed (http://video.google.com/).

2.
Copy the document id number from the Address bar. It comes right after docid=- and continues until the ampersand (&).

3.
Follow the steps for embedding Flash given on the previous page. In the two instances where you must insert the URL for the Flash animation, type http://video.google.com/googleplayer.swf?docId=-n, where n is the document id you copied in step 2. Note there are no spaces and after docId (with a capital I) comes an equals sign (=) and then a dash (-), before the number itself.

Figure 18.50. Search for the desired video on Google Video. Copy its document id from the Address bar, starting after docid=- and continuing until the first ampersand (&).


To embed YouTube Video:

1.
Go to YouTube and view the video you want to use (http://www.youtube.com).

2.
Copy the movie code from the Address bar. It comes right after the v= and continues until the first ampersand (&).

3.
Follow the instructions for embedding Flash given on the previous page. In the two places where you must insert the URL for the Flash animation, type www.youtube.com/v/moviecode, where moviecode is what you copied in step 2.

Figure 18.51. Use the Google video's document id to construct the URL in the regular Flash embedding code from page 305.


Figure 18.52. The video will now play from within your Web page.


Tips

  • Note that Google uses docid (with a small i) to reference the movie, but you must use docId (with a capital I) in your URL in step 3. Like it wasn't hard enough.

    Figure 18.53. Search for the desired video on YouTube. Copy its movie code from the Address bar, starting after v= and continuing until the first ampersand (&).

  • Similarly, when you grab the movie code for a YouTube movie, it comes after v=. But when you construct your URL for referencing the movie, you use v/.

    Figure 18.54. Use the YouTube video's movie code to construct the URL in the regular Flash embedding code from page 305.

  • Both Google and YouTube offer code for embedding their videos on Web pages. Unfortunately, the code they suggest is non-standard and does not validate because it needlessly uses the embed tag.

    Figure 18.55. The YouTube video plays from inside the Web page. (This is the YouTube version of the same movie that we embedded from Google Video on the previous page.)

  • In my tests using this technique, both Google Video and YouTube movies stream correctly with no extra reference files.

  • Currently, when you upload video to Google Video you can decide (in the Advanced Options section of the Video Information) whether or not other people have the right to embed your video on their pages. Video can either be embedded everywhere or nowhere. In other words, if you can embed it on your site, someone else can embed it on theirs.

  • Google Video also lets you decide whether or not viewers can download your video.

  • You can embed interactive Google Maps, too. See http://www.google.com/apis/maps/.



Previous Page
Next Page


JavaScript EditorBest javascript editor debugger     Ajax website 
→