Skip to content

[WP.7.0] Admin UI: Backport accessibility fixes (#77617, #78001) #78002

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
t-hamano wants to merge 2 commits into
base: wp/7.0
Choose a base branch
from
Open

[WP.7.0] Admin UI: Backport accessibility fixes (#77617, #78001) #78002

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3325282
Admin UI: change default heading level from h2 to h1 (#77617)
simison May 6, 2026
243156c
Admin UI: Fix nested landmark in Page header
t-hamano May 6, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions packages/admin-ui/CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,10 @@

## Unreleased

### Breaking Changes

- Change default `headingLevel` for the `Page` component's header from `2` to `1`, meaning from `h2` to `h1`. If you need to keep previous behaviour, use `<Page title="Example" headingLevel={ 2 }>` [#77617](https://github.com/WordPress/gutenberg/pull/77617)

## 1.8.0 (2026-02-18)

### Enhancements
Expand Down
8 changes: 2 additions & 6 deletions packages/admin-ui/src/page/header.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import { Stack } from '@wordpress/ui';
import { SidebarToggleSlot } from './sidebar-toggle-slot';

export default function Header( {
headingLevel = 2,
headingLevel = 1,
breadcrumbs,
badges,
title,
Expand All @@ -27,11 +27,7 @@ export default function Header( {
} ) {
const HeadingTag = `h${ headingLevel }` as const;
return (
<Stack
direction="column"
className="admin-ui-page__header"
render={ <header /> }
>
<Stack direction="column" className="admin-ui-page__header">
<Stack direction="row" justify="space-between" gap="sm">
<Stack direction="row" gap="sm" align="center" justify="start">
{ showSidebarToggle && (
Expand Down
1 change: 1 addition & 0 deletions packages/edit-site/src/components/page-patterns/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -202,6 +202,7 @@ export default function DataviewsPatterns() {
<Page
className="edit-site-page-patterns-dataviews"
title={ title }
headingLevel={ 2 }
subTitle={ description }
actions={
<PatternsActions
Expand Down
1 change: 1 addition & 0 deletions packages/edit-site/src/components/page-templates/index-legacy.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -133,6 +133,7 @@ export default function PageTemplates() {
<Page
className="edit-site-page-templates"
title={ __( 'Templates' ) }
headingLevel={ 2 }
actions={ <AddNewTemplate /> }
>
<DataViews
Expand Down
1 change: 1 addition & 0 deletions packages/edit-site/src/components/page-templates/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -325,6 +325,7 @@ export default function PageTemplates() {
<Page
className="edit-site-page-templates"
title={ __( 'Templates' ) }
headingLevel={ 2 }
actions={ <AddNewTemplate /> }
>
<DataViews
Expand Down
1 change: 1 addition & 0 deletions packages/edit-site/src/components/post-list/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -274,6 +274,7 @@ export default function PostList( { postType } ) {
return (
<Page
title={ labels?.name }
headingLevel={ 2 }
actions={
<>
{ labels?.add_new_item && canCreateRecord && (
Expand Down
1 change: 1 addition & 0 deletions packages/edit-site/src/components/sidebar-global-styles/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,7 @@ export default function SidebarGlobalStyles() {
}
className="edit-site-styles"
title={ __( 'Styles' ) }
headingLevel={ 2 }
>
<GlobalStylesUIWrapper
path={ section }
Expand Down
1 change: 0 additions & 1 deletion routes/connectors-home/stage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,6 @@ function ConnectorsPage() {
return (
<Page
title={ __( 'Connectors' ) }
headingLevel={ 1 }
subTitle={ __(
'All of your API keys and credentials are stored here and shared across plugins. Configure once and use everywhere.'
) }
Expand Down
2 changes: 1 addition & 1 deletion routes/font-list/stage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ function FontLibraryPage() {
}

return (
<Page headingLevel={ 1 } title={ __( 'Fonts' ) }>
<Page title={ __( 'Fonts' ) }>
<Tabs
selectedTabId={ activeTab }
onSelect={ ( tabId: string ) => setActiveTab( tabId ) }
Expand Down
1 change: 1 addition & 0 deletions routes/navigation-edit/stage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ function NavigationEditStage() {

return (
<Page
headingLevel={ 2 }
breadcrumbs={
<Breadcrumbs
items={ [
Expand Down
1 change: 1 addition & 0 deletions routes/navigation-list/stage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -131,6 +131,7 @@ function NavigationList() {
<>
<Page
title={ __( 'Navigation' ) }
headingLevel={ 2 }
className="navigation-page"
hasPadding={ false }
actions={
Expand Down
1 change: 1 addition & 0 deletions routes/pattern-list/stage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -258,6 +258,7 @@ function PatternList() {
return (
<Page
title={ __( 'Patterns' ) }
headingLevel={ 2 }
subTitle={ __(
'Reusable design elements for your site. Create once, use everywhere.'
) }
Expand Down
1 change: 1 addition & 0 deletions routes/post-list/stage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -273,6 +273,7 @@ function PostList() {
return (
<Page
title={ postTypeObject.labels?.name }
headingLevel={ 2 }
subTitle={ postTypeObject.labels?.description }
className={ `${ postTypeObject.name.toLowerCase() }-page` }
actions={
Expand Down
1 change: 1 addition & 0 deletions routes/styles/stage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ function Stage() {

return (
<Page
headingLevel={ 2 }
actions={
! isMobileViewport ? (
<HStack>
Expand Down
1 change: 1 addition & 0 deletions routes/template-part-list/stage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -250,6 +250,7 @@ function TemplatePartList() {
return (
<Page
title={ postTypeObject.labels?.name }
headingLevel={ 2 }
subTitle={ postTypeObject.labels?.description }
className="template-part-page"
actions={
Expand Down
Loading