Hi Scott,
thanks for your question.
I see what you are trying to do, but at this time, I’d like to discourage you from doing this.
Adding such function to TablePress would require changes in almost all parts of the plugin, including table loading, user interface, saving and rendering. This will be a real mess, as not all these places offer plugin filter hooks or actions at this time that could be used. You would therefore have to modify plugin files directly, which is bad, as you would have to re-apply those changes after every update.
Instead, I’d like to suggest a similar method/workaround. It’s kind of hacky, but it should work even for inexperienced users.
There’s a TablePress Extension that can highlight rows based on its content that you can download from http://tablepress.org/download/extension/tablepress-row-highlighting.zip
The basic concept is explained in this thread: http://ww.wp.xz.cn/support/topic/highlight-a-row-based-on-value
In your case, let’s say you have the CSS classes “one”, “two”, and “three” that you want the user to attach to a row.
Then, you would add a new first column to the table where the user would enter the CSS class that he wants to apply (this is basically the replacement of the dropdown that you mention).
To hide this column from the site visitors, you can add this “Custom CSS”:
.tablepress-id-123 .column-1 {
display: none;
}
Then, change the Shortcode of the table to
[table id=123 row_highlight="one||two||three" /]
to tell the Row Highlighting Extension what to look for.
This will then add (slightly adjusted) CSS classes to the rows, that you can style via “Custom CSS”:
.tablepress-id-123 .row-highlight-one td {
background-color: #ff0000 !important;
}
.tablepress-id-123 .row-highlight-two td {
background-color: #00ff00 !important;
}
.tablepress-id-123 .row-highlight-three td {
background-color: #0000ff !important;
}
Regards,
Tobias
