Static Table Header?

Hi,

thanks for your question.

For this, you can use the TablePress DataTables FixedHeader Extension from https://tablepress.org/extensions/datatables-fixedheader/
That will fix the table head at the top of the page during scrolling.

However, this solution does only support one head row. Multiple head rows are not supported by TablePress as of now though, sorry.

Regards,
Tobias

Hi Tobias,

Thanks a lot!

Will this plugin allow me to set a static header even if I have unchecked the “Make first row the header of this table” option?

Hi,

no, this Extension requires that checkbox to be checked, as it can only transform that header row into a fixed header.

Regards,
Tobias

hi Tobias,

Thanks, I installed the plugin and it generally works fine, however I’m facing one strange issue; basically when the FixedHeader plugin is activated, it seems like the top row (the header) is getting duplicated, with one row going over the other. So basically for some reason there are TWO header rows, with one covering the upper half of the other. When I disable the FixedHeader plugin (or change the table shortcut back to [table id=1 /]) everything goes back to normal.

Have you experienced anything similar in the past?

Hi,

that is correct, and it’s the intended behavior. Basically, this has technical reason, as a sticky header is only possible by duplicating the actual header. However, this should be invisible to the user, as they should be right on top of each other. As you can see them, this means that there’s some CSS not being picked up by the copy. We should be able to fix this with some “Custom CSS”. To find that, I’d need to see this though, so please post a link to the page with the table where this happens.

Regards,
Tobias

Hi Tobias,

Thanks – here’s a link. It’s shortened and set to expire within 50 minutes from now as I do not want the website to remain live, hope that’s OK:

https://temporaryurl.scripteen.com/ah

Hi,

thanks for the link!

Please try adding this to the “Custom CSS” textarea on the “Plugin Options” screen of TablePress:

.tablepress thead th,
.tablepress tfoot th {
  line-height: normal;
}

Regards,
Tobias

Oh and in case it helps, here is my Custom CSS for the table:

[CSS moderated. All that is needed is a link to your site.]

Hi,

no, no need to post your “Custom CSS” here, I can see that in the page ??

Regards,
Tobias

Man, you rock!!! the problem is immediately fixed ??

Thanks a lot!!

Hi again,

in fact, please combine everything that starts with

.tablepress thead th,
.tablepress tfoot th {

into one block:

.tablepress thead th,
.tablepress tfoot th {
  text-align: center;
  vertical-align: text-top;
  background-color: white;
  line-height: normal;
}

Regards,
Tobias

Made a tiny Donation as an expression of my appreciation. Keep it up man!

Done!

Thank you again ??

Hi,

great to hear that this helped! ??
And thanks for the donation!

Best wishes,
Tobias

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

Well it’s hard to give it anything less than five stars to be honest ??