WordPress.org

Support

Support » Plugins and Hacks » TablePress » [Resolved] Individual cell highlight

[Resolved] Individual cell highlight

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

    @tobiasbg

    Hi,

    thanks for your question.

    Highlighting a single cell is possible with this CSS code that needs to be entered into the “Custom CSS” textarea on the “Plugin Options” screen of TablePress:

    .tablepress-id-1 tbody td:hover {
        background-color: #ff0000;
    }

    Note that you must uncheck the Row Highlighting checkbox on the table’s “Edit” screen for this to work!

    However, you will probably not be happy with the result as you have split the image and the text into two cells. You should therefore merge them, as the effect will not look nice otherwise.

    To create a gap between the cells, you can use this “Custom CSS” code:

    .tablepress-id-1 {
        border-collapse: separate;
        border-spacing: 6px 6px;
    }

    The first number is the horizontal gap, while the second is the vertical cap.

    Regards,
    Tobias

    Thanks, I’ll give it a go!

    Plugin Author TobiasBg

    @tobiasbg

    Hi,

    no problem. If this does not work, just let me know.

    Best wishes,
    Tobias

    P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!

    Hi, you may get this question twice, apologies if so.

    I have amended the cells as recommended, however please advise how to sit the image to the left with the text next to it on the right, rather than as currently appears at http://www.heliweb.co.uk/

    I used the ‘inset image’ button in WP.

    Many thanks

    Plugin Author TobiasBg

    @tobiasbg

    Hi,

    you will basically just have to move the HTML code for the image to the beginning of the text, i.e. before the texts like “Are you looking” and “Ever dreamt”.
    After that, you can fix the spacing around the images by adding this to the “Custom CSS”:

    .tablepress-id-2 img {
        margin: 5px 5px 0 0;
    }

    Regards,
    Tobias

    Great, thanks!
    Last question (hopefully!) Is there a way to remove the horizontal line underneath the tables?

    Plugin Author TobiasBg

    @tobiasbg

    Hi,

    yes, that table border can also be removed with some CSS code. For details, please see the answer to the question “How do I remove the borders from a table?” in the TablePress FAQ at http://tablepress.org/faq/

    Regards,
    Tobias

    Thanks

    Plugin Author TobiasBg

    @tobiasbg

    Hi,

    no problem, you are very welcome! 🙂 Good to hear that this helped!

    Best wishes,
    Tobias

    P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!

    Will do.

    Do you know what font is used in the WP 2012 template as I’d like to use it in my table for continuity.

    Thanks

    Plugin Author TobiasBg

    @tobiasbg

    Hi,l

    the main font in TwentyTwelve is OpenSans. That’s also used in tables by default, but you have changed that in the “Custom CSS”. If you remove that, you will get the default font again.

    Regards,
    Tobias

    Got it. Thanks again.

    Plugin Author TobiasBg

    @tobiasbg

    Hi,

    sure, no problem!

    Best wishes,
    Tobias

    Hi

    Is there a way to round the edges of the cells – similar to the images that appear in them?

    Thanks

    Hi, wokkaboy

    Custom CSS should do what you expect, like this:

    .tablepress td {
        border-radius: 5px;
    }

    You could give it a try. And the radius could be changed to other numbers to get a content look. Please let me know if you need other help.

    Regard,
    Haoxian

Viewing 15 replies - 1 through 15 (of 22 total)
  • The topic ‘[Resolved] Individual cell highlight’ is closed to new replies.
Skip to toolbar