{"id":124832,"date":"2026-08-03T15:27:57","date_gmt":"2026-08-03T15:27:57","guid":{"rendered":"https:\/\/make.wordpress.org\/core\/?p=124832"},"modified":"2026-08-03T15:27:57","modified_gmt":"2026-08-03T15:27:57","slug":"post-list-tables-row-headers-changed","status":"publish","type":"post","link":"https:\/\/make.wordpress.org\/core\/2026\/08\/03\/post-list-tables-row-headers-changed\/","title":{"rendered":"Post list tables row headers changed"},"content":{"rendered":"

The column used as the primary list table th<\/code> with scope=\"row\"<\/code> was moved from the first column, containing the selection checkbox, to the second column, containing the post title and row actions in #32892<\/a>.<\/p>\n\n\n\n

This change significantly improves accessibilityAccessibility<\/span> Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both \u201cdirect access\u201d (i.e. unassisted) and \u201cindirect access\u201d meaning compatibility with a person\u2019s assistive technology (for example, computer screen readers). (https:\/\/en.wikipedia.org\/wiki\/Accessibility)<\/span><\/span><\/span> for post list tables by ensuring that the naming used for screen readers to identify the current row refers consistently to the name of the relevant post, rather than referring to a selection checkbox that may not be present if the post is not currently available for editing.<\/p>\n\n\n\n

This is expected to have an impact on extenders who assign custom styles or use JavaScriptJavaScript<\/span> JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user\u2019s browser.\rhttps:\/\/www.javascript.com<\/a><\/span><\/span><\/span> to register events using the th.check-column<\/code> selector or similar selectors that expect a checkbox inside the th<\/code> in a posts row.<\/p>\n\n\n\n

This is also potentially going to impact extenders who target row actions or post titles with the expectation they are inside a td<\/code>.<\/p>\n\n\n\n

Additionally, the CSSCSS<\/span> Cascading Style Sheets.<\/span><\/span><\/span> for collapsed table cells in the responsive view port has been updated to use flex<\/code> layout.<\/p>\n\n\n\n

What you may need to change<\/h2>\n\n\n\n

CSS and JSJS<\/span> JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors.<\/span><\/span><\/span> selectors targeting check columns should look for selectors targeting th.check-column<\/code> or th input[type=\"checkbox\"]<\/code>.<\/p>\n\n\n\n

CSS and JS selectors targeting titles or row actions should look for selectors targeting td.title<\/code>, td.column-title<\/code>, td.page-title<\/code>, td.column-primary<\/code>, td .row-title<\/code>, td .post-state<\/code>, td .row-actions<\/code>, or other similar selection patterns.<\/p>\n\n\n\n

Retaining both td<\/code> and th<\/code> selectors will support retaining compatibility with versions of WordPress prior to 7.1.<\/p>\n\n\n\n

Before and After<\/h2>\n\n\n\n

Code Before Change<\/h3>\n\n\n\n
<tr>\n  <th scope=\"row\" class=\"check-column\">\n    <input type=\"checkbox\" name=\"post[]\" value=\"123\">\n  <\/th>\n  <td class=\"title column-title column-primary page-title\">\n    <a class=\"row-title\" href=\"...\">Hello world!<\/a>\n  <\/td>\n  <td class=\"author column-author\">admin<\/td>\n<\/tr><\/code><\/pre>\n\n\n\n
The th<\/code> is in the first column, followed by a td<\/code> with the column title.<\/p>\n\n\n\n
Code After Change<\/h3>\n\n\n\n
<tr>\n  <td class=\"check-column\">\n    <input type=\"checkbox\" name=\"post[]\" value=\"123\">\n  <\/td>\n  <th scope=\"row\" class=\"title column-title column-primary page-title\" aria-label=\"Hello world!\">\n    <a class=\"row-title\" href=\"...\">Hello world!<\/a>\n  <\/th>\n  <td class=\"author column-author\">admin<\/td>\n<\/tr><\/code><\/pre>\n\n\n\n
The th<\/code> is in the second column, with an aria-label<\/code> containing the post title. The check-column<\/code> is now a td<\/code>.<\/p>\n\n\n\n
Reviewed by <\/em>@<\/span>wildworks<\/a>.<\/p>\n
#<\/span>7-1<\/a>, #<\/span>dev-notes<\/a>, #<\/span>dev-notes-7-1<\/a><\/p>