« JavaScript (40) ソースコードの表示 SyntaxHighlighter | トップページ | プログラミング講座(175) LitDev 拡張機能 »

2017/06/14

JavaScript (41) SyntaxHighlighter のカスタマイズ

前回、いろいろ試してうまくいかなかった点がありました。ダウンロードしたバージョンが正しくなかったようです。今回は改めて最初から SyntaxHighlighter 3.0.83 を使って Small Basic のコードをきれいに表示できるようにしてみたいと思います。

SyntaxHighlighter 3.0.83 のダウンロード

GitHub の zip ファイルをダウンロードします。

ファイルのコピー

このうち以下のファイルを自分のサイトにコピーします。
・ styles\shCore.css
・ styles\shThemeEclipse.css
・ scripts\shCore.js
・ scripts\shBrushCss.js
・ scripts\shBrushJScript.js
・ scripts\shBrushVb.js
・ scripts\shBrushXml.js

ココログの設定

ココログの設定 | ブログのサブタイトル の下に以下のコードを設定し、反映します。










VB のブラシを使って SB のプログラムを表示

以下のようなコードをブログに埋め込むと、



For i = 1 To 100
TextWindow.WriteLine("Hello World!")
EndFor

このように表示されます。


For i = 1 To 100
TextWindow.WriteLine("Hello World!")
EndFor

SB のブラシとテーマを作成

作成したブラシ (.shBrushSBjs) とテーマ (shThemeSb.css) をこちらに公開しました。

SB のブラシを使って SB のプログラムを表示

ココログの設定に作成したブラシを追加して以下のようなコードを埋め込むと、



For i = 1 To 100
TextWindow.WriteLine("Hello World!")
EndFor

このように表示されます。


For i = 1 To 100
TextWindow.WriteLine("Hello World!")
EndFor

|

« JavaScript (40) ソースコードの表示 SyntaxHighlighter | トップページ | プログラミング講座(175) LitDev 拡張機能 »

Small Basic」カテゴリの記事

JavaScript」カテゴリの記事

コメント

コメントを書く



(ウェブ上には掲載しません)




トラックバック


この記事へのトラックバック一覧です: JavaScript (41) SyntaxHighlighter のカスタマイズ:

« JavaScript (40) ソースコードの表示 SyntaxHighlighter | トップページ | プログラミング講座(175) LitDev 拡張機能 »