Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Div
idProductTOC

On this page

Table of Contents
maxLevel1
excludeOn this page
typeflat
separator

...

Description

...

Example - column styling

 | 

Overview

This page outlines an example of how to style table columns using the CSV macro, Table Plus macro, or Attachment Table macro, which are part of the NEWTBL add-on.

Since release 5.4, there are more capabilities to control table display characteristics. Specifically, setting the table class (default is confluenceTable), table style, and row styles. See Common Table Capabilities for more details.

Example - row styling

Section
Column
width50%

Image Removed

Column
width50%

 

Image Removed

Tip
titleExplain

A blank style (notice the 2 commas in a row) is what causes the normal Confluence behavior for the first data row.

No Format
{csv:autoNumber=true|rowStyles=font-size: 1.5em; font-style:italic;,, background:lightyellow, background:lightblue,}

        Month, Max, Min, Avg
        January,  25.5,  6.3, 15.9
        February, 32.4, 12.8, 22.6
        March,    44.6, 24.5, 34.6
        April,    59.7, 37.1, 48.4
        May,      72.5, 48.7, 60.6
        June,     81.3, 57.9, 69.6
        July,     85.2, 62.8, 74.0
        August,   82.5, 60.7, 71.6
        September,73.7, 51.7, 62.7
        October,  61.1, 40.1, 50.6
        November, 43.6, 27.4, 35.5
        December, 29.9, 13.6, 21.8  
{csv} 

 

 

Macro Browser Input

Select this Macro

Macro Name

Any of the following:

  • CSV (Comma Separated Values)
  • Table Plus
  • Attachment Table
Macro Syntax

Any of the following:

  • {csv}
  • {table-plus}
  • {attachment-table}

Define these Parameters/Values 

Each column can be styled by setting the style attribute. For example setting the columnAttributes parameter to:

No Format
style="border:0;background:lightgrey;",style="border:0;background:lightyellow;",style="border:0;background:lightgreen;"

...

Screenshot

Image Added

 

Wiki Markup Input

For a table built using the CSV macro:

Code Block
languagetext
linenumberstrue
{csv:columnAttributes=style="border:0;background:lightgrey;",style="border:0;background:lightyellow;",style="border:0;background:lightgreen;"}
	Heading 1,Heading 2,Heading 3
	A1,A2,A3
	B1,B2,B3
{csv} 

 

Example Result

Table plus
columnAttributesstyle="border:0;background:lightgrey;",style="border:0;background:lightyellow;",style="border:0;background:lightgreen;"
Heading 1Heading 2Heading 3
A1A2A3
B1B2B3

...

 

Other Examples

Visit our full list of product examples for additional inspiration!

 

 

 

 

Include Page
_SupportFooter
_SupportFooter

Include Page
_RightPanel
_RightPanel