はてなブログでもソースコードのシンタックスハイライトがしたい

はてなブログに引っ越してきて、最もやりたかったのが掲題の件です。

身辺の慌ただしさもようやく落ち着いてきたので、色々と試してみましたのですが、なかなか思うようにできません。

<pre>タグと<code>タグでソースコードを囲むまではすぐにできたのですが、既定値の改行やHTML編集モードでのシンタックスハイライトの記述で躓きました。

色々調べたところ、なんとか自分なりにもできるようになりました。

参考になったのはこちらの記事です。

有益な情報、ありがとうございます。

....

ちなみに、現在のCSSはこんな感じです。
背景とかファイル名とか、色々と試してみたいことはありますが、まずはここまでにしておきます。

.entry-content p {
  margin: 0.1;
  line-height: 1.6;
}

.entry-content pre {
  line-height: 1.4 !important;
}

Qt Creator のシンタックスハイライトに合わせられれば最高なのですが、そこまで望みません。はてなブログで用意されているシンタックスハイライトのままでも今までより可読性が上がって満足です。

せっかくなので、引っ越してきてからの記事は修正しました。

....

ココログでも可能だったもしれませんが、当時は諦めてました。

そもそもベーシックプランで選択できるテンプレートは少なく、好みのものがありません。とりあえず使ってたデザインにシンタックスハイライトされたソースコードを貼り付けたら、これが合わない。

違和感しかないなら、別の方法を...ということで、当時は引用（<blockquote>タグ）ばかり使用してました。

一瞬、過去記事にも適用しようとも思いましたが、影響範囲が広いので諦めました。

刹那（せつな）の瞬き