REDLINE MAGAZINE | 「SyntaxHighlighter Evolved」のアイコンが出ない時の対応

WPプラグイン「SyntaxHighlighter Evolved」

ソースコードをキレイに表示にしてくれる「SyntaxHighlighter」をwordpressのプラグインにした「SyntaxHighlighter Evolved」というプラグインを利用してみました。

有名だと思うので、何するものか、どんな事ができるのか、どう設定するのかはググればいくらでも出てくるのでそちらにお任せ…

syntaxhighlighter evolved 使い方 – Google 検索

アイコンが出なかったでござるの巻

インストールして使ってみて表示されるソース部分を確認して、一見何の問題もなさげだったのですが、ソースコードの上にマウスを乗せた時に表示される右上の4つのアイコンのうち1つが表示されないという事件が(；´Д｀)

※私が使ってるのはver2.x系です。3.x系は心配いらないと思います。(多分)

表示されなかったアイコンは左から２つ目のソースを丸々クリップボードにコピーするボタンアイコン。別になくても死にはしないけれども、なんか気持ち悪いのでなんとかしたいと四苦八苦。

アイコンを表示させる対応

プラグインディレクトリの中にインストールした「syntaxhighlighter」があります。(/wp-content/plugins/syntaxhighlighter/)その中のsyntaxhighlighter.phpを確認。

//658行目辺り
echo "	SyntaxHighlighter.config.clipboardSwf = '" . esc_js( apply_filters( 'syntaxhighlighter_clipboardurl', plugins_url( 'syntaxhighlighter2/scripts/clipboard.swf', __FILE__ ) ) ) . "';\n";

この658行目に書かれてるsyntaxhighlighter2/scripts/clipboard.swfっていうのが消えちゃってるアイコンぽい。

そのアイコンのファイルを確認すると一応存在はしているものの破損してるっぽくてサイズが0バイトになってました。

アイコンを求めて

元サイトにいけばあるやろって事で「SyntaxHighlighter」へ。バージョン3系が大きく扱われているのでスルーして2系を探す。Downloadのページにある「Previous Versions」からバージョン2.1.382のものをダウンロードしました。

ダウンロードしたファイルを展開すると、syntaxhighlighter_2.1.382/scripts内にサイズが0じゃないclipboard.swfを発見。そいつを/wp-content/plugins/syntaxhighlighter/syntaxhighlighter2/scripts/clipboard.swfに上書き。

これでいけたやろと思って鼻息荒くしたものの、まだアイコンが出てきやがらんという結果になり消沈しました。

半泣きになりながら色々ググったところ、さっきのクリップボードアイコン関連の部分のソースのパスを変えたらいいと判明。

もうね、そのまんまコレすぎて感動しました。最初から素直にググれば良かったわ。
SyntaxHighlighter Evolvedで「クリップボードにコピー」アイコンが表示されていない時の対処方法（WordPress） | 動画素材.com/ブログ 映像素材・ムービー作品(ES… MotionGraphicDiary

//658行目辺り
//変更前のソース
plugins_url( 'syntaxhighlighter2/scripts/clipboard.swf'
//変更後のソース
plugins_url('syntaxhighlighter/syntaxhighlighter2/scripts/clipboard.swf'

今度こそ、ｷﾀ――(ﾟ∀ﾟ)――!!これで無事にアイコンが表示されるようになりました。

まとめ

ということで、SyntaxHighlighter Evolvedのver2.xを利用する際にアイコンが出なかった場合は、
1.アイコンをゲットして置き換える。
2.それでもダメな場合はソースも書き換える。
で解決しました。