記事でスーパーpre使ったとき、使用言語も表示してみる

こんな感じの。

毎回カスタマイズに JavaScript 使うのもなんなので、CSSだけでやってみる。
{}デザインCSSのあたりで。必要な言語ぶん追加する。
［はてな記法］ソースコードを色付けして表示する（シンタックス・ハイライト） - はてなブログ ヘルプ

pre[data-lang=html]:before {
  padding: 0 0;
  margin: 0 0;
  display:block;
  background: #777;
  color: #FFF;
  content: ' HTML';
  width: inherit;
  position: relative;
}

pre[data-lang=css]:before {
  padding: 0 0;
  margin: 0 0;
  display:block;
  background: #777;
  color: #FFF;
  content: ' CSS';
  width: inherit;
  position: relative;
}

※ contentプロパティの所と、data-lang=css の＝以降の部分が対応言語です。CSSの属性セレクタに記述する言語名は前掲のヘルプページのように、小文字にしておけばいいようにおもいますが、他の言語を細かくチェックしてませんので、都度、ブラウザのインスペクタで要素を確認すれば確実です。
※ あと、テーマの preのスタイルにもよるので、調整が必要です。