diff --git a/packages/edit-post/src/components/sidebar/settings-header/index.js b/packages/edit-post/src/components/sidebar/settings-header/index.js
index b614ec0ebaf10..3f5a03ad90134 100644
--- a/packages/edit-post/src/components/sidebar/settings-header/index.js
+++ b/packages/edit-post/src/components/sidebar/settings-header/index.js
@@ -16,18 +16,20 @@ const SettingsHeader = ( { sidebarName } ) => {
openGeneralSidebar( 'edit-post/document' );
const openBlockSettings = () => openGeneralSidebar( 'edit-post/block' );
- const documentLabel = useSelect( ( select ) => {
+ const { documentLabel, isTemplateMode } = useSelect( ( select ) => {
const currentPostType = select( 'core/editor' ).getCurrentPostType();
const postType = select( 'core' ).getPostType( currentPostType );
- return (
- // Disable reason: Post type labels object is shaped like this.
- // eslint-disable-next-line camelcase
- postType?.labels?.singular_name ??
- // translators: Default label for the Document sidebar tab, not selected.
- __( 'Document' )
- );
- } );
+ return {
+ documentLabel:
+ // Disable reason: Post type labels object is shaped like this.
+ // eslint-disable-next-line camelcase
+ postType?.labels?.singular_name ??
+ // translators: Default label for the Document sidebar tab, not selected.
+ __( 'Document' ),
+ isTemplateMode: select( editPostStore ).isEditingTemplate(),
+ };
+ }, [] );
const [ documentAriaLabel, documentActiveClass ] =
sidebarName === 'edit-post/document'
@@ -42,19 +44,38 @@ const SettingsHeader = ( { sidebarName } ) => {
: // translators: ARIA label for the Block Settings Sidebar tab, not selected.
[ __( 'Block' ), '' ];
+ const [ templateAriaLabel, templateActiveClass ] =
+ sidebarName === 'edit-post/document'
+ ? [ __( 'Template (selected)' ), 'is-active' ]
+ : [ __( 'Template' ), '' ];
+
/* Use a list so screen readers will announce how many tabs there are. */
return (
- -
-
-
+ { ! isTemplateMode && (
+ -
+
+
+ ) }
+ { isTemplateMode && (
+ -
+
+
+ ) }
-