ソースコードを表示するプラグイン

ページ番号: 1 2 3

プログラムのお勉強をしていると、WEBサイトを検索してサンプルソースを探すことが多々あります

■サンプルソースって見たことあります?

広告

そんな時に、サンプルソースを表示する方式がいくつかあるのですが、サンプルソースと他の記事の文章が分けられていると、見やすいですよねー!?

更に、強調表示されていたり、行数が表示されていると、説明文を読むのも(おそらく、書くのも)便利で読みやすいですよねー!?

この下にある、こういうやつねーw

というわけで!そのサンプルソースを見やすくしてくれる!そんなプラグインを紹介しましょ!

広告

■Crayon Syntax Highlighter

それがこのー「Crayon Syntax Highlighter」です!

ソースコードを表示するプラグイン 1

ソースコードがこんな風に表示できます!見たことありますよね?(上のを画像にしただけwww)

ソースコードを表示するプラグイン 2
Crayon Syntax Highlighterで書いてみる

更にマウスカーソルをこのコードに持っていくと、こんな風にツールバーが表示されます!(上のやつにマウスカーソルあててみそ!)

ソースコードを表示するプラグイン 3
Crayon Syntax Highlighterのツールバー

しかし、このプラグインは、WordPressの旧エディタにしか対応していないようですねー!?ビジュアルエディタでは、ブロックが出てこないです・・

■ビジュアルエディタのソースコードブロック

ちなみに、ビジュアルエディタの通常のソースコードのブロックを使ってみると、こんな感じです

ソースコードを表示するプラグイン 4
ビジュアルエディタのソースコードブロック
ソースコードを表示するプラグイン 5
追加されたブロックを表示したらこんな感じ

そして、 「Crayon Syntax Highlighter」 を有効化すると、上の通常のソースコードブロックの部分が、こんな風に変化しますが、 HTML表記が化けて しまっています

ソースコードを表示するプラグイン 6
ビジュアルエディタのソースコードブロック でプラグインを有効化
ソースコードを表示するプラグイン 7
ビジュアルエディタのソースコードブロック でツールバー表示

ソースのタイトルも表示できていないですし、やはり、 旧エディタ で書くしかなさそうですなー

でもー?旧エディタって???

シェア
広告
ページ番号: 1 2 3

やもす ʕ•͡-•ʔ

のんびり!のほほん!がモットーです!w 蕎麦食いたい ライブ行きたい 暑いの嫌い