広告 ブログ運営

WordPressで数式をキレイに!MathJaxの使い方【LaTeX】

サンダー
サンダー
WordPressで分数や数式の表示はどうしていますか?
(分子) / (分母)とか、(分子)÷(分母)とか…
かみなりん
かみなりん
サンダー
サンダー
テキスト表示だとそうですね。美しく見せるには「MathJax」というプラグインがオススメです。

 

■MathJaxでの数式表示サンプル(RLC回路の微分方程式)

$$ R \cdot i + L \cdot \frac{di}{dt} + \frac{1}{C} \cdot \int i dt = e  \cdots RLC回路の微分方程式 $$

 

サンダー
サンダー
このように分数や積分はもちろん、日本語もキレイに出力してくれます。

 

[st_af id="2919"]

MathJaxを使用する

MathJaxはLaTeXでの記述を行います。

LATEX(ラテック、ラテフ)とは、レスリー・ランポートによって開発されたテキストベースの組版処理システムである。

[引用]Wikipedia

LaTeXで記述すると数式をキレイに表せるので、学術論文などではLaTeX形式で記述される事が多いです。

 

MathJaxプラグインのインストール

MathJaxプラグイン

 

 

MathJaxプラグインをインストールします。

ダッシュボードの「プラグイン」→「新規追加」を押し、「プラグインの検索」で「MathJax」を検索します。

上記の「MathJax-LaTeX」が表示されたら、「今すぐインストール」ボタンを押して、インストールを行います。

インストールが完了し、「有効化」のボタンが表示されたら、「有効化」ボタンを押して、プラグインを有効にします。

 

MathJaxプラグインの設定

MathJax設定画面

 

MathJaxプラグインを有効化したら、使用するための設定を行います。

ダッシュボードの「プラグイン」→「インストール済みプラグイン」から「MathJax-LaTeX」を探し、「設定」を押します。

設定画面は変更する必要はなく、デフォルトのままで問題ありません。

「Save Changes」を押して、設定画面を終了します。

 

MathJaxプラグインを記事内で使用する


MathJaxプラグインを使用するためには、[ ]内にmathjaxと記述したショートコードを記載します。

場所はどこでも問題ありませんが、記事の最初に記述する事をオススメします。

 

 

 

MathJaxをinline形式で表示する

MathJaxでのinline表示の説明

 

数式をinline形式で表示する場合は、下記のように「\」+「(」から始めて、「\」+「)」で閉じます。

【記述例】

問題(1)の式は\(y=f(x)\)です。

 

inline形式は、文の途中でも改行せずにそのまま表示する形式です。

HTMLでは、アンカータグなどがinline要素となります。 ⇒ inline要素:サンダーブログはこちら

 

上記の記述例は下記のように表示されます。

【表示例】

問題(1)の式は、\(y=f(x)\)です。

 

MathJaxをblock形式で表示する

MathJaxでblock形式表現

 

数式をblock形式で表示する場合は、「$」マーク2個で開始し、「$」マーク2個で閉じます。

【記述例】

問題(1)\(2x=2\)の答えは
$$ x = 1 $$
です。

 

block形式は、その要素のみで1行使用されます。

HTMLでは、見出しタグなどがblock要素になります。

見出しはblock要素(1行使用)、h5タグ

上記の記述例は下記のように表示されます。

【表示例】

問題(1) \(2x=2\) の答えは

$$ x = 1 $$

です。

 

MathJaxが対応しているLaTeXコマンド一覧

MathJaxはLaTeX形式で記述しますが、全てのLaTeXコマンドには対応していません。

数式を記述する上で、よく使用するコマンドを抜粋してご紹介します。

またコマンドの前後は半角スペースを空けます。

 

演算子、等号、不等号

記号 LaTeX 表示
+ \(+\)
- \(-\)
× \times \(\times\)
÷ \div \(\div\)
\cdot \(\cdot\)
= = \(=\)
\neq \(\neq\)
\approx \(\approx\)
> > \(>\)
< < \(<\)
\geq \(\geq\) 
\leq \(\leq\)

 

数式

記号 LaTex 表示
分数 \frac{分子}{分母} \(\frac{1}{x}\)
繁分数(分子や分母が分数) \frac{分子}{\frac{分母の分子}{分母の分母}} \(\frac{1}{\frac{1}{R}}\)
絶対値 | 中身 | \(|x|\)
二重絶対値 \| 中身 \| \(\|v\|\)
分数の絶対値 \left| 分数 \right|  \(\left| \frac{1}{x} \right| \)
sin x cos x tan x \sin x \cos x \tan x \(\sin x \cos x \tan x\)

 

数式は美しく

サンダー
サンダー
MathJaxを使って数式より美しく表示させてみてください。

 

created by Rinker
¥3,520 (2025/05/15 10:16:22時点 楽天市場調べ-詳細)







人気の記事

1

    こんな方におすすめ 直流(DC)と交流(AC)の違いについて知りたい 直流(DC)の交流(AC)について、それぞれ特徴を知りたい   電気の流れる向き・電流・電圧が変わるの ...

【オペアンプ】 反転増幅回路の回路図アイキャッチ 2

    オペアンプの反転増幅回路 オペアンプの反転増幅回路は下図のようになります。 反転増幅回路の入力電圧をVi、出力電圧をVoとすると下記の式で表されます。   オペア ...

アノードコモンとカソードコモン 3

  LEDのアノードとカソードについてとその見分け方 「アノードコモン」と「カソードコモン」について説明する前に、LEDのアノードとカソードについて説明します。   LEDは正しい ...

4

という問題が起きているようですね。 アフィリエイトが発生しないというのは死活問題ですね。   原因はどうやら、アンカーリンク内のtarget="_blank"が関係しているようだと。でも正確 ...

旅行やアルバイト等の 紹介にバリューコマースの『MyLinkBox』が超便利!! 5

  MyLinkBoxで商品紹介できる広告主一覧 MyLinkBoxで商品紹介できる広告主一覧は下記の通りです。 カテゴリー 広告主一覧 モール(物販) Yahoo!ショッピング/楽天市場/ ...

miMind使いかたアイキャッチ 6

      私もよく情報を整理するためにマインドマップを作成しています。 何か思いついたときにメモ代わりとして使用する事もあり、常に携帯しているスマホでマインドマップを作 ...

Web(ウェブ)開発の学習にオススメなUdemyコース3選 7

アメリカのシリコンバレー発のオンライン学習サイトで、日本ではベネッセが運営しています。 私自身もWeb開発やPythonなどのコースを購入しています。プログラミングだけでなく、動画編集や写真撮影など様 ...

ブレッドボード の使い方のアイキャッチ 8

  こんな方におすすめ ブレッドボードの使い方を知りたい ブレッドボードの使い方:ブレッドボードとは?ブレッドボードの仕組みについて   ブレッドボードは電子部品の足を差し込むだけ ...

箇条書きタグ自動追加ツール 9

【このツールの目的】 箇条書きタグ(ulタグもしくはolタグ)を自動で追加するツールです。 listタグも自動で追加します。 【箇条書きの種類選択】 数字無し箇条書き(ul) ・箇条書き 数字有り箇条 ...

LED抵抗計算機 10

LED抵抗自動計算機 下図のように、LED1個をつなぐとき、LEDに流したい電流から抵抗値を求める計算機です。   LED抵抗計算機 ↓電源電圧【例】5(V) ↓LEDの電圧降下【例】2(V ...

-ブログ運営
-, , ,