You are here: CFCL Wiki>Help Web>WikiTut>WikiTutTableTricks (09 Feb 2011, vlb)Edit Attach

Wiki Table Tricks (Using CSS)

Coloring Cell Background

Use CSS to change the cell background color. Set variables in the current page or in your WebPreferences topic, then use them in the table.

For example:

<!--
   * Set ST_PENDING = <span style="background-color: #FFFF33;">      
   * Set ST_IN_PROGRESS = <span style="background-color: #00FF33;">
   * Set ST_FLAGGED = <span style="background-color: #FF6633;">
   * Set END_ST = </span>
-->

(The <!-- comment wrapper prevents the variable setting from showing in the resulting page. They work, but they're invisible to the reader.)

Example Use:
|*Item* | *Date* | *Fruit* |
| 1 |  Nov 2, 2006   |  %ST_PENDING% apple %END_ST%  |
| 2 |   Nov 1, 2006  |  %ST_IN_PROGRESS% banana %END_ST%  |
| 3 |   Oct 31, 2006  |  %ST_FLAGGED% cherry %END_ST%  |

Item Date Fruit
1 Nov 2, 2006 apple pie
2 Nov 1, 2006 banana cream pie
3 Oct 31, 2006 cherry cobbler

Use <div> instead of <span> if you want the color to traverse the entire cell rather than simply highlight the word.

<!--
   * Set ST_PENDING1 = <div style="background-color: #FFFF33;">      
   * Set ST_IN_PROGRESS1 = <div style="background-color: #00FF33;">
   * Set ST_FLAGGED1 = <div style="background-color: #FF6633;">
   * Set END_ST1 = </div>
-->

Item Date Fruit
1 Nov 2, 2006
apple pie
2 Nov 1, 2006
banana cream pie
3 Oct 31, 2006
cherry cobbler

Build a Table Using INCLUDEd Content.

Include parts of a table from other tables on other pages.

Note: Glue Plugin does not work as expected. Don't try it.

| *Directive Name* | *Module* | *Version* | *Description* | \
%INCLUDE{"WikiTutTricksIncludeRow1" section="a1"}% \
%INCLUDE{"WikiTutTricksIncludeRow2" section="a1"}% 

Directive Name Module Version Description
AuthType mod_auth 1.0+ Set Auth Type
SetCookie mod_cookiedata 1.0+ Enable cookies

%TABLE{...}%
| *Project* | *Project Manager* | *Status* | *Milestones* |
| Sample Project| Bob | In Progress | %INCLUDE{"WikiTutTricksIncludeCell" pattern="^.*?<!-- begininclude -->(.*?)<!-- endinclude -->.*"}%|

Project Project Manager Status Milestones
Sample Project Bob In Progress 1st milestone
2nd milestone
and another...

Topic revision: r17 - 09 Feb 2011, vlb
This site is powered by Foswiki Copyright © by the contributing authors. All material on this wiki is the property of the contributing authors.
Foswiki version v2.1.6, Release Foswiki-2.1.6, Plugin API version 2.4
Ideas, requests, problems regarding CFCL Wiki? Send us email