beautypg.com

A simple attribute translator example, Create the tagspec tag, Create the icon – Adobe Extending Dreamweaver CS4 User Manual

Page 342: Create the attribute translator, Attribute. for an example of this process, see

background image

336

EXTENDING DREAMWEAVER CS4

Data translators

5

Restart Dreamweaver, and select your translator command from the Commands menu. When you click OK, the

translateMarkup()

function is called, which simulates translation.

If no error message appears and translation still fails, you probably have a logic error in your code.

6

Add

alert()

statements in strategic spots throughout the

translateMarkup()

function so you can make sure

you’re getting the proper branches and so you can check the values of variables and properties at different points:

for (var i=0; i< foo.length; i++){

alert("we're at the top of foo.length array, and the value of i is " + i);
/* rest of loop */

}

7

After adding the

alert()

statements, select your command from the Commands menu, click Cancel, and select it

again. This process reloads the command file and incorporates your changes.

A simple attribute translator example

To better understand attribute translation, it’s helpful to look at an example. The following translator is Pound
Conditional (Poco) markup, a syntax that’s somewhat similar to ASP or PHP.

You create the attribute translator by creating a

tagspec

tag, an icon, and an attribute translator.

Create the tagspec tag

The first step in making this translator work properly is to create a

tagspec

tag for Poco markup, which prevents

Dreamweaver from parsing the untranslated Poco statements.

1

Create a new blank file.

2

Enter the following:

detect_in_attribute="true" icon="poco.gif" icon_width="17" ¬
icon_height="15">

3

Save the file as poco.xml in the Configuration/ThirdPartyTags folder.

For an example of creating the

tagspec

tag, see the Tags.xml file in the Configuration/ThirdPartyTags folder.

Create the icon

Next, you create the icon for Poco tags.

1

Create an image file that is 18 x 18 pixels for the Poco tags icon.

2

Save the file as poco.gif in the Configuration/ThirdPartyTags folder.

Create the attribute translator

You create an HTML file that contains the functions necessary for the attribute translator.

1

Create a new blank file.

2

Enter the following:

This manual is related to the following products: