AW Code は、記事の中にソースコードを読みやすく載せるための WordPress プラグインです。185 言語のシンタックスハイライトをサーバー側で行い、行番号、行の強調、ファイル名のタブ、コピー釦、折り返し、長いコードの畳み込みを備えます。Crayon Syntax Highlighter の記法をそのまま読むので、Crayon を使っていた記事は書き換え無しで表示が続きます。
見本
PHP。ファイル名のタブと、6 行目と 10 行目の強調。テーマは読者の明暗設定に合わせる「auto」です。
<?php/** * Return the first host that answers on port 22. */function first_alive( array $hosts, int $timeout = 2 ): ?string { foreach ( $hosts as $host ) { $fp = @fsockopen( $host, 22, $errno, $errstr, $timeout ); if ( $fp ) { fclose( $fp ); return $host; } } return null;} echo first_alive( [ 'test-node-01.example.com', 'test-node-02.example.com' ] ) ?? 'none', PHP_EOL;Bash（テーマ atom-one-dark）。右上の「コピー」で行番号を含まずにコードだけが複製されます。
#!/usr/bin/env bashset -euo pipefailfor h in test-node-01 test-node-02; do if ping -c1 -W1 "$h.example.com" >/dev/null; then echo "$h: up" else echo "$h: down" >&2 fidoneDiff（テーマ github、行番号なし）。
--- a/config.yaml+++ b/config.yaml@@ -1,4 +1,5 @@ server:- port: 8080+ port: 8443+ tls: true workers: 4言語を「自動判定」にした Python（テーマ monokai）。行番号は 20 から。
import asyncio async def probe(host: str, port: int = 22) -> bool: try: _, w = await asyncio.wait_for(asyncio.open_connection(host, port), 2) except (OSError, asyncio.TimeoutError): return False w.close() return True print(asyncio.run(probe("test-node-01.example.com")))長いコードは指定した行数で畳み、「全 40 行を表示」で開きます（テーマ nord）。
SELECT 1 AS n, now() AS at;SELECT 2 AS n, now() AS at;SELECT 3 AS n, now() AS at;SELECT 4 AS n, now() AS at;SELECT 5 AS n, now() AS at;SELECT 6 AS n, now() AS at;SELECT 7 AS n, now() AS at;SELECT 8 AS n, now() AS at;SELECT 9 AS n, now() AS at;SELECT 10 AS n, now() AS at;SELECT 11 AS n, now() AS at;SELECT 12 AS n, now() AS at;SELECT 13 AS n, now() AS at;SELECT 14 AS n, now() AS at;SELECT 15 AS n, now() AS at;SELECT 16 AS n, now() AS at;SELECT 17 AS n, now() AS at;SELECT 18 AS n, now() AS at;SELECT 19 AS n, now() AS at;SELECT 20 AS n, now() AS at;SELECT 21 AS n, now() AS at;SELECT 22 AS n, now() AS at;SELECT 23 AS n, now() AS at;SELECT 24 AS n, now() AS at;SELECT 25 AS n, now() AS at;SELECT 26 AS n, now() AS at;SELECT 27 AS n, now() AS at;SELECT 28 AS n, now() AS at;SELECT 29 AS n, now() AS at;SELECT 30 AS n, now() AS at;SELECT 31 AS n, now() AS at;SELECT 32 AS n, now() AS at;SELECT 33 AS n, now() AS at;SELECT 34 AS n, now() AS at;SELECT 35 AS n, now() AS at;SELECT 36 AS n, now() AS at;SELECT 37 AS n, now() AS at;SELECT 38 AS n, now() AS at;SELECT 39 AS n, now() AS at;SELECT 40 AS n, now() AS at;テーマ
代表的な 12 種を、同じコードで切り替えて見比べられます（AW Carousel を使っています）。
ヘッダーにテーマの一覧を出す設定にすると、読者が 90 種すべてと「auto」から選べます。選んだテーマの CSS はそのときに読み込みます。
#!/usr/bin/env bashset -euo pipefailfor h in test-node-01 test-node-02; do if ping -c1 -W1 "$h.example.com" >/dev/null; then echo "$h: up" else echo "$h: down" >&2 fidoneテーマの見本ページ では、PHP、Bash、Python の 3 つで全テーマを試せます。
特長
- 185 言語：同梱の highlight.php（highlight.js の PHP 版）でサーバー側にハイライトします。ページは完成した HTML で届くので、JavaScript が無くてもコードが見え、検索エンジンにも素の文字が渡ります。結果はキャッシュします。
- 行番号と強調：行番号は CSS の counter で描くので、選択してもコピーしても混ざりません。最初の行番号と強調する行（3,5-7 のような指定）を決められます。
- ヘッダー：ファイル名のタブ、言語名、折り返しの切り替え、コピー釦。
- 畳み込み：指定した行数を超えるコードは畳み、「全 N 行を表示」で開きます。
- 90 種のテーマ：highlight.js のテーマ一式。読者の明暗設定に追従する「auto」のほか、ブロックごとに別のテーマも選べます。テーマの CSS はそのブロックだけに効くように出力します。ヘッダーに一覧を出せば読者がその場で切り替えられます。
- Crayon 互換：[crayon]、[crayon-inline]、<pre class=”lang:php mark:1-3″> の記法をそのまま表示します。Crayon を外しても記事は壊れません。
- 安全性：コードはすべてサーバー側でエスケープし、ハイライターが付けた span 以外のタグは出しません。入力の大きさに上限があります。外部サービスとは通信しません。
- 日本語対応：管理画面とブロック編集画面の両方に日本語訳が入っています。
開発の動機
Crayon Syntax Highlighter は、多くの技術ブログで長く使われたコード表示プラグインです。しかし数年前から更新が止まり、最近の PHP では動かなくなりました。記事に残った Crayon の記法を活かしたまま、新しい WordPress で読みやすいコード表示を続けたくて、一から書いたのが AW Code です。
Crayon のコードは使っていませんが、記法と考え方は Crayon に負っています。作者の Aram Kocharyan 氏と、言語定義の元になった highlight.js と highlight.php の作者に感謝します。
使い方
ブロックエディターでは、ブロックの追加で「AW Code」を選び、コードを貼って言語とファイル名を選びます。言語を選ばなければ色付けなしの素の文字で、自動判定を選ぶこともできます。行番号、最初の行番号、強調する行、折り返し、テーマ、畳む行数は右側の設定で変えられます。
ショートコードでは次のように書きます。[aw-code] の属性はすべて省略できます。
[aw-code lang="php" title="hello.php" mark="2" start="1" theme="github"]
<?php
echo "hello";
[/aw-code]| 属性 | 意味 |
|---|---|
lang | 言語の id（php、bash、python など 185 種）。auto で自動判定、none で色付けなし |
title | ファイル名や題名 |
lines | 行番号の有無（1 / 0） |
start | 最初の行番号 |
mark | 強調する行。3,5-7 のように |
wrap | 長い行を折り返す |
theme | テーマ名か auto |
max_lines | この行数を超えたら畳む |
inline | 文中の行内コードにする |
Crayon からの移行
AW Code を有効にすると、[crayon] と [crayon-inline] のショートコード、そして <pre class=”lang:php decode:true mark:2″> の形で書かれたコードはそのまま表示されます。lang、title、mark、nums、start-line、wrap、decode の各指定を読みます。Crayon は無効化または削除して構いません。
動作環境
- WordPress 6.5 以上（7.1 で検証）
- PHP 7.4 以上（8.5 で検証）
- ブロックテーマとクラシックテーマの両方。ビルド工程や外部ライブラリの読み込みは不要です
ライセンスと購入
AW Code のコードは GPLv2 以降で提供します。同梱の highlight.php は BSD-3-Clause です。ライセンスキーは、更新の配信とサポートを受けるためのものです。
価格と購入方法は準備中です。販売開始時に、価格、購入方法、サポートの窓口、特定商取引法に基づく表記をこのページに掲載します。AW Term と組み合わせた技術記事向けの組み合わせも用意する予定です。
更新履歴
- 1.1.0（2026-10-21）：ヘッダーのテーマ切り替え（テーマの CSS は選んだときに読み込む）。
- 1.0.0（2026-10-21）：初版。ブロック、ショートコード、Crayon 互換、185 言語、90 テーマ、行番号と強調、畳み込み、コピー、日本語訳。
AW WP Plugin シリーズ
本製品は、WordPress の投稿画面で技術的な内容をきれいに見せるプラグイン群「AW WP Plugin シリーズ」の一つです。6 製品は同じ作り（同じ編集画面、同じ設定の形、同じ更新の仕組み）で、同時に有効化しても互いに干渉しません。シリーズの一覧もご覧ください。
- AW Term — 端末のセッションを、打つ動きと出力の順で再生。10 種の端末の見た目、コピー、テーマ切り替え。
- AW Code（このページ）— 185 言語のシンタックスハイライト。行番号、行の強調、折り返し、90 種のテーマ。Crayon の記法もそのまま表示。
- AW Carousel — 見本や画面を切り替えて見せるカルーセル。写真と動画向けのリッチモードは拡大表示と全画面に対応。
- AW Markdown — Markdown をそのまま書ける。Mermaid の図は読者の明暗に合わせて描画。コードは AW Code の表示に。
- AW Formula — KaTeX の数式、mhchem の化学反応式、SMILES からの構造式。JavaScript が無くても元の記法が読める。
- AW Contact — 問い合わせフォーム。迷惑投稿対策と受信の記録を備え、同じ部品を WordPress の無いサイトにも置ける。