技術系ブログの必需品

WordPress

技術系ブログのほとんどは備忘録が多いと思います。

でも、自分が読むとしてもわかりやすさが大事ですよね。
私が大事だと思っているのは

  • スクリーンショット
  • ソースコード

ですね。
今回は技術系ブログでソースコードをわかりやすく表示するためのプラグイン「SyntaxHighlighter Evolved」です。

名前がわかっているのでWordPressのプラグイン検索から探します。

いつもの通り「いますぐインストール」します。

そしてプラグイン有効化ですね。
コードを[ code ]と[ /code ]で囲うだけで、いい感じに表示してくれます。(codeを囲う括弧内はスペース不要なのでご注意を)

※9/23追記
crayon-syntax-highlighterに置き換えたのでこのコードは「crayon-syntax-highlighter」に置き換えてしまいました。

Hello Worldのソースにしてみました。

おや。。。<が「<」だし、「ダブルコーテーションが「"」になっちゃってますね。
困った。。。と思ったら直りました。
WordPressの記事作成画面で「ビジュアルモード」で書いていると勝手に変換されちゃうみたいです。
テキストモードに変更したら治りました。

さっそく過去の記事もSyntaxHighlighter形式に置き換えます。

WordPress
スポンサーリンク
スポンサーリンク
三日坊主のメモ

コメント

タイトルとURLをコピーしました