概要
- 「SyntaxHighlighter Evolved」というプラグインを入れる。
- インライン要素としてハイライトするならテーマを自分で拡張する
環境
WordPress 5.1
エディタ:Gutenberg
テーマ:Twenty Eleven
※他のテーマだとこんなことする必要はないかもしれない
詳細
ソースコードをハイライトする
「SyntaxHighlighter Evolved」というプラグインを導入。
新規投稿画面(Gutenberg)で、ブロックを追加するときに「Syntaxhighlight Code」というブロックを追加して、その中にコードを書いていく。
インライン要素をハイライトする
WordPressの管理画面→「外観」→「カスタマイズ」→「追加CSS」に以下を記述。
code { padding: 2px; border-radius: 2px; color: #23282d; background: #f3f4f5; }