Highlighter」のプラグインを使用されている方が結構いらっしゃると思います。Highlighter」は、重いとよく聞くことがあり、今回はソースコードを表示するために「highlight.js」を導入してみることにしました。CDNを設置することができます。JavaScriptの呼び出し部分をhead内に書き込むだけで表示することができます。});});</script>※2015年10月30日現在です。以下のサイトにて最新版のCDNのコードをご確認ください。https://highlightjs.org/download/コードの表示方法<pre><code>タグで囲み、HTMLエスケープさせればOKです。target=”_blank”>ひふみブログ</a></code></pre>WordPressでのHTMLエスケープは簡単で、ビジュアルモードでコードを貼り付けテキストモードに表示を切り替えるだけで、簡単に変換してくれます!!「highlight.js」のカスタマイズデザインは、いくつか種類があり、その中から自分好みのデザインを選ぶことが出来ます。「highlight.js」のサイトからCDNをコピーしてきた場合、defaultとなっています。href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.9.1/styles/default.min.css">上記のように「/8.9.1/styles/default.min.css」となっています。以下のサイトで「Styles」を選択し、自分好みのスタイルを探してください。https://highlightjs.org/static/demo/思ったより多くのスタイルがあり、迷うかもしれません。私の場合、いくつか試してみて、「ir_black」のスタイルを選択しています。導入方法は、先ほどのCDNのコード「default」部分を「ir_black」と書き換えるだけでOKです。href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.9.1/styles/ir_black.min.css">スタイルのスペルは、小文字で書く必要があるようです。正しいスペルは以下のサイトで確認してください。hidden;}まとめwordpressで「highlight.js」を使用するには、HTMLエスケープをする必要があり、多少面倒ですが、表示速度は早く使いやすく感じます。【wordpress】でget_postsを使用し、search.phpを作る方法query_postsに関する記事はよく見かけます。親カテゴリー一覧を表示するのはダイナミックサイドバーを使用すれば簡単にできます。descriptionを自作する方法これまで、wordpressを使用したこともなく、いきなりテーマを自作してしまいました。元ITエンジニアとして技術的な備忘録も書いていきます。ひふみ(日月)神示を読みながら日常を考察するブログ。