WordPress のブロックエディタ Guteberg で説明リスト(dl, dt, dd)を使用するために、以前から WP-Yomigana プラグインを利用していましたが、このプラグインで dt や dd タグを追加するための操作が不可解になってきたので、Simple Definition List Blocks プラグインに入れ替えました。

元々 WP-Yomigana は、ブロックエディタが登場するずっと前から TinyMCE のプラグインとして利用していたもので、本来は ruby タグを挿入するボタンを追加することが目的のプラグインですが、付随機能として注釈(small)、引用(q)、引用元(cite)、そして定義リスト※1(dl, dt, dd)を入力するボタンも追加できるようになっており、この定義リストの機能のみを使っていたのでした。

ブロックエディタが登場して WP-Yomigana もこれに対応し、ツールバーのプルダウンにルビや注釈などのボタンが追加されたほか、「定義リスト」ブロックも追加され、しばらくは説明リストを挿入するために便利に使っていたのですが、いつの頃からか、いちいち親(dl)ブロックを選択しなければ dt や dd タグを挿入できなくなりました。そもそも3年以上アップデートされていませんし。これは非常に煩わしいので、別の説明リストが使えるプラグインを探し、Simple Definition List Blocks に乗り換えることにしたのです。

新たに作成する投稿や固定ページについては Simple Definition List Blocks で追加された「definition list」ブロックを使えばよいのですが、これまでの投稿や固定ページについては、WP-Yomigana の「定義リスト」ブロックを使用できないようにすると、WP-Yomigana で書いた説明リストの部分が編集ができなくなります。

そこで、Simple Definition List Blocks で編集できるようにするために、WP-Yomigana で挿入されたタグを Simple Definition List Blocks のタグに置き換える必要があります。置き換えるタグは以下の通りです。

変更前(WP-Yomigana)変更後(Simple Definition List Blocks)
wp:wp-yomigana/dlwp:simple-definition-list-blocks/list
wp:wp-yomigana/termwp:simple-definition-list-blocks/term
wp:wp-yomigana/descriptionwp:simple-definition-list-blocks/details
wp-block-wp-yomigana-dlwp-block-simple-definition-list-blocks-list
wp-block-wp-yomigana-termwp-block-simple-definition-list-blocks-term
wp-block-wp-yomigana-descriptionwp-block-simple-definition-list-blocks-details

データベースのバックアップをとってから、これらを Better Search Replace プラグインを使って一括置換しました。これで WP-Yomigana で書いた説明リストが Simple Definition List Blocks のタグに置き換えられ、編集が可能となります。

この Simple Definition List Blocks、単に dl, dt, dd タグを挿入できるだけでなく、dd タグ内に他のブロック(html 要素)を含めることができたり、dl 直下に div タグを挿入※2することもできます。

ただ、ビジュアル編集では後から dt と dd のセットを div で囲むということが出来ないので、普通に dt, dd を挿入する以外の使い勝手は今一つですが。


※1 「定義リスト」は以前の呼び方で、HTML5 から「説明リスト」となり、用途の幅が広がりました。

※2 HTML5.2 から dl 直下に div タグが使えるようになったことで、dt と dd のセットを div でグルーピングできるようになり、CSS でレイアウトするのが容易になりました。