Cocoonでソースハイライトのされ方がちょっとおかしいとき | WordPress

原因の１つは「ライブラリ」の選択が「軽量版（よく利用されている言語のみ）」になっているから。

「全て（対応している言語全て）」を選択すれば解決する可能性があります。

背景

Cocoonではコードハイライトライブラリのhighlight.jsがデフォルトで使えます。

使い方はこちらの記事をご覧下さい。

Cocoonでソースコードをハイライトさせる方法 | WordPress

この記事では、Cocoonでソースコード(HTMLやプログラム)をハイライトさせる方法を説明します。先に簡単に説明します。Cocoonには、ソースコードをハイライトさせる機能が標準で備わっているので、ソースコードを<pre>&l

misaki-blog.com

注意点としては、Cocoon 1.9.5でhighlight.jsの軽量化がなされたことです。

そのため、デフォルトで対応するのはこちらのみとなります。

1. Apache
2. Bash
3. C#
4. C++
5. CSS
6. CoffeeScript
7. Diff
8. HTML, XML
9. HTTP
10. Ini, TOML
11. JSON
12. Java
13. JavaScript
14. Makefile
15. Markdown
16. Nginx
17. Objective-C
18. PHP
19. Perl
20. Properties
21. Python
22. Ruby
23. SQL
24. Shell Session
25. YAML

参考：
Cocoonのコードハイライト機能で多言語に対応する方法（highlight.js）

highlight.jsの全言語対応版を使いたいとき

ダッシュボードで「Cocoon 設定」→「コード」をクリックします。

「ライブラリ」で「全て（対応している言語全て）」にチェックを入れます。

ページ下部にある「変更をまとめて保存」をクリックします。

これで完了です。

おわりに

私はR言語の記事を書くので、全言語対応版を使っています。
オンラインマガジンIEEE Spectrumの調査（The Top Programming Languages 2019）では、Rは５位になっています。
軽量版に入っているC#やJavaScriptよりも上位なので、軽量版に入っていて欲しかったところですが、国内でRはあまり使われていないのかも知れませんね。

また、全言語対応版の使用によりサイトが重くなる可能性があります。
そのような場合に備え、必要な言語のみのハイライトも可能なようです。

ライブラリ変更フック

サイトが重いなと感じたらチャレンジしようかと思います。

では。

—
YouTube: ミサキさん

問い合わせ先
Mail: caprico.aries@gmail.com
Twitter: https://twitter.com/caprico_aries(無言フォローもお気軽に)