よしけんです。
ブログを活動報告という形ではじめるにあたり、
サイト上でソースコードをきれいに出しておきたい！
と思っていました。
で、PHPで書いたサイトなどで以前から使っていた
Syntax Highlighter(JavaScript&CSS)をブログに適用させる事にしました。
通常のサイトと違って、どこにスクリプトを配置するのか全然わからなかったので
苦労しました。
まずGoogleでキーワードを「 blogger syntax highlighter 」
で検索してみると、以下のサイトでSyntax Highlighter 1.5の
利用事例がありました。
"クリボウの Blogger Tips: コードをハイライトする「Blogger Syntax Highlighter」ウィジェット":http://bit.ly/o0k4rg
結論から行くと、このサイトの紹介は2011年8月時点では使えません。
htmlファイルとして保存されたウィジェットへのボタンが、
クロスサイトスクリプティングあたるとして実行できません。
（Windows XP + Internet Explorer 8環境でためしたがダメで、
IE7以下ならうまく実行できるようです。）
結局、以下のサイトの紹介でうまくいきました。
"net3: Blogger でコードをシンタックスハイライトする":http://bit.ly/nIr5Rt
簡単に説明すると、以下のサイトの画面の下方にあるScript Generatorでハイライトさせたいソースのプログラム言語を選び、スクリプトをコピペします。
"How to Add Syntax Highlighter(v3) to Blogger Blogs ~ Blogger Widgets | Tips | Trick | Hacks | Help! ~ Way2Blogging":http://bit.ly/nUBwn0
これを「デザイン」タブの「HTMLの編集」で表示されるXSLスタイルシートの中に貼付けます。
※<head></head>の中に、できれば</head>の真上にしたほうが良い。
ブラウザのフォーム上で、直接読み書きするともとの状態に戻らない可能性もあるので
「デザイン」タブの「テンプレートをすべてダウンロード」をクリックして、テンプレートのXMLファイルをパソコンに保存し、テキストエディタで別名に保存して編集するといいと思います。
0 件のコメント:
コメントを投稿