Okay
  Public Ticket #3439630
Using the tool
Closed

Comments

  • David Siddons started the conversation

    Dear All I added a table to the site 

    a. It's not responsive as you can see below. I clicked on making it fit the page but that does not work. Also I tried making each column smaller but also hard to do and it still won't fit the site

    https://newsluxlifedev.wpengine.com/vazquez/


    Lastly when I try to sort the data it makes zero sense cause sorting any column it sorts randomly and not highest to lowest or lowest to highest


  •  1,819
    Miloš replied

    Hi David,

    this table looks very strange on your page, indeed.

    1. First when the page starts loading, we see a table looking like this :

    5521658389.png

    2. But after it completely loads, the columns become extremely small, like this :

    3813895377.png

    Did you maybe add custom width to the tables, and made them too small?

    -

    Did you enable this option,

    in the table's Display Settings/Hide until loaded ?

    7430238645.png

    This can help to have the table wait until it is completely loaded to avoid any strange 'flashing' or formatting appear before it's ready.

    -

    If you already did this, it is most probably some conflict you have on site,

    between our Plugin and something else.

    -

    Can you show us a screenshot how the table looks on the back-end,

    does it look as it should be, and this issue just happens on front-end?

    If that is the case,

    wpDataTables is a WYSIWYG (What You See Is What You Get) concept-based plugin. This means that the table should look the same both in the back-end and in the front-end. 

    If your front-end table looks and behaves differently than in the back-end, this usually implies that there is another plugin (or the current theme) that's changing the behavior of our plugin.

    Can you please change the theme and see if the issue is resolved?

     If not, then please deactivate all other plugins except for our plugin, refresh the page where the issue is, and see if it is resolved (it should be). 

    If it is, then start activating other plugins one by one, and after each activation refresh the page to see if the issue occurred.

     Once it does reoccur, you will have found the plugin causing the issue.

    Let us know how it goes.



    3.  In regards to sorting of the Data,

    does it happen for these columns where you got numerical data and the currency?

    9358158002.png

    If that is the case,

    can you tell me, do you have the currency symbols in your source data coming from the Google Sheet?

    If that is the case, then you probably set these columns as String Type in our Table?

    For the String Columns, our plugin sorts only alphabetically;

    So if you need the proper Numerical Sorting,

    please go in your source Sheet,  remove any symbols like currency and just have pure numerical data there;

    After that, in our Plugin's Column settings/Display tab, you can just add a prefix as $ ,

    then change the Column Type to Float, and you will achieve proper numerical sorting there.

    -

    9608227695.png
    4543663383.png

    A side note for Float Data, 

    please make sure to match the same Number Format coming from the source data,

    with the setting in our Main Plugin Settings/Number Format,

    and the right number of Decimal Places.

    -

    Let me know if that helps.



    4. Responsive behaviour :

    Can you tell us what kind of responsive behaviour you would like to achieve?

    If you want to try out 'built-in' Responsiveness Feature, here is an example :

    For mobile screens, a typical layout with our built-in responsive setup can be, for example, like on this screenshot, two columns showing fully, ( you can choose one or more to be "visible") and the rest of the columns, "hidden", 

    then there is an " + " button, to open a certain row, and show all the details, of course.

    6994569191.png

    For example, if i got this table

    3722903196.png

    And if i only select columns Client and City, to show on mobile screen, go to Column List:

    4610164724.png

    The little mobile image is used to display on mobile screens, and the one to the left of it is for tablets;

    This is the result:

    5367177478.png

    Please check out this Documentation section with a step-by-step example of how to achieve this, and let me know what you think.

    https://wpdatatables.com/documentation/table-features/responsiveness/

    -

    So, i will advise to check if you selected the two columns that you need to be both visible on mobile;

    see them on column list;  and set them visible on mobile, while keeping the other column grayed out.

    -

    I hope it helps.

    If you need us to go in more detials/troubleshoot more on any of these points,  ( besides the first one/page layout issue),

    please open a new ticket for each issue and we can work on them with better focus.

    When you have multiple questions or issues which are for different subjects/topics,

     please open a new ticket for each subject, and we will help/advise more effectively. 

    In that way, issues and questions which are related to different subjects will be in separate tickets so other users or our support agents can find them easily. 

    Our policy is to have one issue or question per ticket for the reasons described already.

    Thank you for understanding.

    Kind Regards, 

    Miloš Jovanović
    [email protected]

    Rate my support

    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

  • David Siddons replied

    you asked me for a backend picture and I attached it

    Attached files:  Screenshot 2023-08-18 at 12.51.32 PM.png

  •  1,819
    Miloš replied

    Hi David,

    thank you for sending the screenshot of how the table looks in back-end.

    I can see on the front-end,  the table first 'flashes' to show what seems to be the correct layout,

    but then after a brief moment, it turns to this strange looking column widths.

    I am sending you a Video to see what i mean, how it looks from my end.

    So it seems you have some sort of a conflict on site which is overriding our table's default behaviour.

    -

    wpDataTables is a WYSIWYG (What You See Is What You Get) concept-based plugin. 

    This means that the table should look the same both in the back-end and in the front-end.

     If your front-end table looks and behaves differently than in the back-end,

     this usually implies that there is another plugin (or the current theme) that's changing the behavior of our plugin.

    Can you please change the theme and see if the issue is resolved?

     If not, then please deactivate all other plugins except for our plugin,

     refresh the page where the issue is, and see if it is resolved (it should be).

     If it is, then start activating other plugins one by one, and after each activation refresh the page to see if the issue occurred.

     Once it does reoccur, you will have found the plugin causing the issue.

    -

    Let me know if you isolate what is causing this by doing these steps, please?

    If not, can we take a look from the back-end setup?


    Please provide me a temporary WP-admin (administrator) user for your site where this happens, so we could log in and take a look ‘from the inside’ as that’s the most efficient way to see and resolve the issue. 

    We do not interfere with any data or anything else except for the plugin (in case that’s a production version of the site), and of course, we do not provide login data to third parties. 

    You can write credentials here just check PRIVATE Reply so nobody can see them except us.


    Attached files:  ScreenRecorderProject51.mkv

    Kind Regards, 

    Miloš Jovanović
    [email protected]

    Rate my support

    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