diff --git a/packages/block-library/src/post-terms/block.json b/packages/block-library/src/post-terms/block.json
index 1f9f61738eb59..a79af6ef85539 100644
--- a/packages/block-library/src/post-terms/block.json
+++ b/packages/block-library/src/post-terms/block.json
@@ -11,6 +11,10 @@
},
"textAlign": {
"type": "string"
+ },
+ "separator": {
+ "type": "string",
+ "default": ", "
}
},
"usesContext": [ "postId", "postType" ],
@@ -24,5 +28,6 @@
"lineHeight": true,
"fontSize": true
}
- }
+ },
+ "style": "wp-block-post-terms"
}
diff --git a/packages/block-library/src/post-terms/edit.js b/packages/block-library/src/post-terms/edit.js
index 15b981bf69af6..4a939e2af579c 100644
--- a/packages/block-library/src/post-terms/edit.js
+++ b/packages/block-library/src/post-terms/edit.js
@@ -8,11 +8,12 @@ import classnames from 'classnames';
*/
import {
AlignmentToolbar,
+ InspectorAdvancedControls,
BlockControls,
Warning,
useBlockProps,
} from '@wordpress/block-editor';
-import { Spinner } from '@wordpress/components';
+import { Spinner, TextControl } from '@wordpress/components';
import { useSelect } from '@wordpress/data';
import { __ } from '@wordpress/i18n';
import { store as coreStore } from '@wordpress/core-data';
@@ -27,7 +28,7 @@ export default function PostTermsEdit( {
context,
setAttributes,
} ) {
- const { term, textAlign } = attributes;
+ const { term, textAlign, separator } = attributes;
const { postId, postType } = context;
const selectedTerm = useSelect(
@@ -78,6 +79,17 @@ export default function PostTermsEdit( {
} }
/>
+
+ {
+ setAttributes( { separator: nextValue } );
+ } }
+ help={ __( 'Enter character(s) used to separate terms.' ) }
+ />
+
{ isLoading &&
}
{ ! isLoading &&
@@ -92,7 +104,15 @@ export default function PostTermsEdit( {
{ postTerm.name }
) )
- .reduce( ( prev, curr ) => [ prev, ' | ', curr ] ) }
+ .reduce( ( prev, curr ) => (
+ <>
+ { prev }
+
+ { separator || ' ' }
+
+ { curr }
+ >
+ ) ) }
{ ! isLoading &&
! hasPostTerms &&
( selectedTerm?.labels?.no_terms ||
diff --git a/packages/block-library/src/post-terms/index.php b/packages/block-library/src/post-terms/index.php
index 436611d756704..2573c4f0fba4b 100644
--- a/packages/block-library/src/post-terms/index.php
+++ b/packages/block-library/src/post-terms/index.php
@@ -23,10 +23,7 @@ function render_block_core_post_terms( $attributes, $content, $block ) {
}
$post_terms = get_the_terms( $block->context['postId'], $attributes['term'] );
- if ( is_wp_error( $post_terms ) ) {
- return '';
- }
- if ( empty( $post_terms ) ) {
+ if ( is_wp_error( $post_terms ) || empty( $post_terms ) ) {
return '';
}
@@ -35,21 +32,16 @@ function render_block_core_post_terms( $attributes, $content, $block ) {
$classes .= ' has-text-align-' . $attributes['textAlign'];
}
- $terms_links = '';
- foreach ( $post_terms as $term ) {
- $terms_links .= sprintf(
- '
%2$s | ',
- get_term_link( $term->term_id ),
- esc_html( $term->name )
- );
- }
- $terms_links = trim( $terms_links, ' | ' );
+ $separator = empty( $attributes['separator'] ) ? ' ' : $attributes['separator'];
+
$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => $classes ) );
- return sprintf(
- '
%2$s
',
- $wrapper_attributes,
- $terms_links
+ return get_the_term_list(
+ $block->context['postId'],
+ $attributes['term'],
+ "
",
+ '' . $separator . '',
+ '
'
);
}
diff --git a/packages/block-library/src/post-terms/style.scss b/packages/block-library/src/post-terms/style.scss
new file mode 100644
index 0000000000000..e447f1fd6b60d
--- /dev/null
+++ b/packages/block-library/src/post-terms/style.scss
@@ -0,0 +1,3 @@
+.wp-block-post-terms__separator {
+ white-space: pre-wrap;
+}
diff --git a/packages/block-library/src/style.scss b/packages/block-library/src/style.scss
index 92e10a3dee23a..c475eab47f5dc 100644
--- a/packages/block-library/src/style.scss
+++ b/packages/block-library/src/style.scss
@@ -31,6 +31,7 @@
@import "./post-comments/style.scss";
@import "./post-comments-form/style.scss";
@import "./post-excerpt/style.scss";
+@import "./post-terms/style.scss";
@import "./post-title/style.scss";
@import "./preformatted/style.scss";
@import "./pullquote/style.scss";
diff --git a/packages/e2e-tests/fixtures/blocks/core__post-terms.json b/packages/e2e-tests/fixtures/blocks/core__post-terms.json
index 18f7983b7b80a..34cd4804b0160 100644
--- a/packages/e2e-tests/fixtures/blocks/core__post-terms.json
+++ b/packages/e2e-tests/fixtures/blocks/core__post-terms.json
@@ -3,7 +3,9 @@
"clientId": "_clientId_0",
"name": "core/post-terms",
"isValid": true,
- "attributes": {},
+ "attributes": {
+ "separator": ", "
+ },
"innerBlocks": [],
"originalContent": ""
}