WordPress.org

Ready to get started?Download WordPress

Forums

TablePress
[resolved] Responsive design (6 posts)

  1. Philson
    Member
    Posted 1 year ago #

    I love this plugin. I added it to a responsive theme I'm using and was wondering if you've had a chance to put together some custom code to make the tables responsive. Thaks so much.

    http://wordpress.org/extend/plugins/tablepress/

  2. TobiasBg
    Member
    Plugin Author

    Posted 1 year ago #

    Hi,

    thanks for your question.

    Making tables responsive is difficult in general, but there's an idea that I have implemented in a so-called TablePress Extension. Please see http://tablepress.org/extensions/responsive-tables/ for more information. This Extension will use some CSS code, wrapped in media queries, to basically flip the table to the side on small screens and add a horizontal scrolling feature.

    Regards,
    Tobias

  3. John Sundberg
    Member
    Posted 1 year ago #

    Tobias,

    Have you seen this article regarding responsive tables?

    FooTable: a jQuery Plugin for Responsive Data Tables

  4. TobiasBg
    Member
    Plugin Author

    Posted 1 year ago #

    Hi John,

    thanks for that link!
    Yes, that looks like a nice approach, but I'm afraid that it is not really going to work for TablePress. Users create so many different tables, that the default configuration of this won't do it. And to change the configuration, it seems to require many changes in the HTML code of the table, which would be hard to implement while keeping them manageable. Also, I'm reluctant to add another JavaScript library, as that is very likely going to interfere with the JS for the sorting, search, and pagination. The approach in the Extension from the link above does not have this drawback, as the features will still work nicely (as it is CSS-only).

    Regards,
    Tobias

  5. Philson
    Member
    Posted 1 year ago #

    Thanks for the effort but this isn't going to work for our agenda. http://mobilemarchtc.com/agenda/ Though it puts the table on it's side, it still extends way beyond the bounds of the screen. While CSS only is ideal, I'm not sure how it would really accomplish a truly responsive table.

    I like the concept that John noted from Foo Tables. However, I'm not nearly the coder you guys are. Without a plugin, I'd need a ton of hand-holding.

    Tobias, thanks for the efforts and the great TablePress plugin. I'll continue to poke around. I'll need to find something. Having and agenda for a mobile conference that can't be read on a device is a problem.

    Cheers!

    Phil

  6. TobiasBg
    Member
    Plugin Author

    Posted 1 year ago #

    Hi Phil,

    yeah, for a table like that, the approach in the Extension will not really work (it doesn't look good for one, and the combined cells can cause technical trouble).
    Unfortunately, I don't see a quick and easy solution for you here. As the table is not a table with "tabular data" (like numbers or similar), you might need to consider a different kind of markup (e.g. HTML <div> elements), which you can then style easier with CSS.

    Regards,
    Tobias

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags