MarsEditで投稿したときに SyntaxHighlighter Evolvedが文字化けしないようにする方法


WordPressにコードを表示させるための神プラグインとして有名な「SyntaxHighlighter Evolved」。

MarsEditからSyntaxHighlighter Evolvedのためのショートコードを投稿したり、予約投稿した際に文字化けすることがあります。

本当によく文字化けするのでその方法をまとめました。

「& amp;」みたいに文字化けする

「& amp;」こんなふうに文字化けする。これを修復します。

ちなみにこの文字化けの正体って?

この文字化けの正体は「HTMLエンティティ」です。記号を正しく記述するため、 &(半角アンパサンド)で始まり ; (半角セミコロン)で終わる記号群です。が、正直人間が見ても意味ワカラン。

関連エントリ:HTML / XHTMLで使用されるエンティティ文字一覧

ソースコードを書き変えればOK

SyntaxHighlighter Evolvedのソースコードを直接書き換えます。

プラグイン > インストール済プラグイン > SyntaxHighlighter Evolved > 編集 から、直接編集できる。

行数長いので一度テキストエディタ(Emacsなど)に貼り付けて編集すると良い。

430行目に注目。「function encode_shortcode_contents_callback」の次の次の行。
(行数が表示されないテキストエディタで編集中の場合は、「function encode_shortcode_contents_callback」とかで検索するとソースコード中に一度しか出てこないので捗る)

// The callback function for SyntaxHighlighter::encode_shortcode_contents()
	function encode_shortcode_contents_callback( $atts, $code = '', $tag = false ) {
		$this->encoded = true;
		$code = str_replace( array_keys($this->specialchars), array_values($this->specialchars), htmlspecialchars( $code ) );
		return '[' . $tag . $this->atts2string( $atts ) . "]{$code}[/$tag]";
	}

で、以下が修正前。

$code = str_replace( array_keys($this->specialchars), array_values($this->specialchars), htmlspecialchars( $code ) );

こんなふうになってるところを

$code = str_replace( array_keys($this->specialchars), array_values($this->specialchars), $code );

このように書き換える。

「ファイル更新」を忘れずに押しておこう。これだけでOK。

余談

何をどう書き換えたか割愛してしまったけれども、430行目にある「htmlspecialchars」関数を取り除く処理を加えた。この関数はコメント欄に使うと便利(SPAMが送るHTMLタグを実行できないようにしたり)なのだけども、今回はHTMLをHTMLのまま表示しないといけないためこの関数は安心してエイヤッと取り除いてしまっていいのだ。

プラグインを更新した時にはここに注意

プラグインがアップデートされた際には再度同じ箇所のソースコードを書き換える必要があります。めんどい。
作者はよ対応すべきでは。

もちろん将来のアップデートで改修される可能性もありますので、気になる人はフォーラムからmention送ったりしましょう。

関連記事

no image

文頭の$(ドル)マークは一体何なのか?

よくソースコードの先頭に$(半角ドルマーク)が付いてるソースがあったりします。これって何?文頭ドルマ

記事を読む

エンジニアじゃないけどがんばってさくらVPSにFTPサーバをインストールしてみる

さくらVPSって標準だとFTP接続できない!(知らなかった) なるべく黒い画面を見たくないので(FT

記事を読む

LIGの人に教えてもらった!WordPressからSEO的にもいい感じにカテゴリベース(/category/)取る方法

WordPressのカテゴリーページなどに付く、 http://example.com/catego

記事を読む

さくらVPS引越計画(MacでSSH接続を設定してWordPressをのっけるための初期設定)

ぼくはエンジニアじゃない。プログラミング情報誌を作っていたのにプログラミングできない(Hello W

記事を読む

PAGE TOP ↑