カテゴリー
Develop 未分類

movabletypeにSyntaxHighlighterを追加

上に記述されたソースコードを整形、強調表示してくれるJSライブラリSyntaxHighlighterを、MT5にインストール。
MT3の時から利用していたが、しばらくみないうちに連携によるコピペの機能などが割愛され、完全JS駆動になっておりました。(展開などが理由でしょうけど)
で、MT4のプラグイン化されたものがあり、これを使うと記事のフォーマットから制御できるらしい。
SyntaxHighlighter for Movable Type | kwLog
そうではあるが、コード部分の指定労力が最新版のと大差ない感じだったので、本家の最新版をインストール。
インストールは特に悩むことも無く、JSとCSSを一式アップロード。
利用する言語のブラシJSだけを読み込み処理して、Styleも適当に。
これでわり。
ただなぜか縦スクロールが表示されて不格好な感じになっていたので、CSSを以下のように調整。
これで縦スクロールはでなくなった。(どっかの外人がoverflow-y: hidden !important;だ!とかいていたけど・・)

/* syntaxhighlighter */
.syntaxhighlighter {
margin: -1rem 0 1rem 0 !important;
-size: 1.4rem !important;
padding: 1rem 0;
}