難でもアリ: Bloggerでsyntaxhighlighter表示してみた

2015年6月2日火曜日

syntaxhighlighter version 3.0.83をdownload
落としてきたzipを解凍する
必要なcss(stylesフォルダ内の最低１つ以上)
必要なjs(scriptsフォルダ内)
- shCore.js(必須)
- shAutoloader.js(任意だが今回の例では必要)
- shBrushJScript.js(任意) 他にもcss php sql vb perl delphiと色々あるが必要分だけでok
cssとjsをGoogleDriveにUpload
（他にもupload先はGoogle Apps Site等でも可能そうですがとりあえず）
uploadしたファイルを共有します（オン･ウェブ上で一般公開）

Bloggerのテンプレートをhtmlで編集します。

    <head>の上部に記載（他のCSSより上）

<head>



</head>

    </body>の直前に記載


</body>

Bloggerのテンプレート保存をします
これでとりあえず完了です
あとは以下のようにhtmlコードを投稿してみます

<pre class="brush:html;" title="htmlサンプル">
<head>
<title>ほげほげ</title>
</head>
<body>

</body>
</pre>

classの値をbrush:js とすればJavaScriptでの表示になります
あとはuploadしたcssを細かく調整していくのみです
これが大変でした。。

新しいコメントは書き込めません。