[Plugin- WP-Table Reloaded] Styling

Hi,

to change the title’s background and text color, you would use something like

.wp-table-reloaded-id-123 th {
  background: solid #000000;
  color: #ff0000;
}

That code will make the background black and the text white. The table in your link uses a background image, so you will need to create and upload such an image to your server first. Then the code needs to be adjusted:

background: #000000 url(url-to-the-image.jpg) repeat-x center center;

Regards,
Tobias

Could you give me the code to change the titles background to black, the title font to a9bf04 please

Plus i need to increase the text size and change the font to Helvetica.

The Table im working on is https://www.designandprintcentre.net/contact/

Thanks!

Hi,

seems like you need just a tiny tweak:

.wp-table-reloaded-id-4 th {
  background: solid #000000!important;
  color: #a9bf04!important;
  font-family: Helvetica!important;
  font-size: 14px!important;
}

Regards,
Tobias

That worked great thanks, how would i make the rest of the table look like the one on https://www.designandprintcentre.net/stationery/ ?

Hi,

after checking the code again, the easiest thing to do might actually be to deactivate the default styling of WP-Table Reloaded. That way, all tables would automatically look like the one from your link.

So, just go to the “Plugin Options” screen of WP-Table Reloaded and uncheck the “Default CSS:” checkbox.

Regards,
Tobias

Ok thanks last few things,

I want the background colour to be the lime green, and the text to be white on everything on the table except the header. Is there code for this?

Hi,

are you sure that you want that? ?? In my personal opinion that’s not to nice for the eyes ??

But to do it, just change the current code to

.wp-table-reloaded-id-4 td {
  background-color: #a9bf04!important;
  color: #ffffff;
  font-family: Helvetica;
  font-size: 10px;
  font-weight: bold;
}

Regards,
Tobias

Yeah worked fine thanks you’ve been a great help!

The finished version below

https://www.designandprintcentre.net/contact/

Hi,

great, thanks for the confirmation!

Best wishes,
Tobias

Hi,
Is there a chance to use HTML tags in the wp-table reloaded editor so i can make individual styling for some cells or words in a cell

for example i have a column for matches and i need to bold the team that won, in another column there will be words like win/ draw/ loose and i want to give them different colours

Hi,

sure, you can simply use HTML code in table cells. Or you can use CSS code by adding it to the “Custom CSS” textarea on the “Plugin Options” screen.

Regards,
Tobias

Hi Tobias,
Even for a hopelessly non-tech person like me, your plugin is extremely promising and this forum, in particular, is quite helpful.

To continue the current line of discussion, is it possible to set the CSS code so that it will affect only the cell contents in a specific table column?

I am creating a large series of four-column tables and the fourth columns in each contain multiple lines of text (link addresses) that I would like to display as clickable hyperlinks on my site-in-construction. I can do this, obviously, by manually adding the HTML code to each intended link, but I have tens of thousands of them in my CSV files — so a more automatic means of coding them would certainly be welcome.

Hi,

thanks for your question.

What you want to achieve is actually not related to styling. You will first need to make the links clickable, which is only possible through HTML.
And you are correct, manually adding all those links would be tedious – but you are lucky ?? I created a small Extension to WP-Table Reloaded a while ago, that will automatically convert plain URLs to clickable links (i.e. it will automatically create the HTML code).
You can find all details here: https://tobias.baethge.com/2009/12/extension-1-url-to-link-conversion/

Regards,
Tobias

Excellent! Thank you for your help.

Hi,

no problem, you are very welcome! ??

Best wishes,
Tobias