はてなブログでソースコードを載せるには…？

ソースコードの記載方法アレコレ
スーパーPRE記法
シンタックスハイライト記法
Gistから貼り付ける
HTMLのpreタグやcodeタグ
まとめ

ソースコードの記載方法アレコレ

前回のブログでGoogle スプレッドシートとGoogle Apps Scriptを使ったものを掲載したのだが、ソースコードの記載がちょっと…ってな感じだったので、はてなブログで使えるソースコードの記載方法をいくつか調べてみた。いくつかあるので、そのときそのときで使いわければいいかと思う。

スーパーPRE記法

スーパーPRE記法ははてなブログが公式に用意している記法のひとつで、もっともシンプルかつ簡単に利用できるもの。このブログで使うと背景が黒っぽくなるが、これはテーマに影響されているんだろうか？詳細は不明。

<html><head><title>test</title></head>
<body>This is a pen.</body></html>

入力したコードやはてな記法をそのまま表示する（スーパーpre記法） - はてなダイアリーのヘルプ

シンタックスハイライト記法

シンタックスハイライト記法はてなブログが公式に用意している記法のひとつで、上記のスーパーPRE記法の拡張のようなもの。キレイに色を振ってくれるので、ただのスーパーPRE記法よりも読みやすい。

<html><head><title>test</title></head>
<body>This is a pen.</body></html>

help.hatenablog.com

Gistから貼り付ける

Githubが提供するソースコード公開サービスであるGistというものにあるソースコードを貼り付けることができるようです。プログラムガシガシやってますという人のブログをみると、よく使われていたりします。が、私はGistのアカウントを持っていないので、紹介だけ。
staff.hatenablog.com

Gistだとかっこいいです、ついでに行番号も付与されるので非常にわかりやすい。プログラマではない私からすると、こういう親切なサービスもはてな記法で使えるといいのに…なんて思ってしまう。