Code coloring

Dreamweaver lets you customize or extend the code coloring schemes that you see in Code view so that you can add new keywords to a scheme or add code coloring schemes for new document types. If you develop JavaScript functions to use in your client-side script, for example, you can add the names of these functions to the keywords section so that they display in the color that is specified in Preferences. Likewise, if you develop a new programming language for an application server and you want to distribute a new document type to help Dreamweaver users build pages with it, you could add a code coloring scheme for the document type.

Dreamweaver provides the JavaScript function dreamweaver.reloadCodeColoring(), which enables you to reload code coloring XML files that might have been edited manually. For more information on this function, see the Dreamweaver API Reference.

To update a code coloring scheme or add a new scheme, you must modify the code coloring definition files.

Code coloring files

Dreamweaver defines code coloring styles and schemes in XML files that reside in the Configuration/CodeColoring folder. A code coloring style file defines styles for fields that are defined in syntax definitions. It has a root node of <codeColors>. A code coloring scheme file defines code coloring syntax and has a root node of <codeColoring>.

The code coloring style file that Dreamweaver provides is Colors.xml. The code coloring syntax files that Dreamweaver provides are CodeColoring.xml, ASP JavaScript.xml, ASP VBScript.xml, ASP.NET CSharp.xml, and ASP.NET VB.xml.

NOTE

The code coloring in the following examples does not appear on a black and white printed page. To see the code coloring in these examples, see Dreamweaver Help > Extensions > Extending Dreamweaver or see the PDF file for Extending Dreamweaver in the Documentation folder on your installation CD.

The following excerpt from the Colors.xml file illustrates the hierarchy of tags in a code coloring style file:

 <codeColors>   <colorGroup>     <syntaxColor  bold="true" italic="true" />     <syntaxColor  text="#009999" />     <syntaxColor  text="#FF0000" /> ...     <tagColor  text="#990099" />     <tagColor  text="#009999" />     <syntaxColor  text="#999999" italic="true" /> ...   </colorGroup> </codeColors> 

Colors are specified in red-green-blue (RGB) hexadecimal values. For example, the statement text="009999" in the preceding XML code assigns a blue-green (teal) color to the ID "CodeColor_JavascriptNative".

The following excerpt from the codeColoring.xml file illustrates the hierarchy of tags in a code coloring scheme file, and it also illustrates the relationship between the styles file and the scheme file:

 <codeColoring>   <scheme name="Text"  doctypes="Text" priority="1">     <ignoreTags>Yes</ignoreTags>     <defaultText name="Text"  />     <sampleText doctypes="Text"> <![CDATA[Default file syntax highlighting. The quick brown fox jumped over the lazy dog. ]]>     </sampleText>   </scheme> <scheme name="HTML"  doctypes="ASP.NET_VB,ASP.NET_CSharp,ASP-JS,ASP-VB,ColdFusion ,CFC,HTML,JSP,EDML,PHP_MySQL,DWTemplate,LibraryItem,WML" priority="50">     <ignoreCase>Yes</ignoreCase>     <ignoreTags>No</ignoreTags>     <defaultText name="Text"  />     <defaultTag name="Other Tags"  />     <defaultAttribute />     <commentStart name="Comment" ><![CDATA[<!--]]></commentStart> . . .   <tagGroup name="HTML Anchor Tags"   taglibrary="DWTagLibrary_html" tags="a" />   <tagGroup name="HTML Form Tags"  taglibrary="DWTagLibrary_html"  tags="select,form,input,option,textarea" /> . . . </codeColoring> 

Notice that the syntaxColor and tagColor tags in the Colors.xml file assign color and style values to an id string value. The id value is then used in the codeColoring.xml file to assign a style to a scheme tag. For example, the defaultTag tag in the codeColoring.xml excerpt has an id of "CodeColor_HTMLComment". In the Colors.xml file, the id value of "CodeColor_HTMLComment" is assigned a text= value of "#999999", which is gray.

Dreamweaver includes the following code coloring schemes: Default, HTML, JavaScript, ASP_JavaScript, ASP_VBScript, JSP, and ColdFusion. The Default scheme has an id value equal to "Text". Dreamweaver uses the Default scheme for document types that do not have a defined code coloring scheme.

A code coloring file contains the following tags.

<scheme>

Description

The scheme tag specifies code coloring for a block of code text. You can have multiple schemes within a file to specify different coloring for different scripting or tag languages. Each scheme has a priority that lets you nest a block of text with one scheme inside a block of text with a different scheme.

Attributes

 name, id, priority, doctypes 

• name="scheme_name" A string that assigns a name to the scheme. Dreamweaver shows the scheme name in the Edit Coloring Scheme dialog box. Dreamweaver shows a combination of scheme name and field name, such as HTML Comment. If you do not specify a name, the fields for the scheme do not appear in the Edit Coloring Scheme dialog box. For more information about the Edit Coloring Scheme dialog box, see "Editing schemes" on page 87.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

• priority="string" The value ranges from "1" to "99". Highest priority is "1". Specifies the precedence of the scheme. Blocks that are inside blocks with higher priority are ignored; blocks that are inside blocks with the same or lower priority take precedence. The priority defaults to "50" if you do not specify one.

• doctypes="doc_list" Optional. Specifies a comma-separated list of the document types to which this code coloring scheme applies. This value is necessary to resolve conflicts in which different start and end blocks use the same extensions.

Contents

blockEnd, blockStart, brackets, charStart, charEnd, charEsc, commentStart, commentEnd, cssProperty, cssSelector, cssValue, defaultAttribute, defaultText, endOfLineComment, entity, functionKeyword, idChar1, idCharrest, ignoreCase, ignoreMMTParam, ignoreTags, keywords, numbers, operators, regexp, sampletext, searchPattern, stringStart, stringEnd, stringEsc, urlProtocol, urlProtocols

Container

The codeColoring tag.

Example

 <scheme name="Text"  doctypes="Text" priority="1"> 

<blockEnd>

Description

Optional. Text values that delimit the end of the text block for this scheme. The blockEnd and blockStart tags must be paired and the combination must be unique. Values are not evaluated as case-sensitive. The blockEnd value can be one character. Multiple instances of this tag are allowed. For more information on blockEnd strings, see "Wildcard characters" on page 84.

Attributes

None.

Example

 <blockEnd><![CDATA[--->]]></blockEnd> 

<blockStart>

Description

Optional. Specified only if the coloring scheme can be embedded inside a different coloring scheme. The blockStart and blockEnd tags must be paired, and the combination must be unique. Values are not evaluated as case-sensitive. The blockStart value must be two or more characters in length. Multiple instances of this tag are allowed. For more information on blockStart strings, see "Wildcard characters" on page 84. For information on the blockStart scheme attribute, see "Scheme block delimiter coloring" on page 80.

Attributes

 canNest, doctypes, id, name, scheme 

• canNest Specifies whether the scheme can nest inside itself. Values are "Yes" or "No". The default is "No".

• doctypes="doc_type1, doc_type2,…" Required. Specifies a comma-separated list of document types into which you can nest this code coloring scheme. Document types are defined in the Dreamweaver Configuration/Document Types/MMDocumentTypes.xml file.

• docEmphasis">id_string" Required when scheme="customText". An identifier string that maps color and style to this syntax item.

• name="display_name" A string that appears in the Edit Coloring Scheme dialog box when scheme="customText".

• scheme Required. This defines how the blockStart and blockEnd strings are colored. For information on the possible values for the scheme attribute, see "Scheme block delimiter coloring" on page 80.

Example

 <blockStart doctypes="ColdFusion,CFC" scheme="innerText" canNest="Yes"><![CDATA[<!---]]>< /blockStart> 

<brackets>

Description

A list of characters that represent brackets.

Attributes

 name, id 

• name="bracket_name" A string that assigns a name to the list of brackets.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <brackets name="Bracket" ><![CDATA[{[()]}]]></brackets> 

<charStart>

Description

Contains a text string that represents the delimiter of the start of a character. You must specify the charStart and charEnd tags in pairs. Multiple charStart … charEnd pairs are allowed.

Attributes

None.

Example

 <charStart><![CDATA[']]></charStart> 

<charEnd>

Description

Contains a text string that represents the delimiter of the end of a character. You must specify the charStart and charEnd tags in pairs. Multiple charStart … charEnd pairs are allowed.

Attributes

None.

Example

 <charEnd><![CDATA[']]></charEnd> 

<charEsc>

Description

Contains a text string that represents an escape character. Multiple charEsc tags are allowed.

Attributes

None.

Example

 <charEsc><![CDATA[\]]></charEsc> 

<commentStart>

Description

A text string that delimits the start of a comment block. You must specify the commentStart and commentEnd tags in pairs. Multiple commentStart…/commentEnd pairs are allowed.

Attributes

None.

Example

 <commentStart><![CDATA[<%--]]></commentStart> 

<commentEnd>

Description

A text string that delimits the end of a comment block. You must specify the commentStart and commentEnd tags in pairs. Multiple commentStart…/commentEnd pairs are allowed.

Attributes

None.

Example

 <commentEnd><![CDATA[--%>]]></commentEnd> 

<cssImport/>

Description

An empty tag that indicates the code coloring rule for the @import function of the style element in a CSS.

Attributes

 name, id 

name="cssImport_name" A string that assigns a name to the CSS @import function.

docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <cssImport name="@import"  /> 

<cssMedia/>

Description

An empty tag that indicates the code coloring rule for the @media function of the style element in a CSS.

Attributes

 name, id 

• name="cssMedia_name" A string that assigns a name to the CSS @media function.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <cssMedia name="@media"  /> 

<cssProperty/>

Description

An empty tag that indicates CSS rules and holds code coloring attributes.

Attributes

 name, id 

• name="cssProperty_name" A string that assigns a name to the CSS property.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Code Color Preference

CSS Property

Example

 <cssProperty name="Property"  /> 

<cssSelector/>

Description

An empty tag that indicates CSS rules and holds code coloring attributes.

Attributes

 name, id 

• name="cssSelector_name" A string that assigns a name to the CSS Selector.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <cssSelector name="Selector"  /> 

<cssValue/>

Description

An empty tag that indicates CSS rules and holds code coloring attributes.

Attributes

 name, id 

• name="cssValue_name" A string that assigns a name to the CSS value.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <cssValue name="Value"  /> 

<defaultAttribute>

Description

Optional. This tag applies only to tag-based syntax (that is, where ignoreTags="No"). If this tag is present, then all tag attributes are colored according to the style assigned to this tag. If this tag is omitted, then attributes are colored the same as the tag.

Attributes

 name 

• A string that assigns a name to the default attribute.

Example

 <defaultAttribute name="Attribute"/> 

<defaultTag>

Description

This tag is used to specify the default color and style for tags in a scheme.

Attributes

 name, id 

• name="display_name" A string that Dreamweaver displays in the code color editor.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <defaultTag name="Other Tags"  /> 

<defaultText/>

Description

Optional. If this tag is present, all text that is not defined by any other tag is colored according to the style assigned to this tag. If this tag is omitted, black text is used.

Attributes

 name, id 

• name="cssSelector_name" A string that assigns a name to the CSS Selector.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <defaultText name="Text"  /> 

<endOfLineComment>

Description

A text string that delimits the start of a comment that continues until the end of the current line. Multiple endOfLineComment…/endOfLineComment tags are allowed.

Attributes

None.

Example

 <endOfLineComment><![CDATA[//]]></endOfLineComment> 

<entity/>

Description

An empty tag that indicates that HTML special characters should be recognized and hold coloring attributes.

Attributes

 name, id 

• name="entity_name" A string that assigns a name to the entity.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <entity name="Special Characters"  /> 

<functionKeyword>

Description

Identifies keywords that define a function. Dreamweaver uses these keywords to perform code navigation. Multiple functionKeyword tags are allowed.

Attributes

 name, id 

• name="functionKeyword_name" A string that assigns a name to the functionKeyword block.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <functionKeyword name="Function Keyword" >function< /functionKeyword> 

<idChar1>

Description

A list of characters, each of which Dreamweaver can recognize as the first character in an identifier.

Attributes

 name, id 

• name="idChar1_name" A string that assigns a name to the list of identifier characters.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <idChar1>_$abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ</idChar1> 

<idCharRest>

Description

A list of characters that are to be recognized as the remaining characters in an identifier. If idChar1 is not specified, all characters of the identifier are validated against this list.

Attributes

 name, id 

• name="idCharRest_name" A string that assigns a name to the stringStart block.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <idCharRest name="Identifier"  >_$abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789</idCharRest> 

<ignoreCase>

Description

Specifies whether case should be ignored when comparing tokens to keywords. Values are Yes or No. The default is Yes.

Attributes

None.

Example

 <ignoreCase>Yes</ignoreCase> 

<ignoreMMTParams>

Description

Specifies whether the MMTInstance:Param, <!-- InstanceParam, or <!-- #InstanceParam tags should be colored specially. Values are Yes and No; the default is Yes. This handles proper coloring in pages that use Templates.

Attributes

None.

Example

 <ignoreMMTParams>No</ignoreMMTParams> 

<ignoreTags>

Description

Specifies whether markup tags should be ignored. Values are Yes and No; the default is Yes. Set to No when syntax is for tag markup language that is delimited by < and >. Set to Yes when syntax is for a programming language.

Attributes

None.

Example

 <ignoreTags>No</ignoreTags> 

<isLocked>

Description

Specifies whether the text that is matched by this scheme is locked from being edited in the Code view. Values are Yes and No. Default is No.

Attributes

None.

Example

 <isLocked>Yes</isLocked> 

<keyword>

Description

A string of text that defines a keyword. Multiple keyword tags are allowed. A keyword may start with any character, but subsequent characters may only be a-z, A-Z, 0-9, _, $, or @.

The code color is specified by the containing keyword tags.

Attributes

None.

Example

 <keyword>.getdate</keyword> 

<keywords>

Description

List of keywords for type specified in category attribute. Multiple keywords tags are allowed.

Attributes

 name, id 

• name="keywords_name" A string that assigns a name to the list of keywords.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Contents

 <keyword></keyword> 

Example

 <keywords name="Reserved Keywords" >     <keyword>break</keyword>     <keyword>case</keyword> </keywords> 

<numbers/>

Description

An empty tag that specifies numbers that should be recognized and also holds color attributes.

Attributes

 name, id 

• name="number_name" A string that assigns a name to the numbers tag.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <numbers name="Number"  /> 

<operators>

Description

A list of characters to be recognized as operators.

Attributes

 name, id 

• name="operator_name" A string that assigns a name to the list of operator characters.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

Example

 <operators name="Operator" ><![CDATA[+-*/%<>!?:=&|^~]]></operators> 

<regexp>

Description

Specifies a list of searchPattern tags.

Attributes

 name, id, delimiter, escape 

• name="stringStart_name" A string that assigns a name to the list of search pattern strings.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

• delimiter The character or string that starts and ends a regular expression.

• escape The character or string that signals special character processing, known as the "escape" character or string.

Contents

 <searchPattern></searchPattern> 

Example

 <regexp name="RegExp"  delimiter="/" escape="\\">     <searchPattern><![CDATA[(\s*/\e*\\/]]></searchPattern>     <searchPattern><![CDATA[=\s*/\e*\\/]]></searchPattern> </regexp> 

<sampleText>

Description

Representative text that appears in the Preview window of the Edit Coloring Scheme dialog box. For more information on the Edit Coloring Scheme dialog box, see "Editing schemes" on page 87.

Attributes

 doctypes 

• doctypes="doc_type1, doc_type2,..." The document types for which this sample text appears.

Example

 <sampleText doctypes="JavaScript"><![CDATA[/* JavaScript */ function displayWords(arrayWords) {   for (i=0; i < arrayWords.length(); i++) {     // inline comment     alert("Word " + i + " is " + arrayWords[i]);   } } var tokens = new Array("Hello", "world"); displayWords(tokens); ]]></sampleText> 

<searchPattern>

Description

A string of characters that define a regular search pattern using supported wildcard characters. Multiple searchPattern tags are allowed.

Attributes

None.

Container

The regexp tag.

Example

 <searchPattern><![CDATA[(\s*/\e*\\/]]></searchPattern> 

<stringStart>

Description

These tags contain a text string that represents the delimiter of the start of a string. You must specify the stringStart and stringEnd tags in pairs. Multiple stringStart … stringEnd pairs are allowed.

Attributes

 name, id, wrap 

• name="stringStart_name" A string that assigns a name to the stringStart block.

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

• wrap="true" or "false". Defines whether code coloring recognizes text strings that wrap to the next line. The default is "true".

Example

 <stringStart name="Attribute Value" ><![CDATA["]]></stringStart> 

<stringEnd>

Description

Contains a text string that represents the delimiter of the end of a code string. You must specify the stringStart and stringEnd tags in pairs. Multiple stringStart … stringEnd pairs are allowed.

Attributes

None.

Example

 <stringEnd><![CDATA["]]></stringEnd> 

<stringEsc>

Description

Contains a text string that represents the delimiter of a string escape character. Multiple stringEsc tags are allowed.

Attributes

None.

Example

 <stringEsc><![CDATA[\]]></stringEsc> 

<tagGroup>

Description

This tag groups one or more tags to which you can assign a unique color and style.

Attributes

 id, name, taglibrary, tags 

• docEmphasis">id_string" Required. An identifier string that maps color and style to this syntax item.

• name="display_name" A string that Dreamweaver displays in the code color editor.

• taglibrary="tag_library_id" The identifier of the tag library to which this group of tags belongs.

• tags="tag_list" A tag or comma-separated list of tags that comprise the tag group.

Example

 <tagGroup name="HTML Table Tags"  taglibrary="DWTagLibrary_html"  tags="table,tbody,td,tfoot,th,thead,tr,vspec,colw,hspec" /> 

Scheme block delimiter coloring

The blockStart scheme attribute controls the coloring of block opening and closing strings or block delimiters. The following values are valid values for the blockStart attribute.

NOTE

Do not confuse the blockStart.scheme attribute with the scheme tag.

innerText

This value tells Dreamweaver to color the block delimiters the same as the default text of the scheme inside them.

The Template scheme provides an example of the effect of this scheme. The Template scheme matches blocks of read-only code that are colored gray because you cannot edit them. The block delimiters, which are the <!-- #EndEditable --> and <!-- #BeginEditable "..." --> strings, are also colored gray because they also are not editable.

Sample code

 <!-- #EndEditable -->   <p><b><font size="+2">header</font></b></p>   <!-- #BeginEditable "test" -->   <p>Here's some editable text </p>   <p>&nbsp;</p>   <!-- #EndEditable --> 

Example

 <blockStart doctypes="ASP-JS,ASP-VB, ASP.NET_CSharp, ASP.NET_VB, ColdFusion,CFC, HTML, JSP ,LibraryItem,PHP_MySQL" scheme="innerText"><![CDATA[<!--\s*#BeginTemplate]]></blockStart> 

customText

This value tells Dreamweaver to use custom colors to color the block delimiters.

Sample code

The delimiters for blocks of PHP script, which appear in red, provide an example of the effect of the customText value:

 <?php   if ($loginMsg <> "")   echo $loginMsg;   ?> 

Example

 <blockStart name="Block Delimiter"  doctypes="JSP"  scheme="customText"><![CDATA[<%]]></blockStart> 

outerTag

The outerTag value specifies that both the blockStart and blockEnd tags are complete tags and that Dreamweaver should color them as tags would be colored in the scheme that surrounds them.

The JavaScript scheme, in which <script> and </script> strings are the blockStart and blockEnd tags, provides an example of this value. This scheme matches blocks of JavaScript code, which does not recognize tags, so the delimiters need to be colored by the scheme that surrounds them.

Sample code

 <script language="JavaScript">   // comment   if (true)   window.alert("Hello, World");   </script> 

Example

 <blockStart doctypes="PHP_MySQL" scheme="outerTag"><![CDATA[<script\s+language="php">]]>< /blockStart> 

innerTag

This value is identical to the outerTag value, except that the tag coloring is taken from the scheme inside the delimiters. This is currently used for the html tag.

nameTag

This value specifies that the blockStart string is the opening of a tag and blockEnd string is the closing of a tag, and these delimiters are to be colored based on the tag settings of the scheme.

This type of scheme displays tags that can be embedded inside other tags, such as the cfoutput tag.

Sample code

 <input type="text" name="zip"   <cfif newRecord IS "no">   <cfoutput query="employee"> Value="#zip#" </cfoutput>   </cfif>   > 

Example

 <blockStart doctypes="ColdFusion,CFC" scheme="nameTag"><![CDATA[<cfoutput\n]]></blockStart> 

nameTagScript

This value is identical to the nameTag scheme; however, the content is script, such as assignment statements or expressions, as opposed to attribute name=value pairs.

This type of scheme displays a unique type of tag that contains script inside the tag itself, such as the ColdFusion cfset, cfif, and cfifelse tags, and can be embedded inside other tags.

Sample Code

See the sample text for nameTag.

Example

 <blockStart doctypes="ColdFusion,CFC" scheme="nameTagScript"><![CDATA[<cfset\n]]></blockStart> 

Scheme processing

Dreamweaver has three basic code coloring modes: CSS mode, Script mode, and Tags mode.

In each mode, Dreamweaver applies code coloring only to particular fields. The following chart indicates which fields are subject to code coloring in each mode.

Field	CSS	Tags	Script
defaultText		X	X
defaultTag		X
defaultAttribute		X
comment	X	X	X
string	X	X	X
cssProperty	X
cssSelector	X
cssValue	X
character		X	X
function keyword			X
identifier			X
number		X	X
operator			X
brackets		X	X
keywords		X	X

To make the process of defining schemes more flexible, Dreamweaver lets you specify wildcard and escape characters.

Wildcard characters

The following is a list of wildcard characters that Dreamweaver supports, along with the strings to specify them and descriptions of their usage.

Wildcard	Escape string	Description
Wildcard	\*	Skip all characters in the rule until the character that follows the wildcard is found. For example, use <MMTInstance:Editable name="\*"> to match all tags of this type that have the name attribute specified.
Wildcard with escape character	\e*x	Where x is the escape character. This is the same as the wildcard, except that an escape character can be specified. The character following any escape character is ignored. This lets the character following the wildcard appear in the string without matching the criteria to end wildcard processing. For example, /\e*\\/ is used to recognize a JavaScript regular expression that starts and ends with a forward slash (/) and can contain forward slashes that are preceded by a backslash (\). Because the backslash is the code coloring escape character, you must precede it with a backslash when you specify it in code coloring XML.
Optional whitespace	\s*	This matches zero or more white space or newline characters. For example, <!--\s*#include is used to match ASP include directives whether they have any white space preceding the #include token or not because either case is valid. The white space wildcards match any combination of white space and newline characters.
Required whitespace	\s+	This matches one or more white space or newline characters. For example, <!--#include\s+virtual is used to match ASP include directives with any combination of white space between #include and virtual. White space must be specified between these tokens, but it can be any combination of valid white space characters. The white space wildcards match any combination of white space and newline characters.

Escape characters

The following is a list of escape characters that Dreamweaver supports, along with the strings to specify them and descriptions of their usage.

Escape character	Escape string	Description
Backslash	\\	The backslash character (\) is the code coloring escape character, so it must be escaped to be specified in a code coloring rule.
White space	\s	This escape character matches any non-visible characters, except those listed that match the Newline escape character, such as space and tab characters. The optional white space and required white space wildcards match both the white space and newline characters.
Newline	\n	This escape character matches the newline (also known as linefeed) and carriage-return characters.

Maximum string length

The maximum length allowed for a data string is 100 characters. For example, the following blockEnd tag contains a wildcard character.

 <blockEnd><![CDATA[<!--\s*#BeginEditable\s*"\*"\s*-->]]></blockEnd> 

Assuming the optional white space wildcard strings (\s*) are a single space character, which Dreamweaver generates automatically, then the data string is 26 characters long, plus a wildcard string (\*) for the name.

 <!-- #BeginEditable "\*" --> 

This leaves an editable region name that can be as man y as 74 characters, which is the maximum of 100 characters minus 26.

Scheme precedence

Dreamweaver uses the following algorithm to color text syntax in Code view:

1.	Dreamweaver determines the initial syntax scheme based on the document type of the current file. The file document type is matched against the scheme.documentType attribute. If no match is found, the scheme where scheme.documentType = "Text" is used.
2.	Schemes can be nested if they specify blockStart…blockEnd pairs. All nestable schemes that have the current file extension listed in one of the blockStart.doctypes attribute are enabled for the current file and all others are disabled. NOTE All blockStart/blockEnd combinations should be unique. Schemes can nest within another scheme only if the scheme.priority is equal to or greater than the outer scheme. If the priority is equal, the scheme can nest only in the body state of the outer scheme. For example, the <script>...</script> block can nest only inside the <html>...</html> block where tags are legal not inside a tag, attribute, string, comment, and so on. Schemes with a higher priority than the outer scheme can nest almost anywhere within the outer scheme. For example, in addition to nesting in the body state of the <html>...</html> block, the <%...%> block can also nest inside a tag, attribute, string, comment, and so on. The maximum nesting level is 4.
3.	When matching blockStart strings, Dreamweaver always uses the longest match.
4.	After reaching the blockEnd string for the current scheme, syntax coloring returns to the state where the blockStart string is detected. For example, if a <%...%> block is found within an HTML string, then coloring resumes with the HTML string color.

Editing schemes

You can edit the styles for a code coloring scheme either by editing the code coloring file or by selecting the Code Coloring category in the Dreamweaver Preferences dialog box, as shown in the following figure:

For fields that you can specify more than once, such as stringStart, specify color and style settings only on the first tag. Data will be lost when you split color and style settings across tags and you later edit the colors or styles by using the Preferences dialog box.

NOTE

Macromedia recommends that you create backup copies of all XML files before you make changes. You should verify all manual changes before you edit color and style settings using the Preferences dialog box. Data will be lost if you edit an invalid XML file using the Preferences dialog box.

To edit styles for a scheme using the Code Coloring category in the Preferences dialog box, double-click a document type, or click the Edit Coloring Scheme button, to open the Edit Coloring Scheme dialog box.

To edit the style for a particular element, select it in the Styles For list. The items listed in the Styles For pane include the fields for the scheme being edited and also the schemes that might appear as blocks within this scheme. For example, if you edit the HTML scheme, the fields for CSS and JavaScript blocks are also listed.

The fields listed for a scheme correspond to the fields defined in the XML file. The value of the scheme.name attribute precedes each field listed in the Styles For pane. Fields that do not have a name are not listed.

The style for a particular element includes bold, italic, underline, and background color in addition to code coloring. After you select an element in the Styles For pane, you can change any of these style characteristics.

The Preview area displays how sample text would appear with the current settings. The sample text is taken from the sampleText setting for the scheme.

Select an element in the Preview area to change the selection in the Styles For list.

If you change the setting for an element of a scheme, Dreamweaver stores the value in the code coloring file and overrides the original setting. When you click OK, Dreamweaver reloads all code coloring changes automatically.

Code coloring examples

The following code coloring examples illustrate the code coloring schemes for a cascading style document and a JavaScript document. The lists of keywords in the JavaScript example are abbreviated for the sake of keeping the example short.

CSS code coloring

   <scheme name="CSS"  doctypes="CSS" priority="50">     <ignoreCase>Yes</ignoreCase>     <ignoreTags>Yes</ignoreTags>     <blockStart doctypes="ASP-JS,ASP-VB,ASP.NET_CSharp,ASP.NET_VB,ColdFusion,CFC,HTML,JSP ,LibraryItem,DWTemplate,PHP_MySQL" scheme="outerTag"><![CDATA[<style>]]></blockStart>     <blockEnd><![CDATA[</style>]]></blockEnd>     <blockStart doctypes="ASP-JS,ASP-VB,ASP.NET_CSharp,ASP.NET_VB,ColdFusion,CFC,HTML,JSP ,LibraryItem,DWTemplate,PHP_MySQL" scheme="outerTag"><![CDATA[<style\s+\*>]]></blockStart>     <blockEnd><![CDATA[</style>]]></blockEnd>     <commentStart name="Comment" ><![CDATA[/*]]></commentStart>     <commentEnd><![CDATA[*/]]></commentEnd>     <endOfLineComment><![CDATA[<!--]]></endOfLineComment>     <endOfLineComment><![CDATA[-->]]></endOfLineComment>     <stringStart name="String" ><![CDATA["]]></stringStart>     <stringEnd><![CDATA["]]></stringEnd>     <stringStart><![CDATA[']]></stringStart>     <stringEnd><![CDATA[']]></stringEnd>     <stringEsc><![CDATA[\]]></stringEsc>     <cssSelector name="Selector"  />     <cssProperty name="Property"  />     <cssValue name="Value"  />     <sampleText doctypes="CSS"><![CDATA[/* Comment */ H2, .head2      {             font-family : 'Sans-Serif';             font-weight : bold;             color : #339999;       }]]>   </sampleText>   </scheme> 

CSS sample text

The following sample text for the CSS scheme illustrates the CSS code coloring scheme:

 /* Comment */ H2, .head2      {             font-family : 'Sans-Serif';             font-weight : bold;             color : #339999;      } 

The following lines from the Colors.xml file provide the color and style values that are seen in the sample text and were assigned by the code coloring scheme:

 <syntaxColor  text="#FF00FF" /> <syntaxColor  text="#000099" /> <syntaxColor  text="#0000FF" /> 

JavaScript code coloring

 <scheme name="JavaScript"  doctypes="JavaScript" priority="50">     <ignoreCase>No</ignoreCase>     <ignoreTags>Yes</ignoreTags>     <blockStart doctypes="ASP-JS,ASP-VB,ASP.NET_CSharp,ASP.NET_VB,ColdFusion,CFC,HTML,JSP ,LibraryItem,DWTemplate,PHP_MySQL" scheme="outerTag"><![CDATA[<script>]]></blockStart>     <blockEnd><![CDATA[</script>]]></blockEnd>     <blockStart doctypes="ASP-JS,ASP-VB,ASP.NET_CSharp,ASP.NET_VB,ColdFusion,CFC,HTML,JSP ,LibraryItem,DWTemplate,PHP_MySQL" scheme="outerTag"><![CDATA[<script\s+\*>]]></blockStart>     <blockEnd><![CDATA[</script>]]></blockEnd>     <commentStart name="Comment" ><![CDATA[/*]]>< /commentStart>     <commentEnd><![CDATA[*/]]></commentEnd>     <endOfLineComment><![CDATA[//]]></endOfLineComment>     <endOfLineComment><![CDATA[<!--]]></endOfLineComment>     <endOfLineComment><![CDATA[-->]]></endOfLineComment>     <stringStart name="String" ><![CDATA["]]></stringStart>     <stringEnd><![CDATA["]]></stringEnd>     <stringStart><![CDATA[']]></stringStart>     <stringEnd><![CDATA[']]></stringEnd>     <stringEsc><![CDATA[\]]></stringEsc>     <brackets name="Bracket" ><![CDATA[{[()]}]]></brackets>     <operators name="Operator" ><![CDATA[+-*/%<>!?:=&|^]]>< /operators>     <numbers name="Number"  />     <regexp name="RegExp"  delimiter="/" escape="\\">      <searchPattern><![CDATA[(\s*/\e*\\/]]></searchPattern>       <searchPattern><![CDATA[=\s*/\e*\\/]]></searchPattern>     </regexp>     <idChar1>_$abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ</idChar1>     <idCharRest name="Identifier"  >_$abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789</idCharRest>     <functionKeyword name="Function Keyword" >function< /functionKeyword>     <keywords name="Reserved Keywords" >       <keyword>break</keyword> . . .     </keywords>     <keywords name="Native Keywords" >       <keyword>abs</keyword> . . .     </keywords>     <keywords >       <keyword>Infinity</keyword>       <keyword>Nan</keyword>     </keywords>     <keywords name="Client Keywords" >       <keyword>alert</keyword> . . .     </keywords>     <sampleText><![CDATA[/* JavaScript */ function displayWords(arrayWords) {   for (i=0; i < arrayWords.length(); i++) {     // inline comment     alert("Word " + i + " is " + arrayWords[i]);   } } var tokens = new Array("Hello", "world"); displayWords(tokens); ]]></sampleText>   </scheme> 

JavaScript sample text

The sample text for the JavaScript scheme illustrates the JavaScript code coloring scheme as follows:

 * JavaScript */ function displayWords(arrayWords) {   for (i=0; i < arrayWords.length(); i++) {     // inline comment     alert("Word " + i + " is " + arrayWords[i]);   } } var tokens = new Array("Hello", "world"); displayWords(tokens); 

The following lines from the Colors.xml file provide the color and style values that are seen in the sample text and were assigned by the code coloring scheme:

 <syntaxColor  text="#999999" italic="true" /> <syntaxColor  text="#000000" bold="true" /> <syntaxColor  text="#000099" bold="true" /> <syntaxColor  text="#FF0000" /> <syntaxColor  text="#990099" /> <syntaxColor  text="#009999" />