投稿リンクのブロックをつくったときのメモ

ちあき

内部にインナーブロックを含められる投稿リンクのブロックをつくる

ちあき

参考にする実装は read-more ブロック

ちあき

usesContext を使えばどうやら投稿IDはとれる。

ちあき

表示はダイナミックブロックっぽいけど、中身自体は innerBlock を使いたい。
ということでこういうissueを見つける。

どうやら

save: props => {
  return <InnerBlocks.Content />
}

でコンテンツはとれるようだ。あとはレンダー関数で $content を出力すればよさげ

ちあき

参考にしつつrenderの関数書いてたけど、WordPress6.1から render というプロパティが追加されてるのを教えてもらった！

ちあき

<?php
/**
 * Server-side rendering.
 *
 * @var array    $attributes The block attributes.
 * @var string   $content The block content.
 * @var WP_Block $block The block object.
 *
 * @package My_Theme\Blocks
 */

?>

<?php if ( ! empty( $block->context['postId'] ) ) : ?>
	<a
		<?php
		echo get_block_wrapper_attributes(
			array(
				'href'   => get_the_permalink( $block->context['postId'] ),
				'target' => esc_attr( $attributes['linkTarget'] ),
			)
		);
		?>
	>
		<?php
		// インナーブロックのaタグをspanタグに置き換える
		$block_content = str_replace( array( '<a', '</a>' ), array( '<span', '</span>' ), $content );
		echo do_blocks( wp_kses_post( $block_content ) );
		?>
	</a>
<?php endif; ?>

ちあき

phpでごにょごにょ…ごにょ…って書かなくていいのがすごくいい。