How can i assign Different Width and Color to different columns?

Hi,

thanks for your question, and sorry for the trouble.

You can set column widths and change row background colors with CSS code. Please see the TablePress FAQ page https://tablepress.org/faq/ for examples.

Regards,
Tobias

@tobiasbg Thanks for the reply. I found the below CSS code there. But my question is that can I change the color of multiple rows with single css code by putting Commas between the rows number?

Code:
.tablepress-id-N .row-X td {
background-color: #ff0000;
color: #00ff00;
}

Hi,

in that case, you would do it like this:

.tablepress-id-123 .row-4 td,
.tablepress-id-123 .row-7 td,
.tablepress-id-123 .row-9 td,
.tablepress-id-123 .row-12 td {
  background-color: #ff0000;
  color: #00ff00;
}

Regards,
Tobias

@tobiasbg In Case I have about 100 rows to change colors the CSS code will become too large. Is not there any way to change colors of multiple rows with small CSS code. I mean by putting just commas between the rows number?

@tobiasbg And also the above CSS code is not working.

Hi,

no, sorry, this is not possible with CSS code.
Another option would be to use Row Highlighting, see e.g. https://www.ads-software.com/support/topic/highlight-a-row-based-on-value/

With this, you would have to add keyword in the cells that you want to highlight, for example in an extra hidden column, and the row will be highlighted automatically. The CSS code will then be very small.

Regards,
Tobias

@tobiasbg Sorry I will take your time again. Can I change the colour of specific text in the whole table? Because I saw in a website below. They have changed the colour of some text to red color. you can see in the below website.
https://www.animesays.com/list/one-piece/

I tried all the FAQ section of table press but unable to change the colour of some specific text

• This reply was modified 4 years, 7 months ago by Muhammad shafiq.

Hi,

what specific text do you mean? If it’s the same text again and again, the mentioned TablePress Extension would work as well. Alternatively, you can do it manually with the <span> approach from https://tablepress.org/faq/highlight-cells-or-content/

Regards,
Tobias

@tobiasbg Thanks for the response. In the below table I want the word “Filler” to appear red. Everywhere on all tables on my site the word “Filler” should appear Red.
https://www.bestanimeseries.com/one-piece-filler-list/

Hi,

then, use the approach from https://www.ads-software.com/support/topic/highlight-a-row-based-on-value/

Install and activate the Extension and use the modified Shortcode

[table id=12 row_highlight="Filler" row_highlight_full_cell_match=false /]

Then, also add this to the “Custom CSS”:

.tablepress-id-12 .row-highlight-filler .column-3 {
	color: #ff0000 !important;
}

Regards,
Tobias

@tobiasbg I uploaded and install the plugin in my wp. But there is no option to add the css code. You can see in the s.s below. the plugin is installed but there is no way to add codes in to.
https://ibb.co/Wp5QDk4

Hi,

that option is on the “Plugin Options” tab in TablePress, so please go to the TablePress pages on your site first (where you see the list of tables).

Regards,
Tobias

@tobiasbg Hi, I added this code. but not working. Further, I want to apply these changes to all the tables on my site.

@tobiasbg OMG the code is perfect working. But I want to apply these changes to all the tables on my site. Because all the tables on my site contain this word.

Hi,

then change the Shortcode for all tables, like in the example above.
The CSS coud should be changed to

.tablepress .row-highlight-filler .column-3 {
	color: #ff0000 !important;
}

Regards,
Tobias