Heavily improved in TablePress 2.4!
Fix the header and footer row and the first and last column when scrolling the table.
This feature module is part of the TablePress Premium plans.
The module can fix a table’s head row to the top of the screen, when the user scrolls through a long table on a page. With this, the column titles will always be visible, so that the user always knows what information the columns in a table contain.
Likewise, it can fix a table’s foot row to the bottom of the screen, or columns on the left or right side of the screen, for wide columns.
Possibilities for Fixed Rows and Columns
The module allows fixing rows and columns in various ways:
Fixed Head Row and Fixed Left Column
Here’s an example where the table’s head row will stick to the top of the screen, when scrolling down, and where the first column will stick to the left edge, when scrolling sideways:
Last Name | First Name | Birthday | Company | Phone (Ext.) | ZIP code | Country | Balance | Points | Rating |
---|---|---|---|---|---|---|---|---|---|
Banks | Travis | 05/04/1969 | Apple | 200-4324 | 64655 | Italy | $61.17 | 8 | 6.6 |
Cain | Lawrence | 05/16/1994 | IBM | 701-3108 | 98004 | United States | $54.81 | 5 | 2.5 |
Middleton | Dennis | 01/10/1992 | 580-9501 | 80913 | Spain | $24.83 | 4 | 5.2 | |
Valenzuela | Lunea | 01/09/1966 | Cisco | 970-8655 | 51606 | Germany | $74.07 | 7 | 3.7 |
Burgess | Quynn | 09/24/1988 | Mozilla | 430-8943 | 78965 | France | $16.13 | 8 | 2.9 |
Lott | Lillith | 12/10/1978 | Dell | 587-2289 | 88178 | Australia | $30.12 | 1 | 7.9 |
Freeman | Cheyenne | 01/28/1981 | LG | 396-5473 | 14711 | Germany | $49.82 | 1 | 6.0 |
Houston | Jorden | 05/03/1978 | Adobe | 970-1182 | 96036 | Canada | $47.31 | 2 | 1.5 |
Harris | Merritt | 12/29/1989 | Apple | 160-5977 | 25178 | United States | $77.33 | 6 | 0.1 |
Gregory | Brynn | 01/13/1994 | Adobe | 663-6039 | 91558 | Spain | $90.24 | 9 | 8.2 |
Curry | Mason | 03/15/1969 | Sony | 115-4778 | 87513 | Australia | $21.68 | 5 | 6.6 |
Holland | Alyssa | 06/25/1976 | Xerox | 704-4977 | 97921 | Canada | $50.31 | 7 | 9.5 |
Logan | Shay | 09/13/1968 | IBM | 687-6482 | 03023 | United States | $46.39 | 8 | 7.6 |
Moran | August | 07/04/1986 | Cisco | 651-1214 | 60737 | India | $22.64 | 1 | 7.5 |
Vasquez | Kelsey | 03/31/1968 | Samsung | 470-7358 | 79655 | Germany | $84.05 | 3 | 4.5 |
Stein | Lawrence | 10/15/1960 | Toshiba | 929-5407 | 36044 | Italy | $77.11 | 2 | 8.6 |
Battle | Wylie | 01/03/1988 | 368-2276 | 37585 | Australia | $46.37 | 10 | 2.8 | |
Booker | Logan | 12/16/1975 | Apple | 830-5701 | 22074 | United States | $40.71 | 1 | 9.0 |
Gilbert | Chaney | 06/06/1970 | Sony | 132-5560 | 89630 | Canada | $78.45 | 9 | 1.2 |
Buckley | Stone | 09/11/1980 | Cisco | 422-7998 | 74057 | United States | $30.01 | 2 | 7.9 |
When using fixed columns, it is also possible to show left/right arrow buttons on the left and right sides of the table, to indicate that a table can be scrolled horizontally, in addition to swiping. And the cool thing: These buttons are only shown when a table can be scrolled horizontally. And then, they stick to the page so that they are always visible, which makes them very helpful for long tables.
Last Name | First Name | Birthday | Company | Phone (Ext.) | ZIP code | Country | Balance | Points | Rating |
---|---|---|---|---|---|---|---|---|---|
Banks | Travis | 05/04/1969 | Apple | 200-4324 | 64655 | Italy | $61.17 | 8 | 6.6 |
Cain | Lawrence | 05/16/1994 | IBM | 701-3108 | 98004 | United States | $54.81 | 5 | 2.5 |
Middleton | Dennis | 01/10/1992 | 580-9501 | 80913 | Spain | $24.83 | 4 | 5.2 | |
Valenzuela | Lunea | 01/09/1966 | Cisco | 970-8655 | 51606 | Germany | $74.07 | 7 | 3.7 |
Burgess | Quynn | 09/24/1988 | Mozilla | 430-8943 | 78965 | France | $16.13 | 8 | 2.9 |
Lott | Lillith | 12/10/1978 | Dell | 587-2289 | 88178 | Australia | $30.12 | 1 | 7.9 |
Freeman | Cheyenne | 01/28/1981 | LG | 396-5473 | 14711 | Germany | $49.82 | 1 | 6.0 |
Houston | Jorden | 05/03/1978 | Adobe | 970-1182 | 96036 | Canada | $47.31 | 2 | 1.5 |
Harris | Merritt | 12/29/1989 | Apple | 160-5977 | 25178 | United States | $77.33 | 6 | 0.1 |
Gregory | Brynn | 01/13/1994 | Adobe | 663-6039 | 91558 | Spain | $90.24 | 9 | 8.2 |
Curry | Mason | 03/15/1969 | Sony | 115-4778 | 87513 | Australia | $21.68 | 5 | 6.6 |
Holland | Alyssa | 06/25/1976 | Xerox | 704-4977 | 97921 | Canada | $50.31 | 7 | 9.5 |
Logan | Shay | 09/13/1968 | IBM | 687-6482 | 03023 | United States | $46.39 | 8 | 7.6 |
Moran | August | 07/04/1986 | Cisco | 651-1214 | 60737 | India | $22.64 | 1 | 7.5 |
Vasquez | Kelsey | 03/31/1968 | Samsung | 470-7358 | 79655 | Germany | $84.05 | 3 | 4.5 |
Stein | Lawrence | 10/15/1960 | Toshiba | 929-5407 | 36044 | Italy | $77.11 | 2 | 8.6 |
Battle | Wylie | 01/03/1988 | 368-2276 | 37585 | Australia | $46.37 | 10 | 2.8 | |
Booker | Logan | 12/16/1975 | Apple | 830-5701 | 22074 | United States | $40.71 | 1 | 9.0 |
Gilbert | Chaney | 06/06/1970 | Sony | 132-5560 | 89630 | Canada | $78.45 | 9 | 1.2 |
Buckley | Stone | 09/11/1980 | Cisco | 422-7998 | 74057 | United States | $30.01 | 2 | 7.9 |
Adding an Offset
As many sites and themes use a fixed navigation bar at the top of the screen, fixing the table head row directly to the top of the screen might not be desired, as they would overlap. For this, it is possible to add an offset to the fixed head row, so that it is fixed below the site’s fixed navigation bar. That offset is the number of pixels that the fixed table head row shall be shifted down. This number has to be set to the height of the site’s fixed navigation bar in pixels.
Last Name | First Name | Birthday | Company | Phone (Ext.) | ZIP code | Country | Balance | Points | Rating |
---|---|---|---|---|---|---|---|---|---|
Banks | Travis | 05/04/1969 | Apple | 200-4324 | 64655 | Italy | $61.17 | 8 | 6.6 |
Cain | Lawrence | 05/16/1994 | IBM | 701-3108 | 98004 | United States | $54.81 | 5 | 2.5 |
Middleton | Dennis | 01/10/1992 | 580-9501 | 80913 | Spain | $24.83 | 4 | 5.2 | |
Valenzuela | Lunea | 01/09/1966 | Cisco | 970-8655 | 51606 | Germany | $74.07 | 7 | 3.7 |
Burgess | Quynn | 09/24/1988 | Mozilla | 430-8943 | 78965 | France | $16.13 | 8 | 2.9 |
Lott | Lillith | 12/10/1978 | Dell | 587-2289 | 88178 | Australia | $30.12 | 1 | 7.9 |
Freeman | Cheyenne | 01/28/1981 | LG | 396-5473 | 14711 | Germany | $49.82 | 1 | 6.0 |
Houston | Jorden | 05/03/1978 | Adobe | 970-1182 | 96036 | Canada | $47.31 | 2 | 1.5 |
Harris | Merritt | 12/29/1989 | Apple | 160-5977 | 25178 | United States | $77.33 | 6 | 0.1 |
Gregory | Brynn | 01/13/1994 | Adobe | 663-6039 | 91558 | Spain | $90.24 | 9 | 8.2 |
Curry | Mason | 03/15/1969 | Sony | 115-4778 | 87513 | Australia | $21.68 | 5 | 6.6 |
Holland | Alyssa | 06/25/1976 | Xerox | 704-4977 | 97921 | Canada | $50.31 | 7 | 9.5 |
Logan | Shay | 09/13/1968 | IBM | 687-6482 | 03023 | United States | $46.39 | 8 | 7.6 |
Moran | August | 07/04/1986 | Cisco | 651-1214 | 60737 | India | $22.64 | 1 | 7.5 |
Vasquez | Kelsey | 03/31/1968 | Samsung | 470-7358 | 79655 | Germany | $84.05 | 3 | 4.5 |
Stein | Lawrence | 10/15/1960 | Toshiba | 929-5407 | 36044 | Italy | $77.11 | 2 | 8.6 |
Battle | Wylie | 01/03/1988 | 368-2276 | 37585 | Australia | $46.37 | 10 | 2.8 | |
Booker | Logan | 12/16/1975 | Apple | 830-5701 | 22074 | United States | $40.71 | 1 | 9.0 |
Gilbert | Chaney | 06/06/1970 | Sony | 132-5560 | 89630 | Canada | $78.45 | 9 | 1.2 |
Buckley | Stone | 09/11/1980 | Cisco | 422-7998 | 74057 | United States | $30.01 | 2 | 7.9 |
Usage instructions
To use these features with your tables, activate the “Fixed Rows and Fixed Columns” feature module on the “Modules” screen of TablePress Pro or TablePress Max. Then, configure the desired options in the “Fixed Rows and Fixed Columns” section on the table’s “Edit” screen.
Configuration parameters
To configure this module’s features, you can also use these configuration parameters in the “TablePress Table” block or in the Shortcode that you are using to embed the table:
Module | Slug | Configuration parameter | Name | Description | Type | Default value | |
---|---|---|---|---|---|---|---|
Fixed Columns | datatables-fixedheader-fixedcolumns | datatables_fixedcolumns | string | "" (empty string) |
|||
Fixed Columns | datatables-fixedheader-fixedcolumns | datatables_fixedcolumns_left_columns | integer | 0 |
|||
Fixed Columns | datatables-fixedheader-fixedcolumns | datatables_fixedcolumns_right_columns | integer | 0 |
|||
Fixed Columns | datatables-fixedheader-fixedcolumns | datatables_scrollx_buttons | boolean (true or false ) | false |
|||
Fixed Rows | datatables-fixedheader-fixedcolumns | datatables_fixedheader | string | "" (empty string) |
|||
Fixed Rows | datatables-fixedheader-fixedcolumns | datatables_fixedheader_offsettop | integer | 0 |
On this page