Mathjax Latex を使用すると、数式が綺麗に表示できます。
ちょっと残念な点は、この数式が「中央揃え」になることです。

通常、ノートの中央に数式を書くことはないですよね。
と言うことで、左揃えにする方法をググって
「MathJax – 数式を左寄せにする方法」
の、「CSSによる左寄せ」を参考にさせてもらいました。
（Latexのコマンドは使用できないようです。）

テーマのCSSを直接変更すると、テーマのバージョンアップの都度
CSSを変更しなければならないので、子テーマにCSSを設定する
事にしました。

【子テーマの作成】

次の手順に従います。

• 子テーマディレクトリ
• style.css
• functions.php

(1) 子テーマディレクトリ

http://hoge/huga/wp-content/themes/ の下に、

twentyseventeen-child（テーマが twentyseventeen の場合）

と言うディレクトリを作成する。
（自分が使用しているテーマに合わせ、変更してください。）

(2) style.css の作成

テーマが twentyseventeen の場合、次のように作成する。

/*
 Theme Name:   Twenty Seventeen Child
 Theme URI:    http://hoge/huga/wp-content/themes/twentyseventeen-child/
 Description:  Twenty Seventeen Child Theme
 Author:       your-name
 Author URI:   http://hoge
 Template:     twentyseventeen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twenty-seventeen-child
*/
body{
font-family:"Meiryo UI", “メイリオ”, Meiryo, “ヒラギノ角ゴ Pro W3″, “Hiragino Kaku Gothic Pro”, sans-serif;
}
/* Mathjax Latex : left-align */
.MathJax_Display {
  text-align:  left !important;
  text-indent: 1em  !important;
}

(3) functions.php の作成

各テーマ共通です。

<?php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array('parent-style')
    );
}

?>

Mathjax Latex のインストールについては、下の参考リンクを見てください。
参考リンク：http://webshufu.com/mathjax-latex/

数式を表示するには、[mathjax]をロードする必要がありますので
数式の直前に[mathjax]を使指定してください。

[mathjax]
$$(三角形の面積)=\frac{(底辺)\times(高さ)}{2}$$

2つ目以降の式には、[mathjax]をロードする必要はありません。

【例1】

[mathjax]
$$(三角形の面積)=\frac{(底辺)\times(高さ)}{2}$$

$$(三角形の面積)=\frac{(底辺)\times(高さ)}{2}$$

【例2】

$$N=\frac{r(r+1)^{n} }{(r+1)^{n}-1}$$

$$N=\frac{r(r+1)^{n} }{(r+1)^{n}-1}$$

【例3】インライン表示

[latex]式[/latex] を使用すると、インライン表示 [latex]E=mc^2[/latex] も可能です。

[latex]式[/latex] を使用すると、インライン表示 \(E=mc^2\) も可能です。

正式にはサポートされなくなった(?)のか
Pluginが消えてしまった。

仕方がないので、Pukiwiki-1.4.7で使用していたPluginを
そのまま使用してみた。

【導入手順】
(1) プラグイン sh.inc.phpをダウンロードし、解凍後、
Pukiwikiのpluginフォルダに配置してください。
（なお、このプラグインは、現在リンク切れになっているので、筆者のパソコンに設定してあったものです。
利用する場合は、自己責任でどうぞ）
(3) SyntaxHighlighterをダウンロードし、解凍します。
解凍したフォルダ内の「scripts」、「styles」の両フォルダを、pukiwiki フォルダ内の skin/sh フォルダにそのままコピーします。
(4) pukiwiki.ini.php の56行目付近を次のように変更します。

//define('PKWKEXP_DISABLE_MULTILINE_PLUGIN_HACK', 1); // 1 = Disabled この行をコメントアウトします
define('PKWKEXP_DISABLE_MULTILINE_PLUGIN_HACK', 0); // 1 = Disabled　 この行を追加します

これで、ハイライト表示が可能になるが、見映えを改善するため
pukiwiki 内の、skin/sh/styles にある「shCore.css」に次の変更を加えます。

(1) 表示領域の右側に、無条件に縦スクロールバーが表示されるので
それを表示しないようにする

55行目付近

.syntaxhighlighter {
  width: 100% !important;
  margin: 1em 0 1em 0 !important;
  position: relative !important;
  overflow: auto !important;
  font-size: 1em !important;
  overflow-y: hidden !important;  /* この行を追加する */
}

(2) フォントスタイルを変更する

47行目付近

font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;

に

font-family: "Meiry UI",メイリオ,"Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;

好みのフォントを追加する。

【使い方】

#sh(brush){{

ここにコードを配置する

}}

brush の種類は、こちら を見てください。

コードを変換(UTF-8へ)

ubuntu(bash)において、拡張子が .html のファイルのエンコードをEUCからUTF-8へ変換する。

find -name "*.html" | xargs nkf --overtwrite -w

文字コード

-j : ISO-2022-JP

-s : Shify-JIS

-e : EUC-JP

-w : UTF-8

「charset=euc-jp」を含む行の削除

# 3行目を削除し上書き保存する
sed -i -e "3d" *.html

# 複数行を削除する場合の例
# 5～10行目を削除し上書き保存する
sed -i -e "5,10d" *.html

「charset=”UTF-8″」を追加

# 3行目に追加する
sed -i -e '3i <meta charset="utf-8">' *.html

# PHPのDOMを使用する場合は次のようにする
sed -i -e '3i <meta http-equiv="content-type" content="text/html; charset=utf-8" />' *.html