WAP basics
Any text editor can be used to create WML pages. Note that WML is a specific type of XML language, so XML goes in the header.
The following should be inserted in all WAP pages:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
This is where your code should go.
</wml>
Deck of Cards
WAP code is structured as a 'deck' of 'cards', each card small enough to load into the mobile phone's limited memory. Phones can cache multiple cards for future use. There are usually 1 to 3 cards per document, and mobile phone browsers read one card at a time. Each deck may have a template to define common characteristics for each of the cards within that deck. The WAP enabled browser will look for the start and end of each card in a wml document. You tell it using a <card> tag, which includes the name of the card for linking from one card to another, and the title. Your code should go between <wml> and </wml>. For example:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<template>
</template>
<card id="card1" title="WAP Card 1">
<p>
This is a WAP page
</p>
<p>
<a href="#card2">This take you to the second card</a>
</p>
</card>
<card id="card2" title=" WAP Card 2">
<p>
This is the second wap card!
</p>
<p>
<a href="#card1">Go back to card 1</a>
</p>
</card>
</wml>
The id attribute gives the card a name, in this case "card1". This is so you can provide a link to other cards in your deck - much like the <a name="name1"> attribute in HTML. As the mobile phone browsers are only able to read one card at a time, you will have to provide links to enable your reader to find the other cards!
The <a> tag can link to the first card of another page, as well as another card:
<a href="links.wml">Link</a>
or to another card on another page:
<a href="links.wml#card2">Link to card 2</a>
The first card a user sees should be at the top, but the order of the rest does not matter.
The template is used for specifying the layout of any buttons you may want to be common between all the cards.
Buttons
Buttons are added using the
Trying to add an action to the Previous button
<do type='prev' label='Follow'>
<go href='previous.wml'/>
</do>
Adding a back button
As mobile phones don't always have back buttons, you can add one as shown below. Put it above the cards to have it appear in all cards, or at the top of the card to have it appear just the once.
<template>
<do type="accept" label="Back">
<prev/>
</do>
</template>
<card id="card1" title="WAP Card 1">
<p>
This is a WAP page
</p>
<p>
<a href="#card2">This take you to the second card</a>
</p>
</card>
Templates
The templates allows you to add characteristics, such as back buttons, to all the cards in a deck. For example:
<template>
<do type="accept" label="Back">
<prev/>
</do>
</template>
In the above example, <prev/> tells the phone to go back a page, using its history. The
Other basic features
The <b> (bold) element is commonly used.
Comments are written using <!-- -->
Some of the rules for wml:
- Every card must have at least one
<p>tag. - All elements and attributes must be in lower case (WAP 1.1).
- All tags must have a closing tag or be self closed.
- All paths must be relative.
- All text must be within a paragraph.
- Paragraphs cannot be nested inside each other.
- The alt attribute of the
<img>tag is mandatory in WML. - The
<img>tag must have a closing mark,'/'in the tag, as it does not have a 'closing' tag. - Save the page as *.wml.
The ONLY non numeric entities supported by wml are:
| " | (") | quotation mark: | " | |
| & | (&) | ampersand: | & | |
| ' | (') | apostrophe: | ' | |
| < | (<) | less than: | < | |
| > | (>) | greater than: | > | |
| | ( ) | non-breaking space: | [ ] | |
| ­ | (­) | soft hyphen: | |