ワードプレスで表示するソースコードに改行スペースを入れる方法
先日、当サイトのソースコードを見やすく表示するために「Highlighting Code Block」を導入致しました
ワードプレスのプラグインです
「Highlighting Code Block」の詳細についてはこちらをご覧ください
その結果、とっても見やすくコードが表示されるようになり満足しています
ワードプレス上のコードが改行されない問題
ところで、ワードプレスでソースコードを表示する時って、なぜか改行が有効になりません
それは「Highlighting Code Block」だけの問題ではなく、シンタックスハイライターを使っても同様でした
元々のコード
例えばこんなソースコードがあったとします
/* 成功の秘訣コード */
while( result != “success" ){
result = create();
}
ワードプレス上の表示
これをそのまま「Highlighting Code Block」で表示するとこうなります
/* 成功の秘訣コード */
while( result != "success" ){
result = create();
}
はい、改行が消えてスペースが詰まってますよね!

編集時にはちゃんと改行されてるのに、実際に表示されると改行が無くなってしまうんです
ちなみに、シンタックスハイライターでも同様です
/* 成功の秘訣コード */
while( result != "success" ){
result = create();
}
はい、改行が無くなっています
なぜか改行が有効にならず、行が詰められてしまいます
これだけのソースコードだとあまり気になりませんが、数十行に及ぶコードになると見づらいことこの上ないのです
解決方法
改行したい行に空白を挿入する
以上
非常にバカバカしいのですが、単純な方法です
空白スペースを挿入するとこうなります
/* 成功の秘訣コード ↓空白挿入済み! */
while( result != "success" ){
result = create();
}
はい、ちゃんと改行されてますね
改行されてるところにカーソルを合わせて確認してみてください
空白スペースが入ってますでしょ?
設定では変更できない?
ワードプレスの設定とか見ても、改行に関する項目って見当たらないんですよね
しかしソースコードを表示する上で改行は結構重要なファクターです
だって、改行が無かったらとっても見づらいコードになりますから!
ディスカッション
コメント一覧
まだ、コメントがありません