Support » Plugin: TablePress » Column Width not able to change

  • Resolved sushil.katre

    (@sushilkatre)


    Hi Tobias,

    I am a new user of TablePress and found it straight forward to use. Except I got stuck with changing the width of the columns. I have already tried going through the FAQs and the previous posts. But none of the CSS codes worked for me.

    In the given link, lets take example of Column 5 – “Column or Regional Name”. There is a lot of text in each of the cell, I want to define a wider column for this such that the text wraps as well. I have a few columns like this and not being able to widen the columns is making the table look weird.

    Thank you
    Sushil

    The page I need help with: [log in to see the link]

Viewing 13 replies - 1 through 13 (of 13 total)
  • Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble.

    The problem here is that your table is too wide for the screen already, which is why you can’t really increase it.
    You could first add horizontal scrolling (via the scroll mode from https://tablepress.org/extensions/responsive-tables/ ).
    Then, add this to the “Custom CSS” textarea on the “Plugin Options” screen of TablePress:

    .tablepress-id-2 .column-5 {
      width: 200px;
      min-width: 200px;
    }

    Regards,
    Tobias

    Hi Tobias,

    You are super quick. I understood about the table being too wide. It seems to be working. Will play around with your suggestions for the overall table.

    In case I get stuck, I might seek your help again.

    Thank you again.

    Sushil

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

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

    Best wishes,
    Tobias

    P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!

    Dear Tobias,

    I have been able to work with the columns, scroll and a few other things I needed.

    I am not sure if I shall be opening new threads for these or its okay to take them up here:

    Here are some observations and issues I am facing:

    1) I have enabled Fixed Column – when I scroll down, the column remains fixed, but when I scroll horizontal after scrolling down, the column doesn’t move horizontally, so the field under the column headings becomes misaligned.

    2) I was not able to get the fixed row working. Its not a big issue thought, it would have been good.

    3) To enable the filters, I had to enable “Use DataTables:” and search/filtering option. Is that how its supposed to work?

    4) I tried putting the buttons, but when I do that, filers disappear. Is there a way to keep them both?

    I am truly in awe of how you have build the add-ons, providing perfect customization.

    Thank you so much.

    Sushil

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    1) and 2) This is mainly caused by the table being too wide. Unfortunately, it’s not possible to use both FixedHeader and FixedColumns at the same time, sorry.

    3) Yes, this is necessary. You can however hide the Search field with CSS code, if you don’t want it, like

    #tablepress-2_filter {
      display: none;
    }

    4) To use Buttons and ColumnFilterWidgets at the same time, you need a special “Custom Command”, see https://wordpress.org/support/topic/conflict-columnfilterwidgets-and-buttons-1/#post-6715527

    Regards,
    Tobias

    Dear Tobias,

    Thank you so much for the help.

    I was able to work with your inputs.

    Thanks a lot.

    -> Sushil

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    great! Good to hear that this helped!

    Best wishes,
    Tobias

    sushil.katre

    (@sushilkatre)

    Hi Tobias,

    Hope you are well.

    I had a question – is it possible to display a set of filters alone when someone opens the page (hide the table) and based on the filter selection display the table?

    -> Sushil

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    I see what you mean, but unfortunately, I’m not aware of a solution for that, sorry.

    Regards,
    Tobias

    sushil.katre

    (@sushilkatre)

    Hi Tobias,

    Understood. No worries.

    I am stuck with one last thing. http://edibleforest.org/dummy-database/ This is the dummy entry i have created for easy view as compared to the original database.

    If you look at 3rd column “All Regions” we have multiple entry in each cell, because a tree can belong to multiple regious. Similarty 5th Column “Secondary Functions” we have multiple entry in each cell, as the tree can perform multiple functions.

    Now when we use the filter widget with dropdown, the dropdown menu provides all various comibantions which becomes difficult for users.

    The way I was envisioning this was to ask 3 simple questions to the users:

    1) Region (choose one from) – East, West, North and South
    2) Function (choose one from) – Nitrogen Fixer, Live Fence, Wind Break, Fire Break, Pollinator/Insects/Birds and Fruits & Nuts
    3) Layer (choose one from) – Layer1, Layer2, Layer3, Layer4, Layer5, Layer6, and Layer7

    And then display the results based on these three parameters (it is okay even if the table cannot be hidden before the filters are aplied)

    I am wondering how to achieve this. What would be the best possible way to do this.

    Would you have any inputs on this?

    Thank You
    -> Sushil

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    for this, you can use the datatables_columnfilterwidgets_separator Shortcode parameter, see https://tablepress.org/extensions/datatables-columnfilterwidgets/

    Regards,
    Tobias

    Dear Tobias,

    What should I say about you. You have answers for everything.

    This was a miss at my end. I should have gone through the link more carefully.

    Thank you so much for this.

    -> Sushil

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    no worries 🙂 Good to hear that this helped!

    Best wishes,
    Tobias

Viewing 13 replies - 1 through 13 (of 13 total)
  • You must be logged in to reply to this topic.