Blooger #1：ソースコードを綺麗に載せたい

Bloggerにソースコードを綺麗に載せるには？

手順

SyntaxHighlighter というのを使えば出来るらしいが。
うまくいかない。
もう少し調べてみる。

---

(2019.01.10)
なぜか動くようになった。bloggerのデザインが動的テンプレートだとダメなのかな？ → 未確認

SyntaxHighlighter CDN

https://cdnjs.com/libraries/SyntaxHighlighter
上記リンクから以下のURLをコピーしメモ帳等に貼り付け
(行COPYボタンの▼ボタンより"Copy Script Tag"を選択)
※以下3つは必須

・https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shCore.min.js
  ・https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/styles/shCore.min.css
  ・https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/styles/shThemeDefault.min.css

必要に応じてjsを同じ要領でコピー
(例：bashの場合)

・https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushBash.min.js

以下のJavaScriptを追記 (Bloggerメニューの [テーマ] ＞ [HTMLの編集] でscriptが記載されている辺りに追記)

<script> SyntacHighlighter.config.bloggerMode = true;
  SyntaxHighlighter.all();
</script>
  

使い方

ソースコードを preタグで囲み、preタグのclass属性で "brush:ブラシ別名" の書式で指定
例) htmlのソースコードを表示させる場合

<pre class="brush:html"> … </pre>

ブラシ別名の一覧

使用できるブラシ別名は以下を参照
http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/

※ 次回記事：#2：ブログを丸ごと削除したい

---

Blogger, SyntaxHighlighter