Okay
  Public Ticket #3542128
Responsive
Closed

Comments

  • Autumn Taylor started the conversation

    When I select responsive it makes the chart look incorrect, how do I make it use each product as a heading on a mobile device? On bigger devices it shows correctly. Any help is appreciated. I watched your responsive video and I appear to be missing all the capability to modify this, what might I be doing wrong? So how come either the simple table cannot be responsive and the tools in the simple table aren't available in the manual table.  I am so confused in here. I loved the simplicity and ease of the setup of the simple table but it will not work on mobile devices.

    Attached files:  Well Water Comparison Chart - Pure Water Systems….jpeg

  •  1,846
    Miloš replied

    Hi Autumn,

    Firstly, I would like to sincerely apologize for the delayed response as we have been experiencing an unusually high number of tickets. I am sorry that it has taken longer than usual to respond to your concern and your patience is highly appreciated.

    -

    Yes. Our Responsiveness  Feature, where you will be able to have some columns initially hidden/collapsed on Tablet/Mobile, and have an 'expander icon' + which can be pressed on each row to expand/show more data;

    That is available for tables other than Simple Table.

    The Simple Table type has its own, different responsive way how that works.

    In regards to Responsive possibilities for our Simple Tables,

    there can be a couple of different ways to do this.

    -

    For example, first enable the Responsive behaviour, in the table's "Responsive" settings/Basic Responsive.

    5748885041.png

    Now, if you don't set to take the first row as Header row, in the Display settings,

    it is going to place each row one beneath each other,

    and it will just take the header rows in the same way.

    5193650319.png

    But if you choose to have "Use first row as table header",

    then it looks like this

    3144426685.png

    Here is an example for device Samsung Galaxy S20 Ultra

    2502298752.png

    And one image for iPhone

    2617355972.png

    So now as you see, it places them all one row beneath each other,

    but it places the Header cell on the side.

    -

    You can also try with adding a vertical scroll, and you can decide the height of the scroll 

    2911778887.png

    Let me know if that helps.

    Kind Regards, 

    Miloš Jovanović
    [email protected]

    Rate my support

    Try our FREE mapping plugin! MapSVG - easy Google maps, interactive SVG maps and floor plans, choropleth maps and much more - https://wordpress.org/plugins/mapsvg-lite-interactive-vector-maps/

    wpDataTables: FAQ | Facebook | Twitter | InstagramFront-end and back-end demo | Docs

    Amelia: FAQ | Facebook | Twitter | InstagramAmelia demo sites | Docs | Discord Community

    You can try wpDataTables add-ons before purchasing on these sandbox sites:

    Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables