Add support "HTML Element" to Site Tagline

docs/reference-guides/core-blocks.md

@@ -847,7 +847,7 @@ Describe in a few words what the site is about. The tagline can be used in searc
 -	**Name:** core/site-tagline
 -	**Category:** theme
 -	**Supports:** align (full, wide), color (background, gradients, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
--	**Attributes:** textAlign
+-	**Attributes:** tagName, textAlign
 
 ## Site Title
 

packages/block-library/src/site-tagline/block.json

@@ -10,6 +10,10 @@
 	"attributes": {
 		"textAlign": {
 			"type": "string"
+		},
+		"tagName": {
+			"type": "string",
+			"default": "p"
 		}
 	},
 	"example": {},

packages/block-library/src/site-tagline/edit.js

@@ -12,17 +12,19 @@ import {
 	AlignmentControl,
 	useBlockProps,
 	BlockControls,
+	InspectorControls,
 	RichText,
 } from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
 import { createBlock, getDefaultBlockName } from '@wordpress/blocks';
+import { SelectControl } from '@wordpress/components';
 
 export default function SiteTaglineEdit( {
 	attributes,
 	setAttributes,
 	insertBlocksAfter,
 } ) {
-	const { textAlign } = attributes;
+	const { textAlign, tagName: TagName } = attributes;
 	const { canUserEdit, tagline } = useSelect( ( select ) => {
 		const { canUser, getEntityRecord, getEditedEntityRecord } =
 			select( coreStore );
@@ -58,7 +60,7 @@ export default function SiteTaglineEdit( {
 			onChange={ setTagline }
 			aria-label={ __( 'Site tagline text' ) }
 			placeholder={ __( 'Write site tagline…' ) }
-			tagName="p"
+			tagName={ TagName }
 			value={ tagline }
 			disableLineBreaks
 			__unstableOnSplitAtEnd={ () =>
@@ -67,10 +69,30 @@ export default function SiteTaglineEdit( {
 			{ ...blockProps }
 		/>
 	) : (
-		<p { ...blockProps }>{ tagline || __( 'Site Tagline placeholder' ) }</p>
+		<TagName { ...blockProps }>
+			{ tagline || __( 'Site Tagline placeholder' ) }
+		</TagName>
 	);
 	return (
 		<>
+			<InspectorControls group="advanced">
+				<SelectControl
+					label={ __( 'HTML element' ) }
+					options={ [
+						{ label: __( 'Default (<p>)' ), value: 'p' },
+						{ label: '<h1>', value: 'h1' },
+						{ label: '<h2>', value: 'h2' },
+						{ label: '<h3>', value: 'h3' },
+						{ label: '<h4>', value: 'h4' },
+						{ label: '<h5>', value: 'h5' },
+						{ label: '<h6>', value: 'h6' },
+					] }
+					value={ TagName }
+					onChange={ ( newTagName ) =>
+						setAttributes( { tagName: newTagName } )
+					}
+				/>
+			</InspectorControls>
 			<BlockControls group="block">
 				<AlignmentControl
 					onChange={ ( newAlign ) =>

packages/block-library/src/site-tagline/index.php

@@ -17,11 +17,13 @@ function render_block_core_site_tagline( $attributes ) {
 	if ( ! $site_tagline ) {
 		return;
 	}
+	$tag_name           = empty( $attributes['tagName'] ) ? 'p' : $attributes['tagName'];
 	$align_class_name   = empty( $attributes['textAlign'] ) ? '' : "has-text-align-{$attributes['textAlign']}";
 	$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => $align_class_name ) );
 
 	return sprintf(
-		'<p %1$s>%2$s</p>',
+		'<%1$s %2$s>%3$s</%1$s>',
+		$tag_name,
 		$wrapper_attributes,
 		$site_tagline
 	);
@@ -38,4 +40,5 @@ function register_block_core_site_tagline() {
 		)
 	);
 }
+
 add_action( 'init', 'register_block_core_site_tagline' );

test/integration/fixtures/blocks/core__site-tagline.json

@@ -2,7 +2,9 @@
 	{
 		"name": "core/site-tagline",
 		"isValid": true,
-		"attributes": {},
+		"attributes": {
+			"tagName": "p"
+		},
 		"innerBlocks": []
 	}
 ]