HOME   »   TeX  »  MathJaxを利用してFC2ブログにTeX形式で数式を記述する方法
RSSフィード
このブログ(FC2ブログ)で数式を埋め込む記事を書く予定が出来ました。

TeX形式を利用せずに普通に書くとなると、文字の種類も足りないですし、何よりも見た目が悪いです。

そこで考えられる手段が2通り。
  1. TeXで書いた式をスクリーンショットに取って貼付ける
  2. TeX形式で記述する

1番目の方法だと、あとでちょこっと数式を変更したい時に、スクリーンショットを取り直す必要があります。

2番目の方法ならばちょこっとした修正が楽です。

なんとか2番目の方法で行えないかと色々と探しまわっていた所、可能な方法にたどり着きました。

MathJaxを使う方法です。

ざっくりとした使い方を説明しますと、
  1. 3行ほどのscriptをブログテンプレートのheadタグ内に記述する
  2. 本文の中で、TeXのように記述する
これがいくつかあるうちの中でベストな選択だと判断しました。
mathjax-tex

スポンサーリンク

MathJaxを利用してFC2ブログにTeX形式で数式を記述する方法

先ほども説明しましたが、手順の流れの確認です。
  1. 3行ほどのscriptをブログテンプレートのheadタグ内に記述する
  2. 本文の中で、TeXのように記述する

それでは具体的にこの手順を説明していきます。

headタグ内にコードを埋め込む

まずは、以下のscriptをFC2ブログのテンプレートの</head>タグ直前にコードを埋めました。
<script type="text/javascript"  src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML"></script>

本文の中で、TeXのように記述する

準備はできたので、あとは実際に本文中にTeX形式で数式を記述していくだけです。

気をつける点は、開始タグと終了タグです。

例として、以下の画像を表示してみます。
\[\sum_{n=1}^\infty \frac{1}{n^2} = \frac{\pi^2}{6} \tag{3}\]


このコードを表示するためには、以下のように本文中に記述しました。
\[\sum_{n=1}^\infty \frac{1}{n^2} = \frac{\pi^2}{6} \tag{3}\]


これで数式が表示できる事は分かりました。

ただ、このままだと数式と文章の区別がつきにくいです。

そこで、通常の文章と区別がつくように、装飾をしてみます。

divタグで囲んでみた

まずは準備として、数式をdivで囲み、classをtexcodeとしてみました。
<div class="texcode">\[\sum_{n=1}^\infty \frac{1}{n^2} = \frac{\pi^2}{6} \tag{3}\]</div>

classに色々指定してみた

今つけたtexcodeの装飾をするために、スタイルシート(CSS)に以下の記述を追加してみました。

.texcode{
border: solid 1px;
}

mathjax-tex
▲枠線がつきました。

背景もちょこっといじってみます。

先ほどのCSSの記述を以下のように変更しました。

.texcode{
border: solid 1px;
background-color: #fffff0;
}

mathjax-tex
▲すると、枠線で囲まれた部分に背景色を付ける事が出来ました。

MathJax形式で記述した数式をリアルタイムでプレビューできるページ

MathJax形式で数式を記述している際、このコードで合っているのかということが不安になると思います。

そのような時には、リアルタイムでプレビューできるページを利用しましょう。

そのサイトが以下になります。
リアルタイムプレビューできるページ。
Live Preview of MathJax Type Setting

mathjax-tex

このサイトで数式の見栄えを確認してから、FC2ブログで本文を編集した方が良さそうです。

まとめ

これでFC2ブログにおいて、TeX形式で数式を記述する事が出来るようになりました。見やすくていいですね。

参考:MathJaxの使い方

関連記事

TeXの各種記号コマンド覚え書き一編

TeXの数式コマンド覚え書き一覧

画像内の文章や数式をTeX・Word形式に変換出来るMoshaが凄い!

Pastebotを利用して、MathPadで作成したLaTeX形式の数式をiPhoneからMacへペーストする具体的な手順

手書きで書いた数式を画像やLaTeX形式に保存できるiPhoneアプリ「MyScript MathPad」

Mac MavericksでTeXを導入する方法

TeXで目的の場所に適切な大きさで図を貼る方法

TeXの図番号(figure環境)を途中から始めたい時の解決方法

TeXの表作成ジェネレーター(csv2tabular)を活用して表を作る方法

TeXでレポートを書くならTextExpanderを併用した方が良い理由を解説

TeX用にTextExpanderに登録しているコマンド一覧

MacでLaTeXiTをインストールする方法・使い方

Macのターミナルを使ってjpg、png形式からeps形式へ変換する方法

LaTeX2ε美文書作成入門付属のDVDからMacへTeXをインストールした

スポンサーリンク

過去記事セレクション

当ブログの過去記事の中で、オススメの記事25個をまとめたページを作成しました。500記事を超えた中から厳選していますので、どれもオススメできる記事となっています。もしも興味がありましたら、是非一度ご覧ください。
公開記事が500を超えたので、過去記事の中からオススメを25個セレクトしてみました



▼このカテゴリの最新記事
Relate Entry
Entry TAG
TeX   FC2ブログ   数式  
Comment
Trackback
Comment form
スポンサードリンク
楽天
2014年7月現在使用しているブログ用iPhoneアプリ16個
iPhoneホーム画面
人気エントリー
先月の人気記事
第1位(→0)
iPhoneにある写真(画像)をセブンイレブンで現像する方法

第2位(→4)
総計290個以上掲載!iPhoneアプリのURLスキーム一覧

第3位(↗︎2)
【iPhone】秘密の質問を忘れたのでAppleのサポートに電話してリセットしてもらった

第4位(↘︎2)
理系大学生なら絶対覚えておくべきWordの数式のショートカット

第5位(↘︎1)
iPhoneのパスコードを10回間違えると再入力までに60分必要

第6位(↘︎1)
SoftbankのiPhone4s→iPhone5sへ機種変更した時の料金試算

第7位(↗︎3)
iPhoneの画面を録画できるMac・Windowsアプリ「Reflector」のインストール方法・使い方

第8位(↘︎4)
iPhone/iPadのパスコードロックを10回間違えた時のデータ消去機能を実行してみた

第9位(↗︎4)
xRecというiPhone画面を録画できるアプリが再び登場!

第10位(↘︎2)
【iPhone】秘密の質問を忘れて間違えすぎるとApple IDが8時間ロックされる

第11位(→0)
iPhoneの写真を1枚5円で現像出来るネットプリントジャパン!

第12位(→0)
パラメータ有りiPhoneアプリのURLスキーム一覧

第13位(↗︎30)
青春18切符で東京から大阪へ~東海道線を突っ走る旅(1日目)

第14位(↗︎55)
青春18切符を利用した旅行時に活躍したiPhoneアプリのまとめ

第15位(↗︎16)
セリアでiPhoneの防水ケースを購入!風呂場で使うときに便利!

全記事表示リンク
サイト内検索
プロフィール

nasimeya

Author:nasimeya
Twitterアカウント→@nasimeya
iPhone5S/iPad3/iPad mini/MacBookAir13inch/Nexus5を現在所持しており、アプリとか紹介を主にしています。LAMYなど文房具もちょくちょく。ブログは楽しく書くことを心掛けております。

日にの観察ブログの更新は停止しています。

新しいブログはこちら⇒なしめやブログ(http://nasimeyablog.com

2013年5月現在利用している主力iPhoneアプリ26個
iPhoneホーム画面
2013年5月現在利用しているブログ用iPhoneアプリ13個
iPhoneホーム画面
iPad mini用おすすめアプリ8選

PAGE TOP