ブログにソースコードをシンタックス付きで載せたい(._.)φ

よくブログ内にソースコードをシンタックス付きで載せているのを見かけます。

ブログにソースコードを載せるときに、せっかくなら綺麗に載せたいなってことからはてなブログでもそれができるのか調べることに。

スーパーpre記法

どうやらはてなブログではスーパーpre記法という方法で記載できるらしい

help.hatenablog.com

ふむふむ(._.)φ
なるほどね。じゃあ早速やってみよう。

と思って、入れてみたけど全然できねー(-.-#)って思ったらどうやら、「HTML編集」や「編集みたまま」にぶちこんでもダメらしい。。。
そりゃそうか。。。HTMLの書き方じゃないもんね(赤面)

「編集はてな記法」で記載する必要があるそう。

以下手順

①「編集はてな記法」の設定

はてなブログのダッシュボードの「設定」から編集モードで「はてな記法モード」を選択するだけ

②スーパーpre記法

ブログ中のソースを「>||」 ~ 「 ||<」で挟む。
ちなみに「>||」の部分は「>|ruby|」って記載することで、言語を指定してシンタックス付きにできるらしい。

以下 ruby のソースから貼り付け

def stopwatch(time)
  start = Time.now.to_f
  time.times{ |i| yield i}
  Time.now.to_f - start
end

secs = stopwatch(10000) {|i| Math.sqrt(i)}

puts "#{secs}秒かかりました。"

はてな記法 恐ろしいこ子