はてなブログでソースコードの見た目を編集

はてなブログではてなダイアリーのスーパーpre記法がすべての言語に対応したようだ。アクセス解析で見られるデータを過去30日分に増やしました - はてなブログ開発ブログ
試してみる。まずは、はてな記法を利用可にする。

「見たままモード」から「はてな記法モード」へ

ブログの管理画面→[設定]→[編集モード]で「はてな記法モード」にチェック→[変更する]ボタンをクリック

はてな記法でソースコードを入力

「Hello, World!」のJavaソースを>|java|〜||<で囲んで、

 >|java|
 public static void main(String args[]){
    System.out.printf("%s","Hello, World!");
 }
 ||<

とすると、

public static void main(String args[]){
   System.out.printf("%s","Hello, World!");
}

のようにシンタックスハイライトされる。

CSSでフォントサイズ変更

ブログの管理画面→[デザイン]→[カスタマイズ]→[デザインCSS]に以下を記入

div.section pre.code{
   font-size: 80%
}

こうするとソースコードのフォントサイズが80%の大きさで表示される（ここでの表示が80％です）。