• Resolved watchmakingtools

    (@watchmakingtools)


    Is it possible to amend the colour of horizontal rows background colour in alternate rows in TablePress?

    Also, is it possible to set a custom column width for each column?

Viewing 13 replies - 1 through 13 (of 13 total)
  • Plugin Author TobiasBg

    (@tobiasbg)

    Hi!

    Thanks for your post and sorry for the trouble!

    Yes, changing the styling and the colors is no problem! You can for example use CSS code for this, see the TablePress FAQ.

    If you prefer a more visual editing, check out the Default Style Customizer feature that is part of the TablePress premium versions.

    Changing column widths is possible with CSS code as well, see https://tablepress.org/faq/column-widths/

    Best wishes,
    Tobias

    Thread Starter watchmakingtools

    (@watchmakingtools)

    Thanks Tobias, is it also possible to configure the column widths via the Default Style Customizer?

    Lastly, is it possible to add a watermark to a table?

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    no, sorry, changing column widths in the Default Style Customizer is not possible — and would actually not really make sense: The Default Style Customizer sets the default styling for all tables at once. While this makes sense for colors, etc., tables will have different content, so that they will have or need different column widths anyways. So, for now, the best approach for setting column widths (if it’s actually necessary to override the defaults that the browser determines automatically) is to use CSS.
    (I do however plan to extend the Default Style Customizer in the future, to also allow styling individual tables, where setting column widths is also one of the goals).

    As for the watermark: Do you mean something like a background image for the table? This is in general possible with CSS code as well.

    Best wishes,
    Tobias

    Thread Starter watchmakingtools

    (@watchmakingtools)

    Hi Tobias, thanks for the detailed response, much appreciated.

    When i mention watermark i do mean a background image for the table. Do you have any guidance on the CSS code needed to achieve this?

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    sure, no problem!

    Adding a background to a table is not too difficult. You could e.g. add this to the “Custom CSS” text area on the “Plugin Options” screen of TablePress:

    .tablepress-id-123 {
        background-image: url(https://example.com/your-image.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 50%;
    }

    (with the correct table ID, the image URL, and maybe some tinkering with the other parameter values). You would also have to turn off the “Alternating Row Colors” and “Row Hover Highlighting” checkboxes on the table’s “Edit” screen, or adjust those colors to be semi-transparent.

    Best wishes,
    Tobias

    Thread Starter watchmakingtools

    (@watchmakingtools)

    Hi Tobias,

    I’ve tried the above CSS you suggested to display a background image but struggling to get it working. Can I confirm the following:

    In this part of the CSS “.tablepress-id-123 {“

    Is “tablepress-id-123” meant to be replaced with the Tabled ID or just “123”?

    Thank you

    Marinos

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    just the 123 would have to be replaced.

    If this change then still does not work, can you please post a link to the page with the table where this problem happens, so that I can take a direct look? Thanks!

    Best wishes,
    Tobias

    Thread Starter watchmakingtools

    (@watchmakingtools)

    Thanks Tobias, please see the first table on this page – https://watchmakingtools.com/test/.

    Sure i’ve missed something, just can’t see what.

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for the link! Please turn off the “Alternating Row Colors” and “Row Hover Highlighting” checkboxes on the table’s “Edit” screen, or adjust those colors to be semi-transparent.

    You will then see the background image.

    To remove the border lines (if desired), also add this CSS code:

    .tablepress-id-France-Ebauche-FE-LA th,
    .tablepress-id-France-Ebauche-FE-LA td {
        border-top: none;
    }

    Best wishes,
    Tobias

    Thread Starter watchmakingtools

    (@watchmakingtools)

    Thank you Tobias, this now works.

    Sorry to be a pain but I really want to show the alternating row colors so how do I make these semi-transparent? Also, is there a way to make the background image repeat?

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    you would need to choose an “rgba” color (which has transparancy), e.g. using https://rgbacolorpicker.com/ and assign that with CSS code, via https://tablepress.org/faq/change-color-alternating-rows/

    To have the image repeat, you would need to assign a different value to the background-repeat CSS property in the CSS above, see https://developer.mozilla.org/en-US/docs/Web/CSS/background-repeat

    As we are reaching the limits of what I can offer as free support here, and or if you would like more specific suggestions, I would recommend checking out the TablePress Premium versions which also come with direct priority email support for things like this.

    Best wishes,
    Tobias

    Thread Starter watchmakingtools

    (@watchmakingtools)

    Thanks for all your help Tobias.

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    sure, no problem!

    Best wishes,
    Tobias

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Table Formatting’ is closed to new replies.