6.9 MacrosCreating Custom Tags


6.9 Macros”Creating Custom Tags

The WML macro processor enables us to define custom tags that implement WML macros. Creating custom tags saves typing and enables us to change a lot of HTML by simply changing the definition. To define a new tag, we use the <define-tag> macro.

There are two types of tags in HTML: those that have closing tags, such as <b> ... </b> , and those that do not, such as <img> .

For HTML tags that require closing tags, a new tag is defined as:

 <define-tag red whitespace=delete endtag=required>  <font color="#FF0000">%body</font>  </define-tag> 

This defines a tag named <red> .. </red> . The end tag is indeed required because we say endtag=required . The whitespace=delete tag tells WML not to preserve superfluous whitespace characters . The stuff between <define- tag> .. </define-tag> is the text that this tag will be translated into”in this case, <font color="#FF0000">%body</font> . %body is replaced by whatever is between the <red> .. </red> tags. Therefore, this tag: [7]

[7] Hmm, looks a bit like XML.

 <red>Hello, world!</red> 

becomes:

 <font color="#FF0000">Hello, world!</font> 

If we wanted a tag to make not only red text but bold red text, we would change the definition to this:

 <define-tag red whitespace=delete endtag=required>  <font color="#FF0000"><b>%body</b></font>  </define-tag> 

Now, <red>Hello, world!</red> produces this:

 <font color="#FF0000"><b>Hello, world!</b></font> 

Similarly, for a tag that has no closing tag, an example would be a tag <lamp> , which outputs the title of this book, Open Source Web Development with LAMP :

 <define-tag lamp whitespace=delete>  Open Source Web Development with LAMP  </define-tag> 

There are two ways to use unclosed tags:

 <tag> 

or:

 <tag/> 

The first one is HTML-style, and the second is XML-style (note the closing /> ).

Now, You are reading <lamp>! produces:

 You are reading Open Source Web Development with LAMP! 

Consider another example. We have a style for the web site links that we want to apply to all the links on the page. It could be:

 <a href="a.html"><font color="#999966"><b>go to a.html</b></font></a> 

To create the tag to make this easy, the definition is:

 <define-tag link whitespace=delete>  <preserve href>  <preserve text>  <set-var %attributes>  <a href="<get-var href>"><font color="#999966"><b><get-var text></b>           </font></a>  <restore href>  <restore text>  </define-tag> 

Here a tag named <link> is defined. Again, WML will remove superfluous whitespace characters. The attributes to the tag (here href and text ) are passed into the tag through the variable %attributes , so the line <set-var %attributes> indicates that the current definition should be used. However, in WML, tag attributes are kept in a stacklike data structure, so before the attributes in the tag can be used, the current values must be preserved with <preserve href> and <preserve text> . This means taking the current values of these two variables , if there are any, and saving them for later use, clearing their values for this particular tag. Then, after using the values in %attributes with <get-var href> and <get-var text> , the previous values of the variables can be restored with <restore href> and <restore text> .

Then the HTML to which this tag gets converted is defined”the <a href> .. </a> tag. To use the <link> tag, input either the HTML-style:

 <link href="http://www.perl.com/"        text="Perl is cool"> 

or the XML-style:

 <link href="http://www.thewml.org/sw/wml/"        text="WML Home Page"/> 

All this is put together into an example stored in /var/www/html/wml/define.wml :

 <define-tag red whitespace=delete endtag=required>  <font color="#FF0000">%body</font>  </define-tag>  <define-tag lamp whitespace=delete>  Open Source Web Development with LAMP  </define-tag>  <define-tag link whitespace=delete>  <preserve href>  <preserve text>  <set-var %attributes>  <a href="<get-var href>"><font color="#999966"><b><get-var  text></b></font></a>  <restore href>  <restore text>  </define-tag>  <html>  <body bgcolor="#ffffff">  <red>Hello, world!</red>  <hr>  You are reading <lamp>!  <hr>  <link href="http://www.perl.com/"        text="Perl is cool">  <hr>  <link href="http://www.thewml.org/sw/wml/"        text="WML Home Page"/>  </body>  </html> 

Use this to generate the HTML:

 $  wmk define.wml  wml -n -o define.html define.wml 

This is the resulting HTML, in /var/www/html/wml/define.html :

 <html>  <body bgcolor="#ffffff">  <font color="#FF0000">Hello, world!</font>  <hr>  You are reading Open Source Web Development with LAMP!  <hr>  <a href="http://www.perl.com/"><font color="#999966">                <b>Perl is cool</b></font></a>  <hr>  <a href="http://www.thewml.org/sw/wml/"><font color="#999966">                <b>WML Home Page</b></font></a>  </body>  </html> 

To see this, load in either http://localhost/wml/define.html or www.opensourcewebbook.com/wml/define.html. The result can be seen in Figure 6.9. For more information on defining tags, see man wml_p2_mp4h .

Figure 6.9. Defining your own tags

graphics/06fig09.gif



Open Source Development with Lamp
Open Source Development with LAMP: Using Linux, Apache, MySQL, Perl, and PHP
ISBN: 020177061X
EAN: 2147483647
Year: 2002
Pages: 136

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net