• Resolved jkgourmet

    (@jkgourmet)


    Tobais, I’m trying to change the styling on the table description. I’d like to increase the font size, make it bold and change the color.

    The Table id is 9. https://gringodog.com/pet-friendly-hotels-mexico/

    Here’s the code that I have now, that does not seem to work. I have tried a number of changes (18px and 18pt, moving the table-id-9 to different places), but I am stumped. Can you see where my problem is?

    .wp-table-reloaded-id-9 .table-description {
    font-family: Arial;
    font-size: 18px!important;
    font-weight: bold!important;
    color: #ee0000;
    }

Viewing 3 replies - 1 through 3 (of 3 total)
  • Hi Jeanette,

    unfortunately, you seem to have found another piece of text which can not be customized on a per-table basis.
    Currently, the table description is only customizable for all tables at the same time.
    I don’t actually know why I chose it that way (as this has nothing to do with e.g. the possibility to change the wording of the “Search” box, where I don’t have a chance).
    So what I will certainly do: Make the description changeable in the next version. Thanks for pointing me to that. You have just got yourself a new feature in the plugin ??

    Fortunately, there’s also an easy way to achieve what you need without that feature. You only need to do two things:
    Change the “Custom CSS” to

    #wp-table-reloaded-id-9-table-description {
      font-family: Arial;
      font-size: 18px!important;
      font-weight: bold!important;
      color: #ee0000;
    }

    and wrap your table description in a <span> HTML tag, like this:

    <span id="wp-table-reloaded-id-9-table-description">THIS IS YOUR DESCRIPTION.</span>

    (In other terms, prepend <span id="wp-table-reloaded-id-9-table-description"> to your description and then append </span> at the end.)

    What this will do: As there is none available (due to my mistake, I guess), we will just create a HTML object which we can apply styling to, around the actual text of the description. That HTML object, a span, gets the ID (i.e. name) wp-table-reloaded-id-9-table-description, which you can find again in the “Custom CSS”, as the selector in the first line.

    Best wishes,
    Tobias

    Thread Starter jkgourmet

    (@jkgourmet)

    Bravo – perfect. You are still my hero.

    BTW, I was originally only going to use ONE table in this site, but found the plug in to be so effective and easy to use that I’ve adapted it for other pages that aren’t exactly tables. https://gringodog.com/pet-friendly-hotel-chains/

    For people like me who are largely ignorant about coding, this is a great and easy way to line up images and text, etc. You might want to incorporate this into your FAQ’s as an additional usage of the plug in.

    (I think I should get a gold star for figuring out how to make the grid lines go away and make the background transparent. See – I do SO know how to use the search function. ??

    With gratitude,
    Jeanette

    Hi Jeanette,

    thanks for your nice words. Great to hear that the plugin helps you so much! And of course you get a gold star! ??

    Regarding the use of the plugin for aligning images: While that certainly works, I’m not really a fan of it. Actually you are mis-using a table for that (not your fault, and you are not the only one). In theory, HTML tables should be used to display data, and they should not really be used for layout or styling of a page. While that certainly works very nice, it’s not correct semantically. But of course it works.

    Best wishes,
    Tobias

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘change font size and color of Table Description’ is closed to new replies.