Skip to content

Move post/page title to the top bar. #27093

@scruffian

Description

@scruffian

Block themes and template editing give authors much more freedom to express how the titles of posts and pages are displayed on the frontend. They might appear inside Cover blocks, adjacent to Post Content, or in any other conceivable block configuration. There are also situations in which a template might not display a post title at all, e.g. Post Formats.

All that to say, it might be time to consider not displaying the post title within the canvas when editing a post or page, because the current implementation is increasingly unlikely to be an accurate representation of the frontend. Example:

Backend Frontend
Screenshot 2022-11-08 at 15 32 03 Screenshot 2022-11-08 at 15 32 19

Clearly it must still be possible to edit the post title without engaging the template editor first. For a solution we can look to the Site Editor, where the document name appears in the Top Bar, and custom templates can be renamed:

Screenshot 2022-11-08 at 14 30 42

We can probably migrate this pattern across to the post editor as well. The result would be something like this:

Screenshot 2022-11-08 at 15 38 43

When the document has no title, the label can probably read something like "Untitled Document".

Original issueI think it makes sense to move the page/post title into the top bar like we do for template names. Often we will want to add the Post title inside another block (e.g. Cover block), or in a column.

This would give users more flexibility about where the Post/Page title appears:

FSE-UX-flow

Originally suggested by @paaljoachim here: #20877 (comment)

Metadata

Metadata

Assignees

No one assigned

    Labels

    Needs Accessibility FeedbackNeed input from accessibilityNeeds DevReady for, and needs developer efforts[Feature] Site EditorRelated to the overarching Site Editor (formerly "full site editing")[Focus] Accessibility (a11y)Changes that impact accessibility and need corresponding review (e.g. markup changes).[Package] Edit Post/packages/edit-post

    Type

    No type

    Projects

    Status

    ✅ Done

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions