diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-main/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-main/index.js index 1aa6f483fdba56..26b01999262d38 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-main/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-main/index.js @@ -31,6 +31,9 @@ export default function SidebarNavigationScreenMain() { { !! navigationMenus && navigationMenus.length > 0 && ( diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-item/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-item/index.js index 69b867e24f141e..549ed42d408a6b 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-item/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-item/index.js @@ -36,6 +36,15 @@ export default function SidebarNavigationScreenNavigationItem() { icon={ pencil } /> } + description={ + postType === 'page' + ? __( + 'Pages are static and are not listed by date. Pages do not use tags or categories.' + ) + : __( + 'Posts are entries listed in reverse chronological order on the site homepage or on the posts page.' + ) + } content={ <> { record?.link ? ( diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/index.js index 39563db05280e2..2584c2e1b26c24 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/index.js @@ -27,16 +27,10 @@ function SidebarNavigationScreenWrapper( { children, actions } ) { -

- { __( - 'Browse your site, edit pages, and manage your primary navigation menu.' - ) } -

- { children } - - } + description={ __( + 'Browse your site, edit pages, and manage your primary navigation menu.' + ) } + content={ children } /> ); } diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/style.scss b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/style.scss index 859a7326edfa8a..1e3812d21b76e9 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/style.scss +++ b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/style.scss @@ -1,4 +1,4 @@ -.edit-site-sidebar-navigation-screen-navigation-menus__description { +.edit-site-sidebar-navigation-screen__description { margin-top: 0; margin-bottom: $grid-unit-40; } diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js index 4d7d471e088fc4..b4d1572c3393c2 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js @@ -1,7 +1,7 @@ /** * WordPress dependencies */ -import { __ } from '@wordpress/i18n'; +import { __, sprintf } from '@wordpress/i18n'; import { useDispatch } from '@wordpress/data'; import { pencil } from '@wordpress/icons'; import { __experimentalUseNavigator as useNavigator } from '@wordpress/components'; @@ -24,10 +24,18 @@ export default function SidebarNavigationScreenTemplate() { postId ); let description = getDescription(); - if ( ! description && record.is_custom ) { - description = __( - 'This is a custom template that can be applied manually to any Post or Page.' - ); + if ( ! description ) { + if ( record.type === 'wp_template' && record.is_custom ) { + description = __( + 'This is a custom template that can be applied manually to any Post or Page.' + ); + } else if ( record.type === 'wp_template_part' ) { + description = sprintf( + // translators: %s: template part title e.g: "Header". + __( 'This is your %s template part.' ), + getTitle() + ); + } } return ( @@ -40,7 +48,7 @@ export default function SidebarNavigationScreenTemplate() { icon={ pencil } /> } - content={ description ?

{ description }

: undefined } + description={ description } /> ); } diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-templates-browse/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-templates-browse/index.js index 3721b61910c5ab..88e71d0b55b1e9 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-templates-browse/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-templates-browse/index.js @@ -12,9 +12,15 @@ import SidebarNavigationScreen from '../sidebar-navigation-screen'; const config = { wp_template: { title: __( 'All templates' ), + description: __( + 'Create new templates, or reset any customizations made to the templates supplied by your theme.' + ), }, wp_template_part: { title: __( 'All template parts' ), + description: __( + 'Create new template parts, or reset any customisations made to the template parts supplied by your theme." seems good.' + ), }, }; @@ -22,5 +28,10 @@ export default function SidebarNavigationScreenTemplatesBrowse() { const { params: { postType }, } = useNavigator(); - return ; + return ( + + ); } diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-templates/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-templates/index.js index 30bfd6aad532f4..1a0ce5e050cb9a 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-templates/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-templates/index.js @@ -29,6 +29,9 @@ const config = { loading: __( 'Loading templates' ), notFound: __( 'No templates found' ), manage: __( 'Manage all templates' ), + description: __( + 'Express the layout of your site with templates.' + ), }, }, wp_template_part: { @@ -37,6 +40,9 @@ const config = { loading: __( 'Loading template parts' ), notFound: __( 'No template parts found' ), manage: __( 'Manage all template parts' ), + description: __( + 'Template Parts are small pieces of a layout that can be reused across multiple templates and always appear the same way. Common template parts include the site header, footer, or sidebar.' + ), }, }, }; @@ -80,6 +86,7 @@ export default function SidebarNavigationScreenTemplates() { { const { getSettings } = unlock( select( editSiteStore ) ); @@ -58,6 +59,11 @@ export default function SidebarNavigationScreen( {