技術ブログや解説記事を書いていると、コードをそのまま貼っただけで「うっ、読みにくい……」と肩を落とした経験はありませんか。
Web制作に長く関わってきて、その間ずっとコードの見せ方には悩まされてきました。色も付かず、行も詰まったコードは、書いた本人ですら後から読み返すのがつらいものです。
そこで登場するのが「シンタックスハイライト」です。この記事では、WordPressでコードを綺麗に色分けして表示する方法を、2026年のいまも安心して使える手段にしぼってやさしく解説します。
実はこのテーマ、ここ十数年でずいぶん事情が変わりました。私がこのブログを始めた頃は「Google Syntax Highlighter for WordPress」というプラグインがド定番で、当時の記事でも自信たっぷりにおすすめしていたものです。
ところが時は流れ、WordPressの編集画面はクラシックエディターからブロックエディター（Gutenberg）へと大きく変わりました。それにともなって、コード表示まわりの「正解」もすっかり様変わりしています。
昔の定番をそのまま薦めてしまうと、「入れてみたのに動かない」「もう配布が終わっていた」なんて事故が起きかねません。私自身、古いプラグインを律儀に使い続けて痛い目を見たクチです。せっかく時間をかけて記事を書いたのに、コードの見た目がガタガタでは台無しですよね。
とはいえ、難しく考える必要はありません。やることはシンプルで、いま現在もきちんと動く方法を一つ選んで、コードをそのブロックに入れるだけ。専門的な知識がなくても、ほんの数分で見違えるほど読みやすくなります。
ですので今回は、公式の情報をきちんと確かめたうえで、初心者の方でも迷わず選べるように整理してみました。プラグイン名だけ並べて終わり、という不親切なことはせず、選び方の理由まで添えてあります。それでは、まずは基本のところから確認していきます。
そもそもシンタックスハイライトとは？
シンタックスハイライトとは、プログラムのコードを言語の文法（シンタックス）に合わせて色分けし、読みやすく表示する仕組みのことです。
たとえばHTMLやCSS、PHP、JavaScriptには、それぞれ「予約語」「文字列」「コメント」といった部品があります。これらが色で区別されると、コードの構造がぐっと見やすくなります。
真っ黒な文字の壁だったコードが、色分けされた瞬間に「読めるもの」に変わる。その気持ちよさは一度味わうとやみつきになります。
WordPressでは、この色分けを自分でCSSやJavaScriptを書いて用意することもできますが、初心者の方にはなかなか骨が折れます。そこで多くの人は、専用のプラグインを使ってお手軽に実現しています。
昔の定番「Google Syntax Highlighter」は今どうなの？
かつての大定番が、Alex Gorbatchev氏のSyntaxHighlighterというライブラリを組み込んだ「Google Syntax Highlighter for WordPress」や、その派生版でした。
[sourcecode] のようなショートコードでコードを囲むだけで色が付く手軽さが受け、当時は私も含めて多くのブロガーが愛用していました。
ところが現在では、これらの古いプラグインは更新が止まっており、新しく導入するのはおすすめできません。
ブロックエディターとの相性もよくありませんし、配布自体が終わっているものもあります。「昔の記事で見たから」と探しに行っても、見つからなかったり動かなかったりするわけです。
もしすでに使っている場合でも、慌てて消す必要はありません。後半で移行のコツにふれますので、落ち着いて読み進めてください。
2026年のいま使える、おすすめプラグイン3選
私が公式情報を確かめたうえで、いまも更新が続いていて安心して使えると判断したものを3つ紹介します。
選ぶ基準はシンプルで、「ブロックエディターに対応していること」「更新が続いていること」「自分の使い方に合うこと」の3点です。
関連記事：WordPressおすすめプラグイン｜今も現役の定番だけを用途別に厳選紹介
1. とにかく軽くしたいなら「Syntax-highlighting Code Block」
まずおすすめしたいのが、この「Syntax-highlighting Code Block」です。WordPress標準の「コード」ブロックに、自動でハイライトを付けてくれます。
最大の特長は、色分けをサーバー側で処理する点です。表示するページ側で重いJavaScript（Prism.jsやHighlight.jsなど）を読み込まずに済むため、とても軽量に保てます。
公式の説明によると、JavaScriptをオフにしたブラウザやAMPページでもきちんと色が付き、色が付く前のコードが一瞬チラッと見えてしまう現象も起きません。
言語の自動判別にも対応していて、行番号の表示や特定の行の強調もできます。表示速度を大事にしたい方には、まずこれを試してほしい一本です。
参考： 公式サイト
2. 旧定番から乗り換えるなら「SyntaxHighlighter Evolved」
続いては「SyntaxHighlighter Evolved」です。実はこれ、かつての定番と同じAlex Gorbatchev氏のSyntaxHighlighterをベースにした、いわば正統な後継のような存在です。
クラシックエディター時代からの定番でありながら、現在はブロックエディター用の専用ブロックも用意されています。ブロックのツールバーから言語を選べるのも親切です。
昔の「Google Syntax Highlighter」系を使っていた方にとっては、いちばん馴染みやすい移行先と言えます。
公式ページによれば、利用サイトは2万件以上。多くの人に使われている安心感があり、迷ったときの無難な選択肢として頼りになります。
参考： 公式サイト
3. 見た目を細かく整えたいなら「Enlighter」
配色やデザインにこだわりたい方には「Enlighter – Customizable Syntax Highlighter」がぴったりです。
ブロックエディターとクラシックエディターの両方に対応しているうえ、CSSの知識がなくても配色を調整できる「テーマカスタマイザー」を備えています。
「標準のデザインだとブログの雰囲気に合わないな」と感じたとき、コードを書かずに見た目をいじれるのは初心者にとって心強いポイントです。
クラシックエディターをまだ使っている方にも対応している点も、地味ですがありがたいところです。
参考： 公式サイト
失敗しない選び方のポイント
プラグインを選ぶときは、見た目の好みより先に確認してほしいことがあります。なかでも「更新が続いているか」は、何よりも先にチェックすべき最重要項目です。
これは、私自身が古いプラグインを使い続けて痛い目を見たからこその実感です。同じ轍は踏んでほしくありません。
具体的には、次の点を順番に見ていくと失敗しにくくなります。
- 最終更新が新しく、最新のWordPressで動作確認されているか
- 自分が使っているエディター（ブロック／クラシック）に対応しているか
- 表示ページで重いJavaScriptを読み込まず、速度に悪影響がないか
- 対応している言語や配色が、自分の用途に合っているか
これらは、各プラグインの公式ページ（WordPress.org）を開けば、最終更新日や対応バージョンとして必ず確認できます。導入前のひと手間を惜しまないのがコツです。
ちなみに、過去には人気だったプラグインが配布終了になってしまう例もあります。だからこそ「いま現在も生きているか」を自分の目で確かめる習慣が大切なのです。
プラグインを使わない方法もあります
「これ以上プラグインを増やしたくない」という方もいるでしょう。その気持ち、よく分かります。
その場合は、Prism.jsやHighlight.jsといったライブラリをテーマに直接読み込み、コードを <pre><code> で囲んで表示する方法もあります。
手間はかかりますが、必要な機能だけを読み込めるので、サイトを軽いまま保ちやすいのが利点です。お使いのテーマがもともとコードハイライト機能を持っている場合もあるので、まずはそこを確認してみるとよいでしょう。
関連記事：WordPress高速化のおすすめプラグイン｜SEOにも効く厳選と選び方【最新版】
古いプラグインから移行するときの注意点
最後に、昔のプラグインから乗り換える方への注意点です。
古いプラグインを停止すると、これまで [sourcecode] などのショートコードで書いていた箇所が、色も付かない生のテキストとして表示されてしまうことがあります。
移行するときは、過去記事のコードがどう見えるかを必ず自分の目で確認してください。
記事数が多いなら、検索・置換ができるプラグインを使って一括で書き換えると効率的です。切り替えたあとは、代表的な記事をいくつか開いて、表示が崩れていないかをチェックしておくと安心です。
まとめ：いまも生きている方法を選べば失敗しません
ここまで、WordPressでコードを綺麗に表示する方法を見てきました。最後に大事なところをおさらいしておきましょう。
かつての大定番「Google Syntax Highlighter」系は、すでに更新が止まり、新規導入には向かなくなりました。時代はブロックエディター対応で軽量な、いまも更新が続くプラグインへと移っています。
今回紹介したなかで、もし「どれか一つ選んで」と言われたら、私はこう答えます。とにかく軽さを重視するなら「Syntax-highlighting Code Block」、昔の定番から自然に乗り換えたいなら「SyntaxHighlighter Evolved」、見た目を自由にいじりたいなら「Enlighter」です。
どれも公式のWordPress.orgで配布されていて、更新も続いている安心の選択肢です。
結局のところ、コード表示で失敗しないコツは「いま現在も生きていて、自分のエディターに合った方法を選ぶ」、これに尽きます。
古い記事を頼りに探して「もう無い……」とがっかりするのは、私だけで十分です。プラグイン選びの前に、公式ページで最終更新日と対応バージョンをのぞく。このひと手間が、あなたの未来の時間を確実に守ってくれます。
そして、ここで終わりにせず、ぜひ実際に手を動かしてみてください。まずは一つ入れて、自分の書き方やテーマの雰囲気に合うかを試す。合わなければ、別のものに乗り換えればいいだけです。色分けされた美しいコードがブログに並んだとき、きっと「やってよかった」と思えるはずです。
私自身、長くこのブログを続けてきて、見やすく整えたコードを載せた記事ほど読まれやすいと感じています。ちょっとした手間が、読み手の理解しやすさに確かにつながるのです。
