• Resolved gphatch

    (@gphatch)


    since the latest update to TablePress, the sorting arrows that appear at the top of my table columns have re-appeared, despite my having put in place custom CSS to remove them (while maintaining the ability to sort), per previous solutions shared here.

    Were there any changes to the classes or other identifies that would render the older custom CSS no longer usable? What would be the fix?

    thanks,

    G

    https://ww.wp.xz.cn/plugins/tablepress/

Viewing 15 replies - 1 through 15 (of 26 total)
  • Plugin Author Tobias Bäthge

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble.

    This happened because I had to make a change to the HTML/CSS structure of the sorting arrows. Unfortunately, that change made the arrows visible again for everybody who had them hidden.

    To hide them again, please replace the “Custom CSS”

    .dataTables_wrapper .tablepress-id-1 .sorting div:after,
    .dataTables_wrapper .tablepress-id-1 .sorting_asc div:after,
    .dataTables_wrapper .tablepress-id-1 .sorting_desc div:after {
    	content: "";
    }

    with

    .dataTables_wrapper .tablepress-id-1 .sorting:after,
    .dataTables_wrapper .tablepress-id-1 .sorting_asc:after,
    .dataTables_wrapper .tablepress-id-1 .sorting_desc:after {
    	content: "";
    }

    (for all three tables 1, 2, and 3 where you are using this).
    In essence, the ” div” part has to be removed from the three blocks.

    Regards,
    Tobias

    Thread Starter gphatch

    (@gphatch)

    Worked perfectly – thanks!!

    G

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    Hi,

    no problem, you are very welcome! 🙂 Good to hear that this helped!

    Best wishes,
    Tobias

    This isn’t working for me. The sort arrows still show up.

    I put in:

    .dataTables_wrapper .tablepress-id-14 .sorting div:after,
    .dataTables_wrapper .tablepress-id-14 .sorting_asc div:after,
    .dataTables_wrapper .tablepress-id-14 .sorting_desc div:after {
    	content: "";
    }
    
    .dataTables_wrapper .tablepress-id-14 .sorting,
    .dataTables_wrapper .tablepress-id-14 .sorting_asc,
    .dataTables_wrapper .tablepress-id-14 .sorting_desc {
    	content: "";
    }

    …into the “Frontend Options”

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble.

    Please put in only

    .dataTables_wrapper .tablepress-id-14 .sorting:after,
    .dataTables_wrapper .tablepress-id-14 .sorting_asc:after,
    .dataTables_wrapper .tablepress-id-14 .sorting_desc:after {
    	content: "";
    }

    If that’s not working, 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

    Thanks so much for the help Tobias. I sent you a donation for the plugin a while back because it is awesome!

    Anyways, that worked 🙂

    I have one other question:

    Is it possible to apply the “Compact” data tables class to Tablepress?
    I’ve been trying to get a myriad of data tables things working with your plugin to no avail.

    Thanks,
    Tom

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    Hi Tom,

    that’s good to hear. Thanks for the confirmation!

    And thanks for having donated, I really appreciate it!

    Can you please elaborate what you mean with “compact” data tables class? I’m not really sure what you mean here.

    Regards,
    Tobias

    https://datatables.net/examples/styling/compact.html

    Pretty sure it makes the full width of the table fluid upon the content inside.

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    Hi,

    ah, thanks for the link. This CSS class simply reduces the padding in the table. You can achieve the same by adding e.g.

    .tablepress th,
    .tablepress td {
      padding: 4px 5px;
    }

    to the “Custom CSS”.

    Regards,
    Tobias

    Thanks again Tobias.

    That looks a bit better; however, it doesn’t seem to change the full width of the entire table. My tables all default to fit to page.

    Is there a way to get the table to fit to data rather than fit to page width?

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    Hi,

    yes, by default tables stretch to 100% of the page. To change that, please try e.g.

    .tablepress-id-123 {
      width: auto;
    }

    Regards,
    Tobias

    Thanks Tobias. I did:

    .tablepress {
    	width: auto;
    }

    for all tables on my site. Worked for some, but not all.

    For example, didn’t work on this one (and I don’t have any other css for this specific table. http://procomputergambler.com/nba/

    Also, on tables where it does work, it leaves the Search box way over on the right side of the page.

    Here is an example of where it did work, but left the search box way to the right. http://procomputergambler.com/cbb/

    Also, do you see under ‘Team’ how ‘Va’ and ‘Commonwealth’ went to two lines?
    How can I make that not happen?

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    Hi,

    this does not work on the /nba/ table as that is using the Horizontal Scrolling feature of the DataTables JS library. That requires full width tables. So, just turn that checkbox off to make the table more narrow.

    The problem with the search field is coming from the fact that the container around the table is still 100% wide. Unfortunately, that can not be made to just shrink to the size of the table, so that you’d have to set a width manually, e.g.

    .dataTables_wrapper {
      width: 60%;
    }

    To prevent the word-wrapping of “Va Commenwealth”, you could use

    .tablepress-id-6 .column-3 {
      white-space: nowrap;
    }

    Regards,
    Tobias

    Thanks so much Tobias. That works.

    I have one other question if you don’t mind 🙂

    I want a chart (like the one in the sidebar at http://www.procomputergambler.com) to be centered on its page. How do you center a chart.

    I tried this as I saw it as a solution in another thread, but it doesn’t work:

    .tablepress-id-10 {
    	width: auto;
    	margin: 0 auto 1em;
    }

    (from here: https://tablepress.org/faq/center-table-on-the-page/)

Viewing 15 replies - 1 through 15 (of 26 total)

The topic ‘Removing column sorting arrows’ is closed to new replies.