[ 解決済 ] 【機能追加要望】VK Filter Search Pro に カスタム HTML ブロックを追加できるとうれしい

[対馬 俊彦]

■ 期待する動作
お世話になっています。

現状、添付画像のように VK Filter Search Pro ブロック内に追加できるブロックが6つに限定されていますが、カスタム HTML ブロック を使えるようにしてほしいです。

やりたいことは、該当 URL のサイトの検索フォームのように

* 最初はよく使う検索条件だけを表示しておく
* [さらに詳細な条件で検索する] をクリックしたときに、詳細な条件が表示される

ということです。

■ 自分で試した事
アクションフックがあるか探してみましたが、見つかりませんでした。

■ その他特記事項
いろいろなブロックを使えるようになるとさらにうれしいのですが、とりあえず カスタム HTML ブロック があればやりたいことができるので、ご検討のほどよろしくお願いいたします。

Attachments:

You must be logged in to view attached files.

---

該当URL : https://*********

※該当URLはフォーラムライセンスが有効のユーザーにのみ表示されます

[石川＠Vektor,Inc.]

お世話になっております。ベクトルの石川でございます。

なんとなくフックで対応するアタリはついたのですが、
担当が大型連休で仕様確認が来週の連休明けになってしまうのですが急ぎますか？

[対馬 俊彦]

5月中に実装できれば…と思っていました。

私が書くのは、div タグで囲んで jQuery で開閉するかんたんなコードなので、
連休明けでまったく問題ございません。

お手数をお掛けします。よろしくお願いいたします。

[石川＠Vektor,Inc.]

おまたせしました。
まずは 2.7.2 にアップデートしてください。
その上で下記コードを追加してみてください。

function my_allow_html_block_to_vkfs_editor_scripts() {

	// インラインJavaScriptコード
	$inline_script = <<<EOD
const AllowHtmlToVKFS = (settings, name) => {
	if (name === 'vk-filter-search-pro/filter-search-pro') {
        const { allowedBlocks = [] } = settings;
        return {
            ...settings,
            allowedBlocks: [...allowedBlocks, 'core/html'],
        };
    }
    return settings;
};

wp.hooks.addFilter(
    'blocks.registerBlockType',
    'core/html',
    AllowHtmlToVKFS,
    10
);
EOD;

	// スクリプトを登録後、インラインスクリプトを追加
	wp_add_inline_script( 'vk-filter-search-pro-block', $inline_script );

}
add_action( 'enqueue_block_editor_assets', 'my_allow_html_block_to_vkfs_editor_scripts' );

※ VK Filter Search Pro の子ブロックは幅処理も関連する都合上、基本的に他のブロックを使うと崩れる（幅処理調整が自分で必要）ので、一般開放すると「表示が崩れる」というコメントが次から次へと来そうなので、そのあたり理解している人にだけにしたいため上記のようなコードでのカスタマイズでの対応とさせていただきます。

[対馬 俊彦]

VK Filter Search Pro を 2.7.2 にアップデートして、
ご提示いただいたコードで カスタム HTML ブロックが使えるようになったことを確認しました。

検索フォームでやりたかった詳細条件の開閉も実装できました。

カスタム HTML が使えるようになって、
他にもいろいろできるんじゃないかとちょっとワクワクしています。

コードに手を加えると他のブロックも使えそうなかんじで、楽しそうです😊

ありがとうございます!!

[投稿者]

投稿