Page Title

<h1 class="page-title">Page Title</h1>

Since this is the single h1 element on the page, use the .visually-hidden class to hide it when needed.

This will preserve the heading structure for screen readers vs removing the block from the page.

Exclude Node Title can be used to apply this, using the patch in this issue: https://www.drupal.org/project/exclude_node_title/issues/3521383

 

Page titles sometimes have inline elements, but they are all different patterns.

When editing media, the title is in an <em>.

<h1 class="page-title">Edit <em class="placeholder">Media Type</em> Media Label</h1>

Here is the media type.

<h1 class="page-title">Edit <em class="placeholder">Document</em></h1>

Here is the page content type.

<h1 class="page-title">Edit <em class="placeholder">Page</em> content type</h1>

Here is an individual page.

<h1 class="page-title"><em>Edit Page</em> Home</h1>

 

TODO: Add a class for entity edit forms and only set display block on <em> there.

Mantra theme page title em differences