change layout of tables for all devices

  • Resolved designs.sm

    (@designssm)


    9 years, 4 months ago

    We are using this amazing plugin, but we have a problem. We have too many columns in each table, so in some devices, text breaks to another line, making the table look too unprofessional, but on small screens, when the layout changes and columns go to the left side, everything looks perfect.

    My question is what do I need to do to make table look as it does on mobiles or ipads, but in bigger screens too.

    Thanks

    https://www.ads-software.com/plugins/tablepress/

Viewing 10 replies - 1 through 10 (of 10 total)
  • Plugin Author Tobias B?thge

    (@tobiasbg)

    Hi,

    thanks for your question, and sorry for the trouble.

    I’m not sure that I understand, but it sounds as if you’d simply need to reduce the width of the tables then, doesn’t it?

    Regards,
    Tobias

    Thread Starter designs.sm

    (@designssm)

    Hi Tobias,

    Thanks for your reply. Not really. The table width is adjusted on large screens and shows text in 2 lines, which makes the table look “funny”, not very nice, but when you check the table on a smaller screen, the look changes and it puts the columns to the right. So my question is how do I make it look in all devices the same way, even if is a large screen, I want it to look the same layout as in smaller devices.

    Thanks

    Plugin Author Tobias B?thge

    (@tobiasbg)

    Hi,

    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!

    Regards,
    Tobias

    Thread Starter designs.sm

    (@designssm)

    This one for example https://www.ontarioinc.org/newcarrotstix/pro-series-tournament-rods-casting-rods/, but there are many more in other pages…

    Thanks

    Thread Starter designs.sm

    (@designssm)

    This is how it is viewed on smaller screens https://prntscr.com/948ncx and the way we want it for all screen sizes.

    Thanks

    Plugin Author Tobias B?thge

    (@tobiasbg)

    Hi,

    thanks a lot! That helps greatly! ?? So from what I can see, you are already using the TablePress Responsive Tables Extension from https://tablepress.org/extensions/responsive-tables/

    We will basically just have to modify a parameter in your Shortcodes. For that, please update to the latest version (you’ll have to do that manually via a fresh download from that link, but just one last time, as after that you will get updates from within WordPress).
    Then, just change the Shortcodes that you use to something like this (with the correct table ID):

    [table id=123 responsive=flip responsive_breakpoint=all /]

    Regards,
    Tobias

    Thread Starter designs.sm

    (@designssm)

    wow, thanks a lot… I knew it could not be difficult.

    Thanks

    Plugin Author Tobias B?thge

    (@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!

    Thread Starter designs.sm

    (@designssm)

    Done. Thanks a lot again for your fast and good support.

    Plugin Author Tobias B?thge

    (@tobiasbg)

    Hi,

    thanks! I really appreciate it!

    Best wishes,
    Tobias

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘change layout of tables for all devices’ is closed to new replies.