Embedding the Image Window
Putting the Real G2 clip in a Web page simply requires an <embed> tag and appropriate attributes.

<embed width="176" height="132" src="rides.rpm" controls="ImageWindow" nojava="true" console="_master">
</embed>

Notice the "rides.rpm" file. This metafile follows the same format as a RAM file. The difference is the ".rpm" extension which will force the Real plug-in to load instead of the RealPlayer.

The "controls" attribute designates the control or image window to appear. The "nojava" attribute prevents the browser's Java Virtual Machine from launching (which would cause a delay in playback). "console" designates the identity of the embedded control or window (if you need more than one embed tag). Summed up, the above embed tag and attributes will load the streaming media clip into a display window 176 by 132 pixels wide.

Adding a Play Button
Having the clip display is great but I want to add some user control. I need a play button. So I add an additional embedding tag.

<embed src="rides.rpm" width="44" height="26" nojava="true" controls="PlayButton">
</embed>

I now have two embed tags in my HTML. The "controls" attribute is identified as a play button. My smaller width and height in the second embed tag reflect the size of the play button.

Real offers a wide array of control options for the Web producer. Simply choose as many controls as you like and add an appropriate embed tag with attributes. For further information on embedding your RealMedia, consult the Real G2 documentation.

Testing Our Work
With our image window and play button tags in place, I'm ready to upload my files and test my embedding. If you have the G2 player installed in your browser, you should see the result below.

That does it for our Real G2 Basics. We'll come back and visit some additional RealMedia topics farther down. But it is time to move on and our next upcoming installment will look at Microsoft's Windows Media Technologies.