Tables: Specify how many columns show on each viewport?

  • Resolved inselaeffchen

    (@inselaeffchen)


    4 years, 7 months ago

    Hello, I’ve just been experimenting with this today to see if it meets my requirements, but there’s something I’ve not been able to solve so far.

    I’ve got a table with three columns. The left column is a type of item/product and the other two columns display numerical relating to its specifications. It would be great if all three columns could be displayed when the display is wide enough, and on mobile portrait, if only the column with the product name could show, filling the screen width, with the “+” button to see the related info in the other two columns.

    Different things are happening each time I reload the page. What happens is this:

    Desktop: either two columns fill the screen width, with the “+” button to see the other column

    or

    All three columns are shown, but the table is really narrow, taking up maybe a third of the screen width.

    On mobile portrait:

    Two columns show, with the “+” button to see the other one

    or

    Just the product name column shows, which is what I actually want, although the header text is missing (that field is blank apart from the background)

    Refreshing gives different results, and is unpredictable.

    This may seem like a small thing, but as my columns are product/info 1/info 2, it would make sense for users to see all three columns where there’s space to do so, or just the product name on mobile portrait. They would then have to press “+” to see ALL the relevant info, rather than see 50% of the relevant info and then have to press to see the other half.

    Have I missed something? I could maybe sort this out with media queries, but it would be great if I’d missed a button somewhere!

    Any help greatly appreciated, thanks!

    (Mac: Safari and Firefox, including viewport previews on both. Safari and iCab on iPhone)

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Contributor contactashish13

    (@rozroz)

    @inselaeffchen you can choose to enable the responsive option, if you haven’t already. If you have, please share screenshots of how the page looks.

    Thread Starter inselaeffchen

    (@inselaeffchen)

    Hello, yes, I forgot to mention that responsive is definitely enabled.

    Screenshots here: shorturl.at/jwTU7

    Thanks!

    • This reply was modified 4 years, 7 months ago by inselaeffchen.
    Plugin Contributor contactashish13

    (@rozroz)

    @inselaeffchen looks like the screenshots have disappeared. Can you please post them again?

    Thread Starter inselaeffchen

    (@inselaeffchen)

    They’re still there, but it looks as if the short link expired after 24 hours. They’re now here: shorturl.at/drZ58

    Sorry for the hassle!

    Plugin Contributor contactashish13

    (@rozroz)

    @inselaeffchen we are using a library (https://datatables.net/) and the maximum our plugin allows is for you to extend the settings on your own with some knowledge of javascript. This means that you will have to look at the options provided by that library and add them to our code to customize it as per your needs. Or, as you have said, you can do it with media queries. There is no out of the box support for specific customization, unfortunately.

    If you are satisfied with our product and support, kindly spare a moment to leave us a review. It would really help us spread the word!

    Thread Starter inselaeffchen

    (@inselaeffchen)

    OK, thanks, I’ll bear that in mind if I don’t find another solution in the meantime.

    Your plugin looks interesting though, so maybe I’ll find a use for it in future, even if not this time.

    Thanks!

    Plugin Contributor contactashish13

    (@rozroz)

    Happy to have helped you.

    If you are satisfied with our product and support, kindly spare a moment to leave us a review. It would really help us spread the word!

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Tables: Specify how many columns show on each viewport?’ is closed to new replies.