cocoonフック調査~get_block_editor_code_languagesの使い方と活用例

2025年10月11日
cocoon
WordPress

タナビーの高梨です。

WordPressのテーマ「Cocoon」には、テーマ改変なしでデザインや動作を拡張できる豊富なアクション・フィルターフックが用意されています。

分かる範囲で内容を調査したのでブログにまとめていこうと思います。

今回はコードブロックで選択できる言語を追加、削除できるフィルターフック
👉get_block_editor_code_languages
です

フックの概要

フック名発火タイミング
get_block_editor_code_languagesブロックエディタ起動時

発火条件

ブロックエディタ起動時に無条件に発火します。

使いどころ

Cocoonでは、コードブロックに対して highlight.js によるシンタックスハイライト機能が提供されています。

しかし、デフォルトでは対応していない言語も存在するため、開発者によっては「よく使う言語が選択肢にない」ことがあります。

このような場合、get_block_editor_code_languages フックを使うことで以下が可能になります:
・対応していない言語を追加する
・不要な言語を削除する
・よく使う言語のみ残して軽量化する

apply_filters呼び出し元のソースコード

引数

$languages:(array)言語情報

カスタマイズコード例

公式サイトで紹介されているコードで、highlight.jsでサポートしているほぼすべての言語を追加した例です

注意点

・$languages 配列の各要素は、value(言語スラッグ)と label(表示名)で構成されます。

・highlight.js がサポートしていない言語を登録しても、ハイライトは適用されません。

・言語リストを大量に登録すると、エディタのドロップダウンが長くなり、操作性が低下するかもしれません。

・nohighlight と plaintext はデフォルトで残しておくと安全です。

まとめ

・get_block_editor_code_languages は、Cocoonのコードブロックで選択できる言語リストをカスタマイズできるフィルターフック

・highlight.jsの対応範囲を広げたいときや、特定の言語だけを残したい場合に便利

・配列操作のみで変更可能なため、テーマ改変不要で柔軟に対応できます