Section 16.2. Using Snippets | Dreamweaver 8[c] The Missing Manual

16.2. Using Snippets

Snippets come in two varieties: those that are a simple block of code and those that wrap around whatever you've currently selected in the document. For example, in the Text folder of the Snippets tab, you'll find a snippet called Service Mark. Adding this snippet to a page instantly inserts the code <sup>sm</sup> , creating a superscript service mark (sm) symbol.

But on occasion you may want to wrap code around something you've already typed. You may want to add an HTML comment to your page (a message that won't appear in a Web browser, but that you can use for helpful notes to yourself or other Web designers). The "Comment, multi-line" snippet (in the Comments folder) can help you quickly add such comments. It wraps whatever you've selected with opening (). Adding an HTML comment is as easy as typing the comment, selecting it, and then inserting this snippet. (This may sound a lot like the Apply Comment button in the Coding toolbar described on Section 9.2.1. The cool thing about this snippet is that it works in Design view, too, not just Code view.)

Note: Unfortunately, unless the snippet's description (visible in the Snippet Panel's Description column) specifies that the snippet wraps, there's no way to tell whether a snippet is intended to wrap around a selection. You either have to try the snippet or open the snippet in editing mode (see Section 16.3) to find out. (While you've got the snippet open , you can add a note to its description indicating its ability, or inability, to wrap.)

To add a snippet to a Web page, click in the document where you want the item to go, or select the object you wish to wrap with a snippet. Then do one of the following:

Double-click the name of the snippet on the Snippets tab of the Files panel.
Select the snippet on the Snippets tab, and then click the panel's Insert button.
Drag the snippet from the panel into the document window. (If the snippet's supposed to wrap a selection, drag the snippet onto the selected object.)

Snippets can be used in either Design or Code view (see Section 9.2), but some snippets make sense only in Code view. For example, the JavaScript snippets that come with Dreamweaver typically have to be inserted in the <head> of a page, inside <script> tags. To use them, you must switch to Code view, insert the script tags, and then put the snippets inside.

Tip: Dreamweaver 8 provides a fast way to add a snippet you've recently used. Select the snippet from the Insert

Recent Snippets menu. Better yet, create a keyboard shortcut for your favorite snippets and insert them with a quick keystroke as described on Section 19.1.