Wordpressのブロックエディタ（Gutenberg）で、親カテゴリに自動チェックを入れる方法

Question

実現したいこと

ブロックエディタでカテゴリー選択時、子カテゴリーにチェックを入れたら自動で親カテゴリーにもチェックが入るようにしたい。

前提

クラシックエディタで上記要件を実現する方法はいくつかあります。
テーマに関数追加したり、プラグインで提供されているものもあります。

ですが、ブロックエディタで上記要件を実現する方法やプラグインについては見つかりませんでした。
自分で実装を試みたんですが、見た目では上記要件を実現することはできました。
しかし、記事を保存すると、自動チェックされた親カテゴリのチェックが外れてしまいます。

単純に親カテゴリのチェックボックスをcheckedに変更しただけでは、記事保存時にデータ登録までは行われないというところまで確認できています。

では具体的に、自動チェックした親カテゴリーの情報を記事保存時に正しくデータ登録するにはどうしたらよいか？というところで詰まりました。

何か上記要件を実現しているプラグインでもあれば解決するのですが、そのようなプラグインはあるでしょうか？

試したこと

記事保存時に、自動チェックした親カテゴリの情報が登録されないのは、画面のどこか別のhiddenなDOMにチェックされたカテゴリー情報を保持していて、そこを更新するスクリプトを実装していないからだ。という予測を元に、下記を調べました。

カテゴリーにチェックを入れる前と後で、htmlの差分（chromeデベロッパーツールElementで出力されてる部分）を取り、確認する。

全部で6カ所ありましたが、チェックを入れる前と後で、チェックしたカテゴリーの情報がどこかに入るといったようなことはありませんでした。

Answer 1

この回答はGPT-4による自動生成回答です

ブロックエディタ（Gutenberg）で子カテゴリーにチェックを入れた際に親カテゴリーにもチェックが入るようにするには、JavaScriptを使用してカスタムスクリプトを作成する必要があります。以下にその方法を示します。

まず、functions.phpファイルに以下のコードを追加して、カスタムスクリプトをエンキューします。

function enqueue_custom_script() {
    wp_enqueue_script(
        'custom-script',
        get_template_directory_uri() . '/js/custom-script.js',
        array( 'wp-blocks', 'wp-element', 'wp-editor', 'wp-components', 'wp-data' ),
        filemtime( get_template_directory() . '/js/custom-script.js' ),
        true
    );
}
add_action( 'enqueue_block_editor_assets', 'enqueue_custom_script' );

次に、テーマディレクトリ内にjsフォルダを作成し、その中にcustom-script.jsファイルを作成します。そして、以下のコードを追加します。

wp.domReady(function () {
    const { subscribe } = wp.data;

    let previousCheckedCategories = [];

    subscribe(() => {
        const checkedCategories = wp.data.select('core/editor').getEditedPostAttribute('categories');

        if (JSON.stringify(previousCheckedCategories) !== JSON.stringify(checkedCategories)) {
            previousCheckedCategories = checkedCategories;

            checkedCategories.forEach((categoryId) => {
                wp.apiFetch({ path: `/wp/v2/categories/${categoryId}` }).then((category) => {
                    if (category.parent !== 0 && !checkedCategories.includes(category.parent)) {
                        wp.data.dispatch('core/editor').editPost({
                            categories: [...checkedCategories, category.parent],
                        });
                    }
                });
            });
        }
    });
});

このスクリプトは、カテゴリーがチェックされたときに親カテゴリーが自動的にチェックされるようにするものです。記事を保存すると、親カテゴリーのチェックも正しくデータ登録されます。

ただし、この方法はブロックエディタの内部構造に依存しているため、将来的にブロックエディタがアップデートされると動作しなくなる可能性があります。そのため、定期的に動作確認を行い、必要に応じてスクリプトを更新することが重要です。