今回はcocoonで綺麗に数式を表示する方法をご紹介します。
これを読めば、無料のコクーンテーマを使用している方もブログで、
\[c^{2}= a^{2} + b^{2}\]
のように三平方の定理とかを書くことができます。
数式の書き方
まず、Mathjax-LaTeXというプラグインをインストールします。
LaTeXのように数式コードを書けばきれいに数式が表示できるプラグインです。
ダッシュボードから「プラグイン」を選択し、「新規追加」をクリックしましょう。
新規追加の画面に映ったら、画面右上にプラグインの検索と書かれている検索窓があるので、そこに「Mathjax-Latex」と入力します。
こういうのです。
インストール後に有効化します。
無事に有効化をし終わったら、ダッシュボードから「プラグイン」→「インストール済みプラグイン」へ移動します。
「Mathjax-Latex」があります。
そこに設定のタブがあるので、そこをクリックします。
設定はこんな感じ。
そしてMathjaxを使いたい投稿ページの一番上に、
とショートコードを挿入して、これからMathjaxを使いますという宣言をします。
これでcocoonで、ブログ上に数式を表示することができます。
以上です。
たとえば、編集画面のビジュアルのところに
\[x = -\frac{b}{a}\]
と、書くと、
\[x = -\frac{b}{a}\]
が表示されます。
他にも、
\[ y = ax +b \]
と書くと、
\[y=ax+b\]
が表示されます。
こんな難しい数式まで。
$$ \mathrm{R}_{k}=\frac{1}{N}\sum_{1=0}^{N-1}f_{l}\mathrm{c}\mathrm{o}\mathrm{s}\frac{2\pi\lambda}{N}$$
$$ \mathrm{R}_{k}=\frac{1}{N}\sum_{1=0}^{N-1}f_{l}\mathrm{c}\mathrm{o}\mathrm{s}\frac{2\pi\lambda}{N}$$
"\[数式\]"でも"$$数式$$"でも表示することができます。
ただ、問題なのが、ビジュアルのとこに
\[y = ax +b \]
と書いてもビジュアル内では数式は表示されることなく、ただの文字列が表示されます。
しかし、プレビューをクリックして、確認してみるとちゃんと数式が書かれているので大丈夫です。
他のサイトだと、子テーマをいじったり、ショートコードを追加して数式を表示する方法が載っていたのですが、なぜか僕の場合うまくいかなかったのでこの方法になりました。
もし、数式を真ん中ではなく左詰めしたい場合は、下記のコードを Style.css に追加すれば数式が左に寄ります。
.MathJax_Display {
text-align: left !important;
text-indent: 0em !important;
}
LaTeXでの数式の書き方は調べれば簡単に出てきます。
以上、cocoonでの数式の書き方でした。
もし他にいい方法を知っている方いらっしゃれば教えてくれると助かります。
コメント