ソースコードを美しく見せるJS「SyntaxHighlighter」をFC2ブログに入れてみた
ソースコードをWEB上で公開したい時などに役立つJS「SyntaxHighlighter」をこのブログにも入れてみたんですが、FC2ブログ用に備忘録として残しておきます。
ダウンロード
まずは「SyntaxHighlighter」をダウンロードします。
解凍すると以下の構成になっているので、「Styles」フォルダの「SyntaxHighlighter.css」と「Scripts」フォルダから「shCore」(←必須)とあとは主要な4ファイル(shBrushXml,shBrushCss,shBrushJScript,shBrushPhp)をアップロードしておきます。
- Scripts(shCore,shBrushXml,shBrushCss,shBrushJScript,shBrushPhp)
- Styles(SyntaxHighlighter.css)
- Uncompressed
設定
以下のコードをhead内に記述。SyntaxHighlighter.cssをアップロードしたURLに書き換えてくださいね。
次にbodyタグの上あたりに以下のコードを記述。パスは必要に応じて変更してください。
これで設定完了です。
使用方法
使用する時は、textarea内に表示したいソースコードを記入します。
この記事にトラックバックする(FC2ブログユーザー)
2010/08/18 | Webデザイナーのメモ帳 |
SyntaxHihglighterをFC2に導入
FC2にSyntaxHihglighterを導入してコードをきれいに表示させる方法を紹介します。
2011/03/20 | 日々是憂鬱 |
ソースコードを美しく見せるJS「SyntaxHighlighter」をFC2ブログに入れてみた
ソースコードをWEB上で公開したい時などに役立つJS「SyntaxHighlighter」をこのブログにも入れてみたんですが、FC2ブログ用に備忘録として残しておきます。... ソースコードを美しく見せるJS「SyntaxHighlighter」をFC2ブログに入れてみた
2011/12/18 | つーる亭 |
【備忘録】FC2ブログでまず最初にやるカスタマイズ + FC2ブログでよく使う変数
FC2ブログは個人的によく使うので、新しいブログを立ち上げる時にメモ代わりになるように、比較的よく使うカスタマイズの方法を備忘録的に書き残しておこうと思います。