Change the rows name in Spreadsheet widget

Is it possible to change the rows just like we did with the columns?

This is not possible but according to this thread, you can change it using custom CSS code.

Here's the code:

th#row_1,  th#row_2{ 

    color: transparent;

} 

 th#row_1:after {

    content: "Name in Row1";

    color: #fff;

    margin-left: -10px;

}

 th#row_2:after {

    content: "Name in Row2";

    color: #fff;

    margin-left: -10px;

}

You can just change the number of the selector depending on the number of rows you have.

If you have 5 rows, then you need to create 5 th#row_1-5 selectors. You also need to create 5 separate th#row_1-5:after selectors. Also, the row header will be the value you put in the content property.

Here's a guide on how to insert custom CSS to the form. Here's the result:

Hope that helps. Thank you.

Thank you very much! I finally managed somehow...

 

Here's what i've done(never mind the numbers):

 

tbody > tr:first-child {

   background-color: #333;

}

 

#col_A, #col_B, #col_C, #col_D, #col_E {

   color: transparent;

   font-size: 1px;

}

 

#col_A:before, #col_B:before,#col_C:before,#col_D:before, #col_E:before {

    color: #FFF;

    font-size: 12px;

}

 

#col_A:before {

   content: "Dia 13";

}

 

#col_B:before {

   content: "Dia 14";

}

 

#col_C:before {

   content: "Dia 15";

}

 

#col_D:before {

   content: "Dia 16";

}

 

#col_E:before {

   content: "Dia 17";

}

 

 

#row_1, #row_2, #row_3, #row_4 {

   color: transparent;

   font-size: 1px;

}

 

.nowrap {

  white-space: nowrap;

}

 

#row_1:before, #row_2:before,#row_3:before,#row_4:before {

    color: #FFF;

    font-size: 12px;

}

 

#row_1:before {

   content: "9h-11h";

}

 

#row_2:before {

   content: "11h-13h";

white-space: nowrap;

}

 

#row_3:before {

   content: "14h-16h";

}

 

#row_4:before {

   content: "16h-18";

}