経験知ロゴ

WordPressで日本語混じりの複雑な数式を表示できるプラグイン「MathJax-LaTeX」


MathJax

ブログを書いていると、分数やべき乗など複雑な数式を書きたいことがありますが、既存のままでは表現できません。

文字を組み合わせて表示させるシステムにLATEXというシステムがあります。このシステムはWindowsやMac、LinuxなどのOSで使うことができ、数学を多用する論文などに使われています。

このLATEXをブラウザ上で使えるようにしたJavaScriptライブラリがMathJaxで、MathJaxをWordPressで使えるようにしたプラグインが「MathJax-LaTeX」です。

このページでは「MathJax-LaTeX」の使い方を紹介します。

インストール

WordPressの管理画面から「MathJax-LaTeX」をインストールし有効化する。
関連:「WordPressのプラグインをインストールする方法 | 経験知

使い方

「MathJax-LaTeX」を使いたい記事内で、下記ショートコードを追加。

[mathjax]

追加する場所は記事の最初でも最後でもどこでも良い。

このショートコードを記事内に書くと、フッターに「MathJax」のJavaScriptを読み込むコードが追加され「MathJax」を使えるようになる。

<script type='text/javascript' src='https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=default'></script>

あとはLatex記法を「$$」で囲めばOK。

$$直接利回り=\frac{表面利率}{購入価格}\times100$$

上記コードはこのように表示される。
$$直接利回り=\frac{表面利率}{購入価格}\times100$$

LaTeXコマンドはこちらで

関連:「LaTeXコマンド集

フォントや中央寄せを変更する

中央寄せを左寄せにしたり、フォントを変更するにはCSSで変更できる。

style.cssに


.MathJax_Display {
  text-align: left !important;
  font-family: sans-serif !important;
}

のように書く。「font-family」はお好みで。

わからないことは人に聞こう

プログラミングをする上で、わからないことはネットなどを使い自分で調べる技術が必要ですよね。

時間がかかっても、ある程度のことは解決できます。

しかし、どうしても答えにたどり着けなかったり、探す時間が惜しいときもあります。

そこでオススメなのが無料登録でプログラミングに関する質問ができるテラテイルです。

質問の投稿にコードも投稿できるので、自分のコードを投稿して問題のある箇所を指摘してもらうことができます。

プログラマーには、自分で探す技術も必要ですが、人に聞く技術は更に重要です。

登録無料で質問できますので、テラテイルで質問する力を磨いてみましょう!

おわりに

Webで数式を表示するのはめんどくさいですが、「MathJax-LaTeX」を使えば比較的簡単に使用することができます。

画像で数式を作るのもよいですが、手間がかかりますよね。

▼役に立ったらシェアをお願いします