AW Formula は、数式、化学反応式、構造式を記事の中に正しく載せるための WordPress プラグインです。数式は KaTeX、化学反応式は mhchem の記法、構造式は SMILES から 2 次元の構造を描きます。どれもブラウザ側で描き、JavaScript が無い環境では元の記法がそのまま読めます。
見本
数式。表示モードと式番号。
\int_0^\infty e^{-x^2}\,dx = \frac{\sqrt{\pi}}{2}\mathbf{A} = \begin{pmatrix} a_{11} & a_{12} \\ a_{21} & a_{22} \end{pmatrix}, \quad \det \mathbf{A} = a_{11}a_{22} - a_{12}a_{21}化学反応式。mhchem の記法で、状態、電荷、同位体、平衡も書けます。
CaCO3(s) ->[\Delta] CaO(s) + CO2(g)2 H2 + O2 -> 2 H2OFe^{3+} + SCN^- <=> [Fe(SCN)]^{2+}構造式。SMILES から描きます。左はアスピリン、右はカフェインです。
CC(=O)Oc1ccccc1C(=O)OCC(=O)Oc1ccccc1C(=O)OCn1cnc2c1c(=O)n(C)c(=O)n2CCn1cnc2c1c(=O)n(C)c(=O)n2C特長
- 数式:KaTeX による高速で正確な描画。表示モードと行内モード、式番号、任意の番号。読み上げ向けに MathML も出します。
- 化学反応式:mhchem の記法(
H2O + CO2 <=> H2CO3のように書くだけ)。状態記号、電荷、同位体、矢印の上の条件に対応します。 - 構造式:SMILES から 2 次元の構造式を SVG で描きます。幅と高さ、明暗テーマ、水素の表示(骨格、末端、すべて)、SMILES の併記を選べます。
- JavaScript が無くても壊れない:元の記法をそのまま出し、描画できたときだけ置き換えます。描画に失敗しても元の記法と要点を表示します。
- ショートコード:[aw-math]、[aw-chem]、[aw-structure] でクラシックエディターや他のブロックの中からも使えます。設定で本文中の
$…$の自動描画も有効化できます(既定は無効。コードや他製品の枠の中には触れません)。 - 安全性:入力はサーバー側でエスケープし、SMILES の文字と長さを制限します。KaTeX は信頼しない設定で描き、外部サービスとは通信しません(ライブラリとフォントはプラグインに同梱)。
- 日本語対応:管理画面とブロック編集画面の両方に日本語訳が入っています。
使い方
ブロックエディターで「AW Math」「AW Chem」「AW Structure」のいずれかを追加し、本文欄に記法を書きます。「プレビュー」でその場の描画を確認できます。ショートコードでは次のように書きます。
[aw-math display="1" numbered="1"]\frac{a}{b} + \sqrt{c}[/aw-math]
[aw-chem]2 H2 + O2 -> 2 H2O[/aw-chem]
[aw-structure smiles="CC(=O)Oc1ccccc1C(=O)O" width="320" height="220" caption="1"]
動作環境
- WordPress 6.5 以上(7.1 で検証)
- PHP 7.4 以上(8.5 で検証)
- ブロックテーマとクラシックテーマの両方。外部サービスとの通信はありません(KaTeX、mhchem、smiles-drawer を同梱)
ライセンスと購入
AW Formula のコードは GPLv2 以降で提供します。同梱の KaTeX、mhchem、smiles-drawer は MIT ライセンスです。ライセンスキーは、更新の配信とサポートを受けるためのものです。価格と購入方法は準備中で、AW WP Plugin シリーズの他の製品と組み合わせた技術記事向けの組み合わせも用意する予定です。
更新履歴
- 1.0.0(2026-10-21):初版。数式、化学反応式、構造式の 3 ブロックとショートコード、日本語訳。
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 の無いサイトにも置ける。