Enable code coloring in Dreamweaver for Drupal by adding file extensions recognized by Dreamweaver

Introduction

This TechNote applies to the following related symptoms in Adobe Dreamweaver:

• When opening a file, you see this error message: "Can't find a valid editor for this file extension."
• The color-coding in Code view isn't matching the color-coding for the file type you want.
• The server-model functionality isn't available for your file type.
• You cannot open a page in Design view. It only opens in Code view.
• When you go to File > Save, or File > Open, you don't see the file type you want.

Dreamweaver ships with the ability to edit and display many different file types. This TechNote focuses on customizing Dreamweaver to recognize new file types by editing the Extensions.txt and MMDocumentTypes.xml files, and setting the Open In Code View settings to see the new file types in Design view.

• The Extensions.txt file
  The Extensions.txt file is a text file listing all file types recognized by Dreamweaver. This file can be edited in any external text editor like Notepad or Text Editor to add to the list of recognized file types. Do not modify the Dreamweaver configuration files in Dreamweaver itself.
   
• The MMDocumentTypes.xml file
  The MMDocumentTypes.xml file contains definitions of document types as well as a list of file extensions associated with each recognized document type. Adding file extensions to the Extensions.txt file allows Dreamweaver merely to recognize a file extension and allow files of this type to be opened in Dreamweaver. Adding file extensions to the MMDocumentTypes.xml file tells Dreamweaver how to treat this new file extension and to which document type this file extension belongs.

  Note: For the purpose of this TechNote, only basic aspects of editing the MMDocumentTypes.xml file will be discussed. For a detailed overview of editing this file, see Extending Dreamweaver (from within Dreamweaver, choose Help > Extending Dreamweaver, and search on MMDocumentTypes.xml).

• Open in Code View
  The Open in Code View preference identifies file extensions that do not allow Design view. After following the instructions in this TechNote, be sure to remove the file extension (if it is listed) from the Open In Code View preference to allow file editing in Design view. To set this preference, choose Edit > Preferences (Windows) or Dreamweaver > Preferences (Mac OS), and locate the File Types / Editors category.

Editing the Extensions.txt file

When opening a file that Dreamweaver doesn't recognize, you see this error message: "Can't find a valid editor for this file extension." New extensions can be added to the list of extensions that Dreamweaver recognizes. To add new extensions, edit the Extensions.txt file. Entries in the Extensions.txt file also control the order in which files are listed in the File > Open and File > Save dialog boxes. For the purpose of demonstration, we will add the .inc file type to Dreamweaver.

Note: This procedure requires you to locate hidden files, hidden folders and extensions for known file types. By default, Windows Explorer doesn't show hidden files, hidden folders, and file name extensions that it recognizes.

To show hidden files, hidden folders, and extensions for known file types:

1. In Windows Explorer, do one of the following:
   • In Windows XP, choose Tools > Folder Options.
   • In Windows Vista, choose Organize > Folder and Search Options.
2. Click the View tab in the Folder Options dialog box.
3. In Advanced Settings, select Show Hidden Files And Folders.
4. Deselect Hide Extensions For Known File Types.
5. Click OK.

To add file types to the Extensions.txt file:

1. Locate the Extensions.txt file within the Dreamweaver user configuration folder. The location of this folder depends on the operating system and the version of Dreamweaver:
   • Dreamweaver CS3 on Windows Vista:
     C:\Users\[username]\AppData\Roaming\Adobe\Dreamweaver 9\Configuration
   • Dreamweaver 8 on Windows Vista:
     C:\Users\[username]\AppData\Roaming\Macromedia\Dreamweaver 8\Configuration
   • Dreamweaver CS3 on Windows XP:
     C:\Documents and Settings\[username]\Application Data\Adobe\Dreamweaver 9\Configuration
   • Dreamweaver 8 on Windows XP & 2000:
     C:\Documents and Settings\[username]\Application Data\Macromedia\Dreamweaver 8\Configuration
   • Dreamweaver CS3 on Mac OS X:
     Mac HD:Users:[username]:Library:Application Support:Adobe:Dreamweaver 9:Configuration
   • Dreamweaver 8 on Mac OS X:
     Mac HD:Users:[username]:Library:Application Support:Macromedia:Dreamweaver 8:Configuration
   Note: Edits to this file will only be available to the current user. Changes made to files within the user profile will not be available to other users. For more information about manually editing Dreamweaver configuration files in a multi-user environment, please see Customizing Dreamweaver.
   
2. Open Extensions.txt in any external text editor like Notepad or Text Editor. Do not modify the Dreamweaver configuration files in Dreamweaver itself.
   
3. Add the extension to the All Documents line. Extensions must be in uppercase letters and separated by commas. (INC should already be listed by default. If not, add it.)

   Example:  HTML,HTM,SHTM,SHTML,INC

4. To add extensions to an existing document group, add the extension to the extension list for the desired group. To add a new document group, add a new line that contains the new document type as well as a listing of associated extensions.

   Example:  INC:Include Files

   (This can also be added to the Server Side Include list already within the file.)

5. Save the file and restart Dreamweaver.
6. To see the changes, open Dreamweaver and open a file with the newly added file extension. It should now open in Code view only in Dreamweaver. Select File > Save As, and click the Save As Type pop-up menu. You should now see an option for Include Files with *.inc as the recognized file extension. It's the same for the Files Of Type pop-up menu in File > Open.

Note:  The order in which extensions are listed is the order in which they will appear in the File > Open and File > Save dialog boxes.

To get Design view, color coding, and server behavior functionality (if applicable) working, you need to edit the MMDocumentTypes.xml file, as described below.

The MMDocumentTypes.xml file

Where the Extensions.txt file contains the list of extensions recognized by Dreamweaver, the MMDocumentTypes.xml file contains information about the server model, color coding style, descriptions, and so forth for each known document type.

In addition to adding extensions to the Extension.txt file, new extensions must also be added to the file extension lists for the associated document type. If not, Dreamweaver will not know how to display this file type and will open it in Code view by default. If this extension is not associated with any defined document type, a new document type should be created. To create a new document type, see Extending Dreamweaver (from within Dreamweaver, choose Help > Extending Dreamweaver, and search on MMDocumentTypes.xml).

Note:  For the purpose of this TechNote, 'document type definition' refers to files that contain information about documents recognized by Dreamweaver and are not to be confused by 'DTDs' mentioned in XML documentation.

Steps to add extensions to a document type definition in the MMDocumentTypes.xml file:

1. Locate the MMDocumentTypes.xml file in the main Dreamweaver configuration folder (not the Dreamweaver user configuration folder). The location of this folder depends on the operating system and the version of Dreamweaver:
   • Dreamweaver CS3 on Windows Vista & XP:
     C:\Program Files\Adobe\Adobe Dreamweaver CS3\Configuration\DocumentTypes
   • Dreamweaver 8 on Windows Vista, XP & 2000:
     C:\Program Files\Macromedia\Dreamweaver 8\Configuration\DocumentTypes
   • Dreamweaver CS3 on Mac OS X:
     Mac HD:Applications:Adobe Dreamweaver CS3:Configuration:Document Types
   • Dreamweaver 8 on Mac OS X:
     Mac HD:Applications:Macromedia Dreamweaver 8:Configuration:Document Types
2. Open MMDocumentTypes.xml in any external text editor like Notepad or Text Editor. Do not modify the Dreamweaver configuration files in Dreamweaver itself.
3. Find the tag set for the desired document type. Below is the default document type definition for HTML documents from the MMDocumentTypes.xml file:
   
   <documenttype id="HTML" internaltype="HTML" winfileextension="html,htm,shtml,shtm,stm,tpl,lasso,xhtml" macfileextension="html,htm,shtml,shtm,tpl,lasso,xhtml,ssi" file="Default.html" writebyteordermark="false">
4. Add the desired extension to the  winfileextension  and  macfileextension  attributes of the  documenttype  tag. For example:
   winfileextension="html,htm,shtml,shtm,stm,tpl,lasso,xhtml,inc"
   

   The code above adds the INC file extension to the list of files that Dreamweaver treats as HTML files. Adding extensions to the Mac OS and Windows lists for this file types allows Dreamweaver to open this file type in Design view as other files with defined HTML file extensions.

5. Save MMDocumentTypes.xml and restart Dreamweaver.
6. To see the changes, open Dreamweaver and open a file that has the newly added file extension. You should see that Design view, code coloring and server behavior functionality (if applicable) are working now.

Note:  The order in which extensions are listed is important. The first extension in the extensions lists will be the default extension used for this file type.

Note:  If you made a backup of the MMDocumentTypes.xml and left it in the Configuration/DocumentTypes folder, you will see multiple warning messages pop up when you launch Dreamweaver that look like this:

'The Document Type "HTML" will not be added because it uses a file extension that is already associated with a prior Document Type.'

To stop these warning messages, move your backup copy of the MMDocumentTypes.xml file outside the Configuration/DocumentTypes folder. For example, move it to the desktop. You will also get this error message if you have the same file type listed more than once in the MMDocumentTypes.xml.

Edit in Code View preference

The final step is to check the File Types / Editors preference settings (Edit > Preferences) and make sure that this file extension is not listed in the Open In Code View field. By default, the INC file extension appears on this list. Remove ".inc" from the Open in Code View list and files with this extension should now be viewable in Design view.

Blogged with the Flock Browser