Edgewall Software

Changes between Version 5 and Version 6 of 0.12/WikiHtml


Ignore:
Timestamp:
Feb 6, 2010, 3:38:31 PM (14 years ago)
Author:
Christian Boos
Comment:

add a section for complex #Tables and the table related processors

Legend:

Unmodified
Added
Removed
Modified

  • 0.12/WikiHtml

    v5 v6  
    1414Those Wiki processors are built-in, and does not require installing any additional packages.
    1515
    16 == How to Use `#!html` == #HowtoUseHTML
     16== How to use `#!html` == #HowtoUseHTML
    1717To inform the wiki engine that a block of text should be treated as HTML, use the ''html'' processor.
    1818
    … …  
    3838The new way to wrap any wiki content inside a <div> is to use the `#!div` Wiki  processor.
    3939
    40 == How to Use `#!div` and `#!span` == #HowtoUseDivSpan
     40== How to use `#!div` and `#!span` == #HowtoUseDivSpan
    4141
    4242||= Wiki Markup =||= Display =||
    … …  
    7373}}}
    7474
     75== How to use `#!td` and other table related processors == #Tables
     76
     77`#!td` or `#!th` processors are actually the main ones, for creating table data and header cells, respectively. The other processors `#!table` and `#!tr` are not required for introducing a table structure, as `#!td` and `#!th` will do this automatically. The `|-` row separator can be used to start a new row when needed, but some may prefer to use a `#!tr` block for that, as this introduces a more formal grouping and offers the possibility to use an extra level of indentation. The main purpose of the `#!table` and `#!tr` is to give the possibility to specify HTML attributes, like ''style'' or ''valign'' to these elements.
     78
     79||= Wiki Markup =||= Display =||
     80{{{#!td
     81 {{{
     82 Simple 2x2 table with rich content:
     83 {{{#!th align=left
     84  - Left
     85  - Header
     86 }}}
     87 {{{#!th align=left
     88  - Right
     89  - Header
     90 }}}
     91 |----------------------------------
     92 {{{#!td style="background: #ffd"
     93  - Left
     94  - Content
     95 }}}
     96 {{{#!td style="vertical-align: top"
     97 !RightContent
     98 }}}
     99 |----------------------------------
     100 || ... and this can be mixed||\
     101 ||with pipe-based cells ||
     102 {{{#!td colspan=2
     103 Pick the style the more appropriate
     104 to your content
     105 
     106 See WikiFormatting#Tables for details
     107 on the pipe-based table syntax.
     108 }}}
     109 
     110 If one needs to add some
     111 attributes to the table itself...
     112 
     113 {{{#!table style="border: none; text-align: center"
     114   {{{#!tr ====================================
     115     {{{#!th style="border: none"
     116     Left header
     117     }}}
     118     {{{#!th style="border: none"
     119     Right header
     120     }}}
     121   }}}
     122   {{{#!tr ==== style="border: 1px dotted grey"
     123     {{{#!td style="border: none"
     124     1.1
     125     }}}
     126     {{{#!td style="border: none"
     127     1.2
     128     }}}
     129   }}}
     130   {{{#!tr ====================================
     131     {{{#!td style="border: none"
     132     2.1
     133     }}}
     134     {{{#!td
     135     2.2
     136     }}}
     137   }}}
     138 }}}
     139
     140
     141 }}}
     142}}}
     143{{{#!td valign=top
     144Simple 2x2 table with rich content:
     145{{{#!th align=left
     146 - Left
     147 - Header
     148}}}
     149{{{#!th align=left
     150 - Right
     151 - Header
     152}}}
     153|----------------------------------
     154{{{#!td style="background: #ffd"
     155 - Left
     156 - Content
     157}}}
     158{{{#!td style="vertical-align: top"
     159!RightContent
     160}}}
     161|----------------------------------
     162|| ... and this can be mixed||\
     163||with pipe-based cells ||
     164{{{#!td colspan=2
     165Pick the style the more appropriate
     166to your content
     167
     168See WikiFormatting#Tables for details
     169on the pipe-based table syntax.
     170}}}
     171
     172If one needs to add some
     173attributes to the table itself...
     174
     175{{{#!table style="border: none; text-align: center"
     176  {{{#!tr ====================================
     177    {{{#!th style="border: none"
     178    Left header
     179    }}}
     180    {{{#!th style="border: none"
     181    Right header
     182    }}}
     183  }}}
     184  {{{#!tr ==== style="border: 1px dotted grey"
     185    {{{#!td style="border: none"
     186    1.1
     187    }}}
     188    {{{#!td style="border: none"
     189    1.2
     190    }}}
     191  }}}
     192  {{{#!tr ====================================
     193    {{{#!td style="border: none"
     194    2.1
     195    }}}
     196    {{{#!td
     197    2.2
     198    }}}
     199  }}}
     200}}}
     201}}}
     202
    75203
    76204== HTML comments ==