Amazon 初売り

« 「自分のツイートを検索したい」と思い調べたことの覚書 | トップページ | SyntaxHighlighterのLua対応 »

2019.10.09

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

| |コメント (0)

 このエントリーをはてなブックマークに追加

このブログでは、以前から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行を設定前(余分な改行がある)
Photo_20191009151201


■前述の2行を設定後(余分な改行がない)
Photo_20191009151202


 このエントリーをはてなブックマークに追加

| |コメント (0)

このエントリーへのリンク

このエントリーのリンクを入れるHTML:

コメント

このブログの新着コメントをRSSリーダに登録する為のxml




←名前とメールアドレスは必須です。
URLも記入すれば、URLのみが公開されます。
メールアドレスのみですと、メールアドレスが公開されてしまいますので、御注意ください。

↓コメント本文では、「a href」「b」「i」「br/」「p」「strong」「em」「ul」「ol」「li」「blockquote」「pre」のタグが使えます。絵文字をクリックすると、本文にタグを挿入できます。