SyntaxHighlighterの設定変更でソースコードを見やすくできた

このブログでは、以前からSyntaxHighlighterを導入してます。

※SyntaxHighlighterとは
開発言語に合わせて
構文の色分け表示（シンタックスハイライト）をしてくれるJavaScript。

SyntaxHighlighterは、preタグを使うのだが
ココログ、3月のリニューアルからpreタグが使いづらくなってるのよね。

preタグ内の改行にさらにbrタグを付けたり、
空行をpタグに変換するのは、いただけない…(-_-;)

2019/09/24に調べてみたところ
既に報告されている問題のようだ。

けど、3月から状況は変わっていないので、
preタグ内は「改行HTMLタグ変換」しないでと要望を出した。

リニューアル前にできていた無駄な改行を抜く方法もできなくて
ユーザー側では対処できないと思ったからだ。

でも、日曜日に自分のブログ過去記事を見てて
別件でSyntaxHighlighterってデフォルトじゃLua対応してないよなぁ…
ってことからSyntaxHighlighterを調べていたら
この問題をSyntaxHighlighterの設定で解消できることが分かった！(・∀・)

うちでは、以下の2行に直すことにした。

SyntaxHighlighter.config.bloggerMode = false;

SyntaxHighlighter.config.stripBrs = true;

2行目のstripBrsというのが、brタグを無視するという設定だ。
で、この設定を直す時の調べ物で
1行目のbloggerModeをtrueにしてたのが間違いと気づいた。

bloggerModeは、
bloggerってブログを使っているかのフラグだった(´・ω・｀)

SyntaxHighlighter導入時にブログの記事を書いてないので
詳細は分からんが、SyntaxHighlighter導入時、
bloggerModeを「ブログを使っている場合」と思ったのだろう。

導入時に下記のことをしてたみたい。

SyntaxHighlighter関連箇所を変えやすいように
ココログでCommonHeadというテンプレートを作った。

ブログに書いていないから、まるで覚えてなかったが
ちゃんとLuaにも対応しようとしてたみたい（笑）

でも、Lua対応は、うまくいかなくて挫折したっぽいね…(-_-;)

長くなるのでLua対応については、次の記事にする。

SyntaxHighlighterのことをブログに書いていなかったから、
今回改めて調べ直すことになり、実質２度手間になった。

が、結果的に「気になっていたところが解消されて良かった」
ということにしよう(・∀・)

■前述の2行を設定前（余分な改行がある）

■前述の2行を設定後（余分な改行がない）