SyntaxHighlighter Evolved : ソースコードを美しく表示するプラグイン
いつかどこかのサイトで見たきれいなコード表示が忘れられず、「WordPress」「コード」「美しく表示」などのキーワードで検索してみると、ありました! このブログは先日公開されたばかりの WordPress 2.8 を使っていますが、うまく動くかな?と試しに入れてみると、問題なく動作しました。
- SyntaxHighlighter Evolved
-
ソースコードを美しく表示するプラグイン
配布元:SyntaxHighlighter Evolved 2.1.0
使い方
配布元より、SyntaxHighlighter Evolved 2.1.0をダウンロードします。(syntaxhighlighter.zip)
解凍すると「syntaxhighlighter」というフォルダが展開されるので、フォルダごと wp-content/plugins にアップロードします。
「プラグイン」の画面で、「SyntaxHighlighter Evolved」を有効化します。(※「使用する」をクリック)
これで、
[指定言語]ソースコード[/指定言語]
というようにくくると、指定言語に合った表示をしてくれます。
[php]PHPソースコード[/php]
[css]CSSソースコード[/css]
[js]Javascriptソースコード[/js]
扱えるソースコードはこの他にもたくさんあり、上記参考サイトでより詳しく説明されています。
また、ハイライトにしたり、自動改行させない指定などは、以下のように記述できます。
[php highlight="3"]
<!DOCTYPE html>
<html <?php language_attributes(); ?> class="no-js">
<head>
<meta charset="<?php bloginfo('charset'); ?>">
<meta name="viewport" content="width=device-width">
<link rel="profile" href="http://gmpg.org/xfn/11">
<title><?php wp_title(); ?></title>
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>">
<?php wp_head(); ?>
</head>
注意点
配布元のサイトにも記されていますが、このプラグインにはテーマの header.php に <?php wp_head(); ?>
、footer.php に <?php wp_footer(); ?>
が必要になります。入っていないと動きません。