WordPress.org

Ready to get started?Download WordPress

Forums

TablePress
[resolved] CSS FOR Background color in column with merged cells (rowspan) (15 posts)

  1. dckchiu
    Member
    Posted 8 months ago #

    Is it possible to set table column with merged cells same background color in the plugin option custom CSS settings?

    If yes , how? I tried foe many times in vain.

    Thanks in advance,

    http://wordpress.org/plugins/tablepress/

  2. TobiasBg
    Member
    Plugin Author

    Posted 8 months ago #

    Hi,

    thanks for your question, and sorry for the trouble.

    Yes, this is possible with some "Custom CSS" code. To find that code, I'd however need to take a direct look at the table with the merged alls, and a more detailed explanation of how exactly you want them to look like. Could you therefore please post a link? Thanks!

    Regards,
    Tobias

  3. dckchiu
    Member
    Posted 8 months ago #

    Hi Tobias,

    Please see http://www.hkptu.org/medical/western/?page_id=5392

    I want the effect of table 64 but with the alternate row with different colors.

    Table 62 -

    Alternate color rows ON,
    Use Data Tables OFF
    This makes the alternative color rows working.

    Table 64 -
    Alternate color rows also ON,
    Use Data Tables ON (Use DataTables: Use the following features of the DataTables JavaScript library with this table:... In fact I do not check any features under this)
    If I turn this on, the first column background color is what I want but the alternative row color does not work.

    Relevant Custom CSS I used :
    /************************Debug**********************************/

    /**************** Column 1 background color**********************/
    .tablepress-id-62 .column-1,
    .tablepress-id-64 .column-1 {
    background-color: #39f;
    }

    Thanks in advance.

    David

  4. TobiasBg
    Member
    Plugin Author

    Posted 8 months ago #

    Hi David,

    thanks for the link and for the explanation!

    The problem here is that the "Use DataTables" checkbox is checked for table 64. That tables uses combined cells, which is not supported by the DataTables JavaScript library. The library then runs in to a JavaScript error, and one consequence of that is that the alternating row colors are broken.
    So, please uncheck the "Use DataTables" checkbox. As you have uncheck the individual features anyway, there's no harm in turning it off entirely.
    That will then restore the alternating row colors.

    Regards,
    Tobias

  5. dckchiu
    Member
    Posted 8 months ago #

    Yes that is what I have done for Table 62 but the first column do not have the color I want. It only have the left upper most cell got the background color I want. I want the whole column with the background color.

    Thanks.

  6. TobiasBg
    Member
    Plugin Author

    Posted 8 months ago #

    Hi,

    ah, thanks for the clarification.

    Then please turn off the "Use DataTables" for table 64 and change this "Custom CSS"

    .tablepress-id-62 .column-1,
    .tablepress-id-64 .column-1 {
    	background-color: #39f;
    }

    to

    .tablepress-id-62 .column-1,
    .tablepress-id-64 .column-1 {
    	background-color: #39f !important;
    }

    Regards,
    Tobias

  7. dckchiu
    Member
    Posted 8 months ago #

    Hi Tobias,

    Did it, but no luck.

    Regards,
    David

  8. TobiasBg
    Member
    Plugin Author

    Posted 8 months ago #

    Hi David,

    did you really make that change to the "Custom CSS"? I can't see the change in the CSS code, so are you sure that you clicked "Save"?

    Regards,
    Tobias

  9. dckchiu
    Member
    Posted 8 months ago #

    Oops !! It worked.

    What happened :

    I have checked the box Use a file for storing and loading the “Custom CSS” code. (recommended)

    I edited the tablepress-custom.css file and uploaded via the ftp. And I thought it was done. After seeing your message, I went to the WP Admin panel , Tablepress section :

    I have also checked the box before Load these “Custom CSS” commands to influence the table styling: ( I used this method earlier)

    And I found out that the change was not there, so I edited the section and saved. And it worked.

    What should be the proper way if I want to use a separate file to store the custom CSS ?

    Thanks
    David

  10. TobiasBg
    Member
    Plugin Author

    Posted 8 months ago #

    Hi David,

    great to hear that it worked now! :-)

    Basically, you should only ever edit the "Custom CSS" via that textfield on the "Plugin Options" screen. That will then automatically update the file. There's no need to manually edit that CSS file on the server via FTP.

    Regards,
    Tobias

  11. dckchiu
    Member
    Posted 8 months ago #

    Thanks a lot.

  12. dckchiu
    Member
    Posted 8 months ago #

    Hi Tobias,

    Just want to follow on this. In the plug-in option, it said it is recommended to save the custom css in a separate file.

    I found this file in the wp/content/ directory. Editing this file in an editor like Notepad++ is much easier.

    Is it possible to do that ?

    Thanks
    David

  13. TobiasBg
    Member
    Plugin Author

    Posted 8 months ago #

    Hi David,

    that "recommended" means that this method is recommended over writing out the CSS code into an inline style in every page.
    TablePress will do everything that's necessary for this out of the box, so that you won't have to mess with FTP clients or text editors.

    If you really prefer a text editor for editing the CSS code, still don't directly edit the file please, but go to the "Plugin Options" screen, copy the current CSS code from the text field, paste it into the text editor, make the desired modifications, and paste the modified code back into the textfield on the "Plugin Options" screen.

    Only with this method, it is ensured that the minified versions of the CSS files are created correctly.

    (The next version of TablePress will no longer have the "Use a file for storing and loading the “Custom CSS” code." by the way. It will just assume that this is set, as the underlying requirements are fulfilled on most servers.)

    Regards,
    Tobias

  14. dckchiu
    Member
    Posted 8 months ago #

    Got it. Thanks !

  15. TobiasBg
    Member
    Plugin Author

    Posted 8 months ago #

    Hi,

    alright :-) I know, the CSS management is a bit confusing, so the next version should indeed make this easier by having less clutter and options on the "Plugin Options" screen.

    Best wishes,
    Tobias

Reply

You must log in to post.

About this Plugin

About this Topic