wfc to html Translation

So that you, the designer, can write effective css files I give you this breakdown of the HTML that WebBuild generates from the .wfc files for the ##content## substitution in the site template.

Paragraphs - <p>...</p>. If user includes optional paragraph images then immediatly after the <p> comes one or two <a ...><img ... /></a> tag sets with class names of "paraimg1" and "paraimage2" assigned on the img tag. If user specifies a {{style}} the <p> tag is assigned the requested class.

Singlton Image - <div><a ...><img ... /></a></div>. The img tag is assigned the class "singletomimg". If the user specifies a {{style}} the <div> tag is assigned the requested class.

The <img> tags for paragraph images and singlton images come complete with alt attributes (set to the same value as the src attribute i.e. the relative link to the image file). The <a> tag surrounding the <img> tag provides a relative link to the raw image for viewing by the user in its native size.

Headers - <h1>...</h1> (also h2, h3 ... h6). If user specifies a {{style}} the <hx> tag is assigned the requested class.

Horizontal Lines - <div><hr /></div>. The div tag is assigned a class of "horizlinelong", "horizlinemedium" or "horizlineshort". If the user specifies a {{style}} the <hr> tag is assigned the requested class.

Table - <table><tbody>...</tbody></table> If the user specifies a {{style}} to the table the <table> tag is assigned the requested class.

Table Row - <tr>...</tr> the following style= attributes to the <tr> tag are made for each if the row formatting options:

  • Header ("*") - text-align:center; font-weight:bold;
  • Right Justify (">") - text-align: right;
  • Left Justify ("<") - text-align: left;
  • Center Justify ("<>" or "><") - text-align: center;

attribute applied in that order regardless of order of attributes in wfc file. If the user specifies a {{style}} to the table row the <tr> tag is assigned the requested class.

Table Cell <td>...</td> all of the style= attributes for Header, justify right, left and center apply as above as well as:

  • column span ("n") - colspan="n"
  • row span ("^n") - rowspan="n"

If the user specifies a {{style}} to the table cell the <td> tag is assigned the requested class. Note there is no use of the <th>, <tf> tags only <tr> and <td> tags are used in tables.

Lists

  • numbered ("#") - <ol><li>...</li><li>...</li> etc </ol>
  • bullet ("*") - <ul><li>...</li><li>...</li> etc </ul>
  • plain ("-") - <ul style="list-style-type:none"><li>...</li><li>...</li> etc </ul>

If the user specifies a {{style}} to the list the <ol> or <ul> tag is assigned the requested class.

Links - regular, doc and mailto - All produce <a href="linkref">...</a>. (User specified {{style}} is not supported).

Bold - <b>...</b> (User specified {{style}} is not supported).

Italic - <i>...</i> (User specified {{style}} is not supported).

Underline - <span style="text-decoration:underline">...</span> (User specified {{style}} is not supported).

Monotype - <tt>...</tt>