Macromedia Dreamweaver 8 UNLEASHED [Electronic resources] نسخه متنی

Figure 5.28. Dreamweaver gives you access to modify and create new tags in the Tab Library Editor dialog.

• Tags :
  Displays a hierarchal list of tag libraries, tags, and attributes. Expand and collapse the tree to get a better idea as to the collection of tag libraries, tags, and attributes Dreamweaver supports out of thebox. You can also create your own custom tag libraries, tags, and attributes by selecting the appropriate options from the Add menu, represented by the Add (+) icon. Furthermore, you can delete a tag library by selecting the Remove () icon.

• Tag format: Line breaks :
  Choosing options from this menu formats the line breaks before, within, and/or after the tag. Experiment with these options and observe the sample in the Preview pane to get an idea as to what your code will look like and what you feel most comfortable with.

• Tag format: Contents :
  Changes the formatting of the content within the enclosed tag. Options include Not Formatted, Formatted But Not Indented, and Formatted and Indented.

• Tag format: Case :
  Allows you to set the case in which attributes should be written. Options include Default, Lowercase, Uppercase, and Mixed Case. The Default option depends on the value set in the Default Tag Case menu in the Code Format category of the Preferences window. Choosing Mixed Case opens the Tag Name Mixed Case dialog, which allows you to explicitly set the case of the tag. For example, you may choose to have the first letter uppercase with the remaining letters in lowercase.

• Preview :
  Displays a simple preview of the formatted tag based on values set in the previously mentioned menus.

The tag library editing mode becomes visible when you select a tag library. Selecting th215 tag library changes the interface, as shown in Figure 5.29.

Aside from the same Tags option mentioned previously, the following two editing options are exposed in tag library editing mode:

• Used in :
  Check the technologies in which you want your tag library to be available.

• Tag prefix :
  Technologies such as ASP.NET and JSP rely on precompiled controls written with tag prefixes. As a rule of thumb, the ASP.NET tag prefix is asp: while the JSP tag prefix is jsp:. As you will see later in the book, a text box is represented in ASP.NET as <asp:textbox> where asp: is the tag prefix and textbox is the tag name. This tells the ASP.NET runtime to render a text box, available from the ASP web control library. If your custom tag library is based on a tag prefix, enter that prefix here.

Finally, you can see the features exposed by the attribute editing mode by expanding a specific tag from the tree. To demonstrate this, I'll expand the <a> tag. Doing so displays a list of attributes supported by the <a> tag (see Figure 5.30).

Most of the features in this interface are similar to the previous two. The one difference is the Attribute type and Values options. These features are highlighted with more detail below:

• Attribute type :
  Choose one of ten options from this menu to assign a specific type to the selected or custom made attribute. For instance, choosing the Color option exposes the color picker when the attribute is added; choosing Font displays a list of selectable web-based fonts.

• Values :
  Selecting the Enumerated option from the Attribute Type menu enables this text box which allows you to enter comma-separated values. With the target attribute selected and the Enumerated attribute type option chosen, the four targets discussed in Chapter 3 become available.

NOTE

The four targets are _top, _blank, _self, and _parent.

Again, you probably won't find yourself making too many changes, if any, to th215 tag library. In reality, the Tag Library Editor dialog makes the most sense when you're working with your own custom tags. To create your own tag library complete with tags, attributes, and values, follow these steps:

That's it! You've successfully created your own tag library complete with one tag and an attribute for that tag. Click OK to close the Tag Library Editor and return to the Document window.

To test your new tag, switch to Code view. In the <body> tag, type the < symbol. The code hints menu immediately becomes available, displaying your <car> tag within the list (see Figure 5.34).

When you find the tag in the list, highlight it and press Tab to insert it. Now press the Spacebar to open the code hints menu again, revealing the attribute (types) supported by the tag. Press the Tab key again to insert the types attribute; immediately, the list of attribute values is revealed as shown in Figure 5.35.