Using Dreamweaver, web developers can edit and save reusable blocks of code in the Snippets panel and retrieve them as needed.

The Snippets panel stores each code snippet in a CSN file within the Configuration/Snippets folder. Snippets that come with Dreamweaver are stored in the following folders:

  • Accessible

  • Comments

  • Content_tables

  • Filelist.txt

  • Footers

  • Form_elements

  • Headers

  • Javascript

  • Meta

  • Navigation

  • Text

Snippet files are XML documents, so you can specify the encoding in the XML directive, as shown in the following example:

 <?XML version="1.0" encoding="utf-8">

The following sample shows a snippet file:

 <snippet name="Detect Flash" description="VBscript to check for Flash ActiveX control" preview="code" factory="true" type="wrap" > 
    <insertText location="beforeSelection"> 
        <![CDATA[ ------- code --------- ]]> 
    </insertText> 
    <insertText location="afterSelection"> 
        <![CDATA[ ------- code --------- ]]> 
    </insertText> 
</snippet>

Snippet tags in CSN files have the following attributes:

Attribute

Description

name

Name of snippet

description

Snippet description

preview

Type of preview: "code" to display the snippet in preview area or "design" to display the snippet rendered in HTML in the Preview area.

type

If the snippet is used to wrap a user selection, "wrap"; if the snippet should be inserted before the selection, "block".

You can use the following methods to add Snippets panel functions to your extensions.

dreamweaver.snippetPalette.getCurrentSnippetPath()

Availability

Dreamweaver MX 2004.

Description

Returns the path to the snippet that is currently selected in the Snippets panel.

Arguments

None.

Returns

The path, relative to the Snippets folder, to the snippet selected in the Snippets panel. Returns an empty string if no snippet is selected.

dreamweaver.snippetPalette.newFolder()

Availability

Dreamweaver MX.

Description

Creates a new folder with the default name untitled and puts a text box around the default name.

Arguments

None.

Returns

Nothing.

dreamweaver.snippetPalette.newSnippet()

Availability

Dreamweaver MX.

Description

Opens the Add Snippet dialog box and gives it focus.

Arguments

None.

Returns

Nothing.

dreamweaver.snippetPalette.editSnippet()

Availability

Dreamweaver MX.

Description

Opens the Edit Snippet dialog box and gives it focus, enabling editing for the selected element.

Arguments

None.

Returns

Nothing.

Enabler

dreamweaver.snippetPalette.insert()

Availability

Dreamweaver MX.

Description

Applies the selected snippet from the Snippets panel to the current selection.

Arguments

None.

Returns

Nothing.

Enabler

dreamweaver.snippetPalette.insertSnippet()

Availability

Dreamweaver MX.

Description

Inserts the indicated snippet into the current selection.

Arguments

path

  • A string that specifies the path to the snippet relative to the Snippets folder.

Returns

A Boolean value.

Enabler

Example

The following call to the dw.snippetPalette.insertSnippet() function inserts the code snippet at the location specified by the argument into the current document at the insertion point:

 dw.snippetPalette.insertSnippet('Text\\Different_Link_Color.csn');

dreamweaver.snippetPalette.rename()

Availability

Dreamweaver MX.

Description

Activates a text box around the selected folder name or file nickname and lets you edit the selected element.

Arguments

None.

Returns

Nothing.

dreamweaver.snippetPalette.remove()

Availability

Dreamweaver MX.

Description

Deletes the selected element or folder from the Snippets panel and deletes the file from the disk.

Returns

Nothing.

This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License  Twitter™ and Facebook posts are not covered under the terms of Creative Commons.

Legal Notices   |   Online Privacy Policy