Use case

You need to adjust the background color of the table with multi row headers, for example, coming from the Pivot Table macro.

If you use the general approach, you'll see that not only the first row but the first column is treated as a header as well. So, you need to "separate" the first row, leave it as a header, and color it in red. Other rows (specific or all of them) should be colored in yellow (including the cells from the first column).

Solution

  1. Switch the page to the edit mode.

  2. Create the following macro sequence: source table < Pivot Table < Table Transformer.
    For Data Center, it is done directly on the page.
    For Cloud, you should insert the Table Toolbox macro and create the required macro sequence within its shell.

  3. Navigate to the Table Transformer macro settings.

  4. In the Stylesheet tab enter any of the following CSS:

    thead > tr:first-child > * {background-color:red;} /* Adjusts the background color of the first header row */

tbody > tr > * {background-color:yellow;} /* Adjusts the background color of the table rows */

tbody > tr:nth-child(2) > * { background-color:yellow;} /* Adjusts the background color of the specific table rows (the second row for this example) */
    CSS

  5. Save the macro and the page.

To create the macro sequence source table < Pivot Table < Table Transformer on Confluence Cloud, please use the Table Toolbox macro. You can't nest macros directly in the new Cloud editor.