• Resolved ibshans

    (@ibshans)


    Hi there, I have created a table and am now trying to add some download buttons so people could copy it, get the PDF, etc. I installed the DataTables Button Extension and used the following shortcode:

    [table id=4 responsive=”scroll” datatables_buttons=”copy,csv,excel,pdf,print” /]

    But the buttons are not showing. Could it be because I had to merge some cells here and there? I read initially that JavaScript functions would not work well if I merged anything… I have marked the “Use DataTables” option but still doesn’t work. What else can I do?

    I have a second question regarding column width on mobile devices. As you saw in the previous shortcode, I am using the responsivity extension on scroll mode. It works wonders: thank you very much, it is one of the cleanest designs out there. However, the width that I set on custom CSS only shows up on laptop, and phone devices show random widths for each column. I solve this problem after reading other answers by setting a 350px minimum width. However, I tried a minimum 40% width and it didn’t work. Why does it only work with pixels and not %? I used this very same code, but instead of “350px” at the end, I wrote “40%”.

    .tablepress-id-4 .column-1 {
    	width: 30%;
    }
    
    .tablepress-id-4 .column-2 {
    	width: 15%;
    }
    
    .tablepress-id-4 .column-3 {
    	width: 10%;
    }
    
    .tablepress-id-4 .column-4 {
    	width: 5%;
    }
    
    .tablepress-id-4 .column-5 {
    	width: 40%;
    	min-width: 350px;
    }

    Thanks a lot Tobias, and congratulations for a fantastic FREE plugin (donations apart), better than most PRO versions of any other table plugin.

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

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

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble.

    I’m afraid that your assumption is correct. The merged cells mean that you can not use the JavaScript features of the external DataTables JS library, and this includes the Buttons, which also use that library internally.

    About the column width: A width with a % unit is calculated based on the width of its container element. This usually is the width of the content area as defined by the theme – normally the screen width minus some padding and margin. Therefore, % widths will give totally inconsistent results for tables that are too wide on small screens. The browser simply can’t properly calculate certain things then. That’s why you’ll have to use px values for this.

    Regards,
    Tobias

    Thread Starter ibshans

    (@ibshans)

    Thanks Tobias, that’s too bad. Is there any other option to make this table downloadable in any format? I could try to print it into PDFCreator but it breaks the cell separation. Any readable format would be OK, and if you are out of ideas, that’s also fine. Thank you for your time.

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    I don’t really have an idea for printing this here 🙁 The browser print function might work, but due to the size of the table, it will split it into several pages.
    You could maybe also try exporting it to a CSV file and then re-creating it in Excel (basically the merged cells), and then save as a PDF there.

    Regards,
    Tobias

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Column width on mobile phone and database buttons not showing’ is closed to new replies.