WP plugin: コード表示&部分強調表示 – SyntaxHighlighter Evolved 2.3.7
Responses:
- No Responses yet
- コメントをどうぞ
- Trackback URI
- RSS 2.0: 更新情報
- RSS 2.0: Comments
記事内でコードを表示する際、その中の変更個所などを強調表示したいがために、<pre><code> タグと [dec]、<em>、<strong> などを自分で組み合わせて書いてきた(強調不要なときはさくっと markdown)。
でももう疲れてきちゃったので、一部分を強調表示できそうなプラグインを探し、SyntaxHighlighter Evolved 2.3.7 を試してみた。
行番号とか色分け表示もいいよね!と、わくわくしながらコードを書くと、ぼにょ家最重要プラグイン PHP Markdown とがっつりコンフリクト。orz
という、悲しいお話です。。(・;)
| 機能概要 |
記事内に書くコードをプログラミング言語に合わせて色分け表示、部分的に強調表示が可能。 |
|---|---|
| バージョン | 2.3.7 (2010-1-4) |
| 作者(web) | Viper007Bond さま、Automattic |
| 配布元 | WordPress プラグインディレクトリ › SyntaxHighlighter Evolved |
| ドキュメント |
|
| 動作見本 | Viper007Bond.com » My WordPress Plugins » SyntaxHighlighter Evolved |
| 「ページ」対応 | |
| 適用したWP | WordPress 2.9.1 [UTF-8] 1 |
導入手順
管理パネルからインストールしようとしたら、実行ファイル名が変わったらしく、一度目はセーフモードが原因で失敗。wp-admin/.htaccess を直して二度目は成功。
失敗編
- Plugins > Add New 画面を開く
- Term: 「SyntaxHighlighter Evolved」と入力して「Serach Plugins」ボタンをクリック
- 表の右端の「Install」をクリック
- プラグインディレクトリの情報が出たら、赤い「Install Now」をクリック
「Connection Information」(接続情報)画面が出た。
FTP 情報を入力すると、Installing Plugin: SyntaxHighlighter Evolved 2.3.7 Downloading install package from http://downloads.wordpress.org/plugin/syntaxhighlighter.zip.
Warning: touch() [function.touch]: SAFE MODE Restriction in effect. The script whose uid is 10266 is not allowed to access /tmp owned by uid 0 in /*****/public_html/wp/wp-admin/includes/file.php on line 184
Download failed. Could not create Temporary file
成功編
wp-admin/.htaccess を修正。
該当部分:
# 2.7 時代のをコメントアウト
# <Files plugin-install.php>
# AddHandler application/x-httpd-phpcgi .php
# </Files>
# 2.9
<Files update.php>
AddHandler application/x-httpd-phpcgi .php
</Files>
- Plugins > Add New 画面を開く
- Term: 「SyntaxHighlighter Evolved」と入力して「Serach Plugins」ボタンをクリック
- 表の右端の「Install」をクリック
プラグインディレクトリの情報が出たら、赤い「Install Now」をクリック
Installing Plugin: SyntaxHighlighter Evolved 2.3.7
Downloading install package from http://downloads.wordpress.org/plugin/syntaxhighlighter.zip.
Unpacking the package.
Installing the plugin.
Successfully installed the plugin SyntaxHighlighter Evolved 2.3.7.
Actions: Activate Plugin | Return to Plugin Installer
Activate
サーバには wp-content/plugins/syntaxhighlighter ディレクトリが出来てた。
設定
Settings > SyntaxHighlighter 画面にて
Markdown と衝突
例えば、上の .htaccess をこのプラグインを使って書くと、先に Markdown マークアップの展開が行なわれてしまう。↓
寂しかったのでつい、行強調してみましたとも。
フック順を変えればよさそうな気もするけど。。。
markdown/markdown.php
if (MARKDOWN_WP_POSTS) {
remove_filter('the_content', 'wpautop');
remove_filter('the_content_rss', 'wpautop');
remove_filter('the_excerpt', 'wpautop');
add_filter('the_content', 'mdwp_MarkdownPost', 6);
add_filter('the_content_rss', 'mdwp_MarkdownPost', 6);
add_filter('get_the_excerpt', 'mdwp_MarkdownPost', 6);
add_filter('get_the_excerpt', 'trim', 7);
add_filter('the_excerpt', 'mdwp_add_p');
add_filter('the_excerpt_rss', 'mdwp_strip_p');
remove_filter('content_save_pre', 'balanceTags', 50);
remove_filter('excerpt_save_pre', 'balanceTags', 50);
add_filter('the_content', 'balanceTags', 50);
add_filter('get_the_excerpt', 'balanceTags', 9);
}
syntaxhighlighter/syntaxhighlighter.php
// Register generic hooks
add_filter( 'the_content', array(&$this, 'parse_shortcodes'), 7 );
add_action( 'admin_menu', array(&$this, 'register_settings_page') ); // Not is_admin() only for my admin bar plugin + others
// Admin hooks
add_action( 'admin_init', array(&$this, 'register_setting') );
add_action( 'admin_head', array(&$this, 'output_shortcodes_for_tinymce') );
add_action( 'admin_footer', array(&$this, 'maybe_output_scripts'), 15 ); // For comments
add_filter( 'mce_external_plugins', array(&$this, 'add_tinymce_plugin') );
add_filter( 'tiny_mce_version', array(&$this, 'break_tinymce_cache') );
add_filter( 'the_editor_content', array(&$this, 'the_editor_content'), 1 );
add_filter( 'content_save_pre', array(&$this, 'encode_shortcode_contents_slashed_noquickedit'), 1 );
add_filter( 'save_post', array(&$this, 'mark_as_encoded'), 10, 2 );
add_filter( 'plugin_action_links', array(&$this, 'settings_link'), 10, 2 );
// Register comment hooks
add_filter( 'comment_edit_pre', array(&$this, 'decode_shortcode_contents'), 1 );
add_filter( 'pre_comment_content', array(&$this, 'encode_shortcode_contents_slashed'), 1 );
add_filter( 'comment_text', array(&$this, 'parse_shortcodes_comment'), 7 );
// Register widget hooks
// Requires change added in WordPress 2.9
if ( class_exists('WP_Embed') ) {
add_filter( 'widget_text', array(&$this, 'widget_text_output'), 7, 2 );
add_filter( 'widget_update_callback', array(&$this, 'widget_text_save'), 1, 4 );
add_filter( 'widget_form_callback', array(&$this, 'widget_text_form'), 1, 2 );
}
// Frontend stuff
add_action( 'wp_footer', array(&$this, 'maybe_output_scripts'), 15 );
// No longer works since JS adds CSS after this
// Perhaps it's better if the code fontsize matches the blog fontsize...
//add_action( 'wp_head', array(&$this, 'enforce_font_size') );
To-do
- フック順を変えて上手くいくか。どちらを何に変えるのがよいか。
- プラグインのソースを直にさわらずに変更できないか。
remove_filterとか?
(つづく)
-
WordPressファイル一式はサブディレクトリに置き、訪問者のアクセスはドキュメントルートになるよう設定。参照: Giving WordPress Its Own Directory ↩
