Dreamweaver MX Snippets

Dreamweaver MX delivers many time saving tools. One of the new tools is Snippets. Snippets are sections of code you can place in a web page.

Snippets

You do not have to be working in the world of the web for more than a few weeks to realize the sheer scope of different tools and languages available to you. On one hand you have HTML, the foundation language for the Web, a basic tag language. On the other hand, you have complex languages such as Java, C# and C++. In between the two of these are scripting languages such as JavaScript and Microsoft's VBScript.

There is no way you can learn all of these languages. Almost every day a new language appears (does anyone remember Wireless Markup Language? It came out in late 1999 and was gone before the beginning of 2001). This year is the push of Microsofts .Net with Internet Web Services. Another new language.

The only way to survive the onslaught is not to become a guru at one, but a smart collector of code. What I have been doing for years is creating libraries of code on my computer. When a client calls and asks for a specific site to be designed with a specific language I can normally find code examples in my library.

Macromedia Dreamweaver MX now has this functionality built directly into the product. Open Dreamweaver MX and press Shift+F9. The Snippet Panel will appear, as shown in Figure A.

Figure A

Snippet Panel

The Snippets Panel is a collection of Scripts (called Snippets) that you can drop in to your web pages. Essentially, a Snippet is a pre-built selection of code. The Snippets Panel in turn acts like a code library. And, unlike my own libraries, this library is organized. You got to love that. Imagine, you can find the Snippet you are looking for easily without hunting and pecking through you hard drive.

You will see from the Snippets Panel that the snippets of code are managed in folders. There are ten major folders:

Accessible

Comments

Contents Tables

Footers

Form Elements

Headers

JavaScript

Meta

Navigation

Text

The plus sign along side each folder expands to reveal the snippets. Some folders have sub-folders to organize content.

The JavaScript Snippet Folder is an example of this as shown in Figure B.

Figure B:

Expanded View of the JavaScript Folder

There are simply thousands of JavaScript codes that can be executed within a web browser. Dreamweaver has categorized JavaScript into many sub-folders to help you better understand where to find the code you need.

You will find a group of scripts for managing and controlling Browser functions, cookies, readable functions and a whole host of additional tools. All said and told, the JavaScript folder itself has over 80 individual Snippets.

The list is not exhaustive, but it is a very good start.