Learn how to insert and edit media objects in Dreamweaver web pages, use Design Notes, and more.
In addition to SWF and FLV files, you can insert other audio or video objects in a Dreamweaver document. If you inserted accessibility attributes with a media object, you can set the accessibility attributes and edit those values in the HTML code.
In the HTML category of the Insert panel, and select the icon for the type of object you want to insert.
Select the appropriate object from the Insert > HTML submenu.
A dialog box appears letting you select a source file and specify certain parameters for the media object.
To prevent such dialog boxes from appearing, select Edit > Preferences > General (Windows) or Dreamweaver > Preferences > General (Macintosh) and deselect the Show Dialog When Inserting Objects option. To override whatever preference is set for showing dialog boxes, hold down the Control (Windows) or Option (Macintosh) key while inserting the object.
The Accessibility Attributes dialog box appears if you have chosen to show attributes when inserting media in the Edit > Preferences dialog box.
You can also edit media object attributes by selecting the object and editing the HTML code in Code view, or right-clicking (Windows) or Control-clicking (Macintosh), and selecting Edit Tag Code.
Enter a title for the media object.
Enter a keyboard equivalent (one letter) in the text box to select the form object in the browser. This lets a visitor to the site use the Control key (Windows) with the Access Key to access the object. For example, if you enter B as the Access Key, use Control+B to select the object in the browser.
Enter a number for the tab order of the form object. Setting a tab order is useful when you have other links and form objects on the page and need the user to tab through them in a specific order. If you set tab order for one object, be sure to set the tab order for all of them.
If you click Cancel, a media object placeholder appears in the document, but Dreamweaver does not associate accessibility tags or attributes with it.
To specify a source file, or to set dimensions and other parameters and attributes, use the Property inspector for each object. You can edit accessibility attributes for an object.
You can start an external editor from Dreamweaver to edit most media files. You can also specify the editor you want Dreamweaver to start to edit the file.
To find out what editor is associated with the file type, select Edit > Preferences in Dreamweaver and select File Types/Editors from the Category list. Click the file’s extension in the Extensions column to view the associated editor or editors in the Editors column. You can change the editor associated to a file type.
The editor that starts when you double-click the file in the Files panel is called the primary editor. If you double-click an image file, for example, Dreamweaver opens the file in the primary external image editor such as Adobe Fireworks.
In the Files panel, right-click (Windows) or Control‑click (Macintosh) the filename and select Open With from the context menu.
In Design view, right-click (Windows) or Control‑click (Macintosh) the media element within the current page, and select Edit With from the context menu.
You can specify the editor you want Dreamweaver to use for editing a file type, and add or delete file types that Dreamweaver recognizes.
Filename extensions, such as .gif, .wav, and .mpg, are listed on the left under Extensions. Associated editors for a selected extension are listed on the right under Editors.
To associate a new editor with the file type, click the Plus (+) button above the Editors list and complete the dialog box that appears.
For example, select the application icon for Acrobat to associate it with the file type.
To make an editor the primary editor for a file type (that is, the editor that opens when you double-click the file type in the Files panel), select the editor in the Editors list and click Make Primary.
To dissociate an editor from a file type, select the editor in the Editors list and click the Minus (-) button above the Editors list.
For example, you might enter .xml .xsl if you wanted to associate them with an XML editor installed on your system.
You can’t undo after removing a file type, so be sure that you want to remove it.
As with other objects in Dreamweaver, you can add Design Notes to a media object. Design Notes are notes associated with a particular file, that are stored in a separate file. You can use Design Notes to keep track of extra file information associated with your documents, such as image source filenames and comments on file status.
You must define your site before adding Design Notes to any object.
You can also add a Design Note to a media object from the Files panel by selecting the file, revealing the context menu, and choosing Design Notes from the context menu.
You can add video to your web page in different ways and using different formats. Video can be downloaded to the user or it can be streamed so that it plays while it is downloading.
These clips are often in the AVI or MPEG file format.
To link to the clip, enter text for the link such as “Download Clip”, select the text, and click the folder icon in the Property inspector. Browse to the video file and select it.
The user must download a helper application (a plug‑in) to view common streaming formats like Real Media, QuickTime, and Windows Media.
You can create content such as a QuickTime movie for a browser plug‑in, and then use Dreamweaver to insert that content into an HTML document. Typical plug‑ins include RealPlayer and QuickTime, while some content files include mp3s and QuickTime movies.
You can preview movies and animations that rely on browser plug‑ins directly in the Design view of the Document window. You can play all plug‑in elements at one time to see how the page will look to the user, or you can play each one individually to ensure that you have embedded the correct media element.
You cannot preview movies or animations that rely on ActiveX controls.
After inserting content for a plug‑in, use the Property inspector to set parameters for that content. To view the following properties in the Property inspector, select a plug‑in object.
The Property inspector initially displays the most commonly used properties. Click the expander arrow in the lower-right corner to see all properties.
In the Common category of the Insert panel, click the Media button and select the Plugin icon from the menu.
Select Insert > Media > Plugin.
Specifies a name to identify the plug‑in for scripting. Enter a name in the unlabeled text box on the far left side of the Property inspector.
W and H
Specify, in pixels, the width and height allocated to the object on the page.
Specifies the source data file. Click the folder icon to browse to a file, or enter a filename.
Specifies the URL of the pluginspace attribute. Enter the complete URL of the site where users can download the plug‑in. If the user viewing your page does not have the plug‑in, the browser tries to download it from this URL.
Determines how the object is aligned on the page.
V Space and H Space
Specify the amount of white space in pixels above, below, and on both sides of the plug‑in.
Specifies the width of the border around the plug‑in.
Opens a dialog box for entering additional parameters to pass to the plug‑in. Many plug‑ins respond to special parameters.
You can also view the attributes assigned to the selected plug‑in by clicking the Attribute button. You can edit, add, and delete attributes such as width and height in this dialog box.
Select one of the media elements you have inserted, and select View > Plugins > Play or click the Play button in the Property inspector.
Select View > Plugins > Play All to play all of the media elements on the selected page that rely on plug‑ins.
Play All only applies to the current document; it does not apply to other documents in a frameset, for example.
You can also select View > Plugins > Stop All to stop all plug‑in content from playing.
If you have followed the steps to play plug‑in content in the Document window, but some of the plug‑in content does not play, try the following:
Make sure the associated plug‑in is installed on your computer, and that the content is compatible with the version of the plug‑in you have.
Open the file Configuration/Plugins/UnsupportedPlugins.txt in a text editor and look to see if the problematic plug‑in is listed. This file keeps track of plug‑ins that cause problems in Dreamweaver and are therefore unsupported. (If you experience problems with a particular plug‑in, consider adding it to this file.)
Check that you have enough memory. Some plug‑ins require an additional 2 to 5 MB of memory to run.
You can add behaviors to your page to start and stop various media objects.
Control Shockwave Or Flash
Play, stop, rewind, or go to a frame in a Shockwave movie or SWF file.
Lets you play a sound; for example, you can play a sound effect whenever the user moves the mouse pointer over a link.
Lets you check to see if visitors to your site have the required plug‑in installed, then route them to different URLs, depending on whether they have the right plug‑in. This only applies to plug‑ins, as the Check Plugin behavior does not check for ActiveX controls.
Define special parameters to control SWF files and plug-ins. Parameters are used with the object, embed, and applet tags. Parameters set attributes specific to different types of objects. For example, a SWF file can use a quality parameter <paramname="quality"value="best"> for the object tag. The Parameter dialog box is available from the Property inspector. See the documentation for the object you’re using for information on the parameters it requires.
There is no widely accepted standard for identifying data files for ActiveX controls. Consult the documentation for the ActiveX control you’re using to find out which parameters to use.
Select an object that can have parameters in the Document window.
Open the Property inspector if it isn’t already open, and click the Parameters button found in the lower half of the Property inspector. (Make sure the Property inspector is expanded.)