記事内でブロックを使っているかどうかを判別する

記事内でブロックを使っているかどうかを判別する

Posted: 2020/1/7 Updated: 2020/1/7

サイトのリニューアルでブロックエディターに切り替えたものの、過去の記事の切り替えはどうすればいいでしょう?

数十件の記事であれば、少しの手間でブロックエディターに切り替えられるかもしれません。しかし、それが数百、数千だったら・・・?

段落や見出しといった汎用性の高いものはリニューアル後のCSSがあたれば問題なさそうです。ですが、特定のクラスをつけたHTMLなどは代替のしようがありません。

こうなると、一部リニューアル前のCSSを引き続き利用する方法が一番低コストではないかと思います。

新しいCSSとバッティングしたら?

CSSを流用しても、リニューアル後のCSSとバッティングして表示崩れするのは避けたいですね。

私は記事内にブロックがあるかどうかで何かしらのクラスをつけて判別する方法をとりました。

その時のコードが以下です。

add_filter(
	'post_class', function ( $classes ) {
		if ( has_blocks() ) {
			$classes[] = 'use-block-editor';
		} else {
			$classes[] = 'use-classic-editor';
		}
		return $classes;
	}
);

フィルターをつかって、post_classにクラスを追加します。

has_blocks() は投稿内にブロックがあるかどうかの判別ができます。
ブロックがあるときはuse-block-editorというクラスが、ないときはuse-classic-editorというクラスが付与されます。

あとは、use-classic-editor 配下のエレメントやクラスに対して古いCSSが当たるようにすればよいだけです。

リニューアルで過去の記事の扱いに悩んでいる方の選択肢のひとつになれば幸いです。