WordPress.org

Ready to get started?Download WordPress

Forums

WP-Table Reloaded
3 formatting questions (11 posts)

  1. BrookinMT
    Member
    Posted 4 years ago #

    Hi,

    My tables are at: Free iPhone App Marketing

    I've got three formatting questions:

    1) I changed the formatting of my tables by entering this code into my CSS:

    .wp-table-reloaded td {
    font-family: Arial;
    font-size: 15px;
    color: #ff0000;
    }

    How do I change titles to the larger text?

    2) There is quite a bit of space after my tables before the next text shows on the page. How do I get rid of that?

    3) In the FAQs you mentioned "just go to the Custom CSS textarea on the Plugin Options screen":

    Where is the "Custom CSS textarea on the Plugin Options" screen?

    Thanks!
    Brook

  2. TobiasBg
    Member
    Plugin Author

    Posted 4 years ago #

    Hi Brook,

    thanks for your questions!

    1.) Applying the changes to the table head titles as well is easy, just add this code:

    .wp-table-reloaded th {
      font-family: Arial;
      font-size: 15px;
      color: #ff0000;
    }

    (Note the th instead of the td.)

    2.) The additional space is caused by the DataTables JavaScript library. Just disable that on the "Plugin Options" screen.

    3.) That CSS textarea can found after clicking on "Plugin Options", when in WP-Table Reloaded. It's a textfield where you can add additional CSS (like the one above). Can you now find it?

    Best wishes
    Tobias

  3. BrookinMT
    Member
    Posted 4 years ago #

    I found it!

    But now several of my fonts are red (the head titles and the numbers in the second column):
    http://www.onlinemarketingrant.com/free-iphone-app-marketing

    How do I make them black?

    Thanks!
    Brook

  4. TobiasBg
    Member
    Plugin Author

    Posted 4 years ago #

    Hi,

    they are red, because the code tells them to be. :-) I only took your first code and modified it.
    However, it is easy to fix the color to black.
    Just change the

    color: #ff0000;

    part of the code above to

    color: #000000;

    Best wishes,
    Tobias

  5. BrookinMT
    Member
    Posted 4 years ago #

    Worked! Perfect...thanks.

    Brook

  6. naridus
    Member
    Posted 4 years ago #

    Hello, Tobias. Thank you for your lovely and powerful plugin. A life saver!
    In the lines of BrookinMT's queries: Is it possible to change the font size, color, format of a single line within a cell? I would like to make the first line in a cell bold and a pixel or two larger than the descriptive type below. Thank you for thinking about this. And thank you again for your plugin.
    Frank

  7. TobiasBg
    Member
    Plugin Author

    Posted 4 years ago #

    Hi,

    it is not possible to just select and change the first line of text in a text cell.
    But there is a workaround: Wrap that text in a HTML <span> tag, which will then provide a possibility to access that text with CSS.

    So, if your table cell is

    --------------------------
    | This is the first line |
    | and this the second    |
    --------------------------

    change that to

    ---------------------------------------
    | <span>This is the first line</span> |
    | and this the second                 |
    ---------------------------------------

    Then add some "Custom CSS" like

    .wp-table-reloaded-id-123 td span {
      color #ff0000;
      font-size: 20px;
    }

    Basically this is a slight variation of my answer to the question "How can I highlight certain cells or their content?" in the FAQ at http://tobias.baethge.com/wordpress-plugins/wp-table-reloaded-english/faq/.

    Best wishes,
    Tobias

  8. naridus
    Member
    Posted 4 years ago #

    Thank you. I will give it a go. (I did check your FYIs before writing, but I am a novice at coding). I appreciate your time, and will report back on the results,

  9. naridus
    Member
    Posted 4 years ago #

    Tobais.....i gave it a go doing this, following your instructions, and placed the below in the Custom CSS. I had mixed results. The header didn't change. The Span worked, though the color following the span did not change.
    ---------
    wp-table-reloaded-id-3 td span {
    color: #ff000;
    font-size: 18px;
    }

    .wp-table-reloaded-id-3 td {
    font-family: Helvetica, Arial, Futura;
    font-size: 14px;
    color: #000000;

    }

    .wp-table-reloaded-id-3 th {
    font-family: Arial;
    font-size: 28px;
    color: #ff000;

    ======
    What I did do to get the desired results was place HTML code in the table cells via the table edit mode:
    For example the Header:
    ====
    <font size="4px"><font color="000000"<b>GIVE ONE, GET ONE</b>
    <font size="3px"><font color="#707070">Celebrating our new company name and expanded offerings!
    --Give One Naridus Product or Service and Get One Free--
    =====
    For a Cell:
    <span>6 Powerful Workshops From Which to Choose: </span>
    <Font color="336600">

    =====
    It seems I mixed and matched and was able to do what i wanted to do.

    table is at: http://naridus.com/wp/index.php/special-offer/

    Any thoughts you have would be welcomed.

    Thanks, again...your plugin is heaven sent.

    Regards,
    Frank

  10. TobiasBg
    Member
    Plugin Author

    Posted 4 years ago #

    Hi,

    your theme has some CSS which causes a tiny conflict for the browser.
    To solve that, we need to raise the priority of the table's CSS.

    Can you try again with the following modified code?

    .wp-table-reloaded-id-3 td span {
      color: #ff000!important;
      font-size: 18px!important;
    }
    
    .wp-table-reloaded-id-3 td {
      font-family: Helvetica, Arial, Futura!important;
      font-size: 14px!important;
      color: #000000!important;
    
    }
    
    .wp-table-reloaded-id-3 th {
      font-family: Arial!important;
      font-size: 28px!important;
      color: #ff000!important;
    }

    (Note !important keyword.)

    And: The usage of your HTML is also possible, but for the color values you need to use a slightly different syntax:
    In front of all color values (like 000000), add a # sign.

    Best wishes,
    Tobias

  11. naridus
    Member
    Posted 4 years ago #

    Tobias...thank you once again for your help and time. I will give your suggestions a go. If I may? We will be making a donation to support your efforts, and we would like to send you a cap from our local Major League baseball team, the Pittsburgh Pirates. If you would forward a postal address to frank@naridus.com and a cap size... I will post that you.

    Thanks, again.
    Frank

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic