こんにちは。WAKAです。

WordPressで数式を書くにはどうしたらいいんだろう？

何かいいプラグインはあるかな？

日本語入りで数式を書く。簡単に使えるプラグインは？

私の希望

「WordPress　LaTex　プラグイン」「WordPress　数式　プラグイン」

で検索してみました。

出てきたのがこちら。（2017年11月22日現在）

• Easy WP LaTeX 5.20 (最終更新日４ヶ月前)
• LaTeX for WordPress 3.4.10 (最終更新日4年前)
• MathJax-LaTeX 1.3.6 (最終更新日7か月前)
• Simple Mathjax  1.0.1 (最終更新日3か月前)
• WP LaTeX 1.9.2 (最終更新日3年前)
• WP QuickLaTeX 3.8.4 (最終更新日11か月前)

どれを選べばいいんでしょうか？？？わからない。。

オススメのプラグインはどれだろう。

プラグイン比較で参考にさせていただいたブログはこちら→

http://www.hnagata.net/archives/92

とりあえず、以下を試してみた。

どれも使い方は簡単だった。

• Easy WP LaTeX 　

使い方：[math]〜[/math]「phpBB Style」、$$〜$$　「LaTeX Style」、¥]〜¥]　「MathType Style」から選択可能。

結果：インストール後、設定画面が開けず、エラーが出たので却下…。

• MathJax-LaTeX　

使い方：数式の冒頭に[mathJax]と書いて数式を書くだけ。

結果：日本語が使えて便利！

でも長い分数の時、式とイコールの後の結果の文字が重なって変な表示になる。よって使えず。

• WP QuickLaTeX　

使い方：[latex]〜[/latex]で囲んで数式を書くだけ。

結果：式の中で全角文字が使えない

数式内で全角文字を使いたい時は\mbox{～}を使うらしいけど、なぜかうまく表示されなかった。

私のやり方が悪いだけかもしれない。

最終更新日が３年前〜４年前の

• LaTeX for WordPress 3.4.10 (最終更新日4年前)
• WP LaTeX 1.9.2 (最終更新日3年前)

は、もう更新されてない…？PHP の推奨動作環境とか大丈夫なのかな？と初心者の私は心配で使わなかった。

結果、

• Simple Mathjax  1.0.1 (最終更新日3か月前)

に落ち着いた。

Simple Mathjax のインストールと数式がはみ出さないように設定

こちらのページを参考にさせていただきました。とてもわかりやすいです。

→http://joyplot.com/documents/2016/10/09/wordpress-simple-mathjax/

＜インストール方法＞

1. WordPressのダッシュボードから「プラグイン」→「新規追加」→「Simple Mathjax」を検索
2. 「Simple Mathjax」が表示されたら、「今すぐインストール」を選択→「有効化」を選択

＜数式のはみ出し防止＞

Mathjaxは長い数式を書いた時、デフォルトでは改行せず画面横にはみ出します！

これを防ぐ場合は、以下のようにします。

Mathjaxは長い数式を書いた時、デフォルトでは改行せず画面横にはみ出します。これを防ぎたい場合は 設定 > Simple Mathjax を開き、Custom mathjax config に改行オプション（linebreaks）を含む以下のコードを書き込みます。

 

MathJax.Hub.Config({

    tex2jax: {

         inlineMath: [['$','$'], ['\\(','\\)']]

    },

    "HTML-CSS": {

         linebreaks: { automatic: true }

    },

    SVG: {

         linebreaks: { automatic: true }

    }

});

参照記事：WordPressで数式を書くのに便利なプラグイン – Simple Mathjax

スマホで式が全部表示されない時の解決法

ブログはスマホで見る人が大半！

スマホでどう見えるか？見切れてないか？スマホビューはとっても大事です！

数式が長くてスマホだとはみ出す場合の対処法

ダッシュボード→外観→追加CSSに以下のコードを記述

/*– 数式が長くてスマホだとはみ出す場合の対処法 –*/
div.horizontal-scroll{
overflow-x: auto;
}

式を強制左寄せにする

ダッシュボード→外観→追加CSSに以下のコードを記述

/*– 数式を左寄せ –*/
.MathJax_Display {
text-align: left !important;
text-indent: 2em !important;
}

デメリット：左寄せにしても、長い式はスマホだと見切れてしまう…

式をスクロールできるようにする

テキスト画面で以下のように数式を挟む。

<div class=”horizontal-scroll”>

〜（数式）

</div>

デメリット：式を一個一個挟まないといけない。スクロールバーがでない。全体じゃなくて式だけがスクロールできるようになるので、言わないと誰も気づかない…

スマホの画面を横にしてもらう

画面が縦の時は画面に入りきらず、切れてしまっていた式も、横にすると見えるようになります。

だが非常にカッコ悪い。

まとめ

• WordPressで日本語（全角文字）入りの数式を書きたい
• LaTeX で書きたい

オススメのプラグインは？

スマホで切れちゃった時の解消法は？

について書きました。

WAKA

主婦起業コンサルタント。二児の母。「好きな時に、好きな場所で、好きなことをする！」がモットー。仕事と育児をバランス良く楽しみたい！福岡出身、千葉在住。
詳しいプロフィール→こちら☆