Preview vs. Actual Page

Hi,

thanks for your post, and sorry for the trouble.

As mentioned in the Preview popup, the theme CSS highly influences the final layout on the page. In your case, it seems that your theme is even turning off the loading of the TablePress CSS files. To verify that, please check the styling again after temporarily deactivating all other plugins.

Then, for some approaches to make big tables responsive on small screens, you could also take a look at https://tablepress.org/extensions/responsive-tables/

Regards,
Tobias

Tobias-
I switched to 3 other default WP themes and they look no better. Is there a default theme you know should be compatible?

I have also tried turning off the other plug-ins…no change in appearance.
I would like it to be close to preview which looks good.

Hi,

can you maybe specifically describe what you want to change how? We can the apply CSS code. For some examples, you can also already check https://tablepress.org/faq

Regards,
Tobias

Hi Tobias-
I mainly want to center all the text and increase the column widths slightly.
https://pembrokeinstruments.com/test-table-page/

Thanks
-Leslie

Does custom CSS code have to be manually inserted in the area the theme (Impreza) designates?

Hi,

to center the table content and to increase the width, you can add this to the “Custom CSS” textarea on the “Plugin Options” screen of TablePress:

.tablepress-id-2 th,
.tablepress-id-2 td {
  text-align: center;
  min-width: 200px;
}

You could also add this to the theme’s “Custom CSS” text area, but I normally recommend to use the TablePress “Custom CSS” field for this.

Now, the table will then likely be too wide on small screens, so that you’ll need to add an approach for responsiveness, e.g. by using https://tablepress.org/extensions/responsive-tables/

Regards,
Tobias

Have a look
https://pembrokeinstruments.com/test-table-page/

Things only improved when I inserted the CSS in the Impreza theme CSS code area.
It still needs a little tweaking. I have to zoom to 50% to see whole table.

Please advise. Thanks.

I would like to make a donation. Can you accept credit card? (Can’t be paypal)

Hi,

indeed, your theme seems to be influencing the CSS loading of TablePress. That’s also the reason why it looked so different to the preview, and why you need to use the Impreza theme CSS code area (that’s ok though).

Making the full table visible at once will not really possible, due to the large number of columns. You would then either have to reduce the column widths or reduce the font size. I therefore recommend looking into the mentioned approaches from the TablePress Extension.

And yes, donations via credit card are possible, via https://www.buymeacoffee.com/TablePress

Regards,
Tobias

Hi Tobias-

The text in all rows are not centered
See https://pembrokeinstruments.com/test-table-page/
Please advise any CSS to resolve.
Thanks for your help.
-Leslie

Tobias-
I resolved text centering issue.

One last issue: Does your plugin impact page load speed and are there any plugin settings to avoid. See below from Google Page Speed test result

DiagnosticsMore information about the performance of your application. These numbers don’t directly affect the Performance score.
Reduce the impact of third-party code Third-party code blocked the main thread for 370 ms.

Hi,

good to hear that the centering works now!

Regarding performance: No, I don’t expect issues here. TablePress only adds HTML code for a table on your site, which is not different to manually adding it. As you are not using time-consuming JavaScript operations, page loading speed should not be affected.

Best wishes,
Tobias