How to span table row/column and set cell background colors using wiki markup?

Mike Araya May 6, 2016

Can I span table rows or columns using wiki markup?

Can I set table cell background colors using wiki markup?

2 answers

1 accepted

Comments for this post are closed

Community moderators have prevented the ability to post new answers.

Post a new question

1 vote
Answer accepted
Mike Araya May 10, 2016

For completeness, I found several different ways to span rows and columns and set cell background colors. However, there is no concise way to do this with wiki markup.

Alternatives:
1. Manually editing the table in the WYSIWYG editor
2. Copy split and/or merged cells from an Excel spreadsheet into the Confluence WYSIWYG editor. Column and row spans are supported. However, cell background colors from the Excel spreadsheet did not appear in the Confluence wiki.
3. Insert HTML Table, table body, table row and table cell macros in wiki markup. While this does technically answer my question, it is a less desirable alternative to directly editing storage format HTML. At this point you're writing almost full HTML, but only getting some of the benefits.  Additionally, large tables constructed from many HTML Table macros in wiki markup results in poor run-time performance.
4. Directly edit storage format HTML.

An example of wiki markup with table macros, demonstrating column and row span, and cell background colors:

{table:cellpadding=5}
{tbody}
{tr}{td:bgcolor=#ccffcc|colspan=2|rowspan=2}green background{td}{td:bgcolor=#ccccff|colspan=2}blue background{td}{tr}
{tr}{td:bgcolor=#ffffcc}{color:blue}blue foreground{color}{td}{td:bgcolor=#ffcccc}red background{td}{tr}
{tbody}
{table}

image2016-5-10 9:58:5.png

Storage format HTML for the desired table:

<table>
<tbody>
<tr>
<td rowspan="2" style="background-color: rgb(204,255,204);">green background</td>
<td colspan="2" style="background-color: rgb(204,204,255);">blue background</td>
</tr>
<tr>
<td style="color: blue;background-color: rgb(255,255,204);">blue foreground</td>
<td style="background-color: rgb(255,204,204);">red background</td>
</tr>
</tbody>
</table>

image2016-5-10 9:57:34.png

Shaurya Chawla December 10, 2018

@Mike Araya I don't see this way of adding cell color to confluence table  working for me .

I did this :

"<td style=color: rgb(255,0,0);>" but run into error : 

"Error parsing xhtml: Unexpected character c"

Tried to find here as well but no mentions here as well https://confluence.atlassian.com/conf612/confluence-storage-format-958777608.html#ConfluenceStorageFormat-Texteffects

 

 

0 votes
Sandy Johnson May 6, 2016

For the table background, I'm not sure if this will get you quite what you want, but try using the following to insert a 2 row 2 column table where 1 cell has a green background.

 

|| header 1 || header 2 || | white background | {panel:bgColor=green}this is a green background{panel} |

Mike Araya May 6, 2016

Thanks for the suggestion.  It's close, but not quite right.  Here is what I get:

image2016-5-6 10:44:21.png

Here is what I want:

image2016-5-6 10:54:0.png

Note: I had to copy the markup table, remove the panel and manually edit the background color.  Apparently, there is no way to produce the above table using only markup or only WYSIWYG editing.

Mike Araya May 9, 2016

This gets me a little closer, but is still not right:

|| header 1 || header 2 ||
| white background | {bgColor:green}this is a green background{bgColor} |

image2016-5-9 9:25:49.png

Roni Parves November 10, 2016

Is this what you are looking for -

 

{panel:title=Descrption|borderStyle=dashed|borderColor=#ccc|titleBGColor=#cccccc}

New Line

{panel}

Mike Araya November 11, 2016

Hi Roni. I needed a way to specify tables with several rows and columns, row and column spanning, and custom cell background colors. For an example, see the accepted answer above.

TAGS
AUG Leaders

Atlassian Community Events