【つれづれ】[WordPress]ソースコードを表示させるようにカスタマイズしました【CKEditor編】 | ササキタイキの思うツボ
Warning: count(): Parameter must be an array or an object that implements Countable in /home/km64975/taiki-sasaki.tokyo/public_html/wp-content/plugins/wordpress-ping-optimizer/cbnet-ping-optimizer.php on line 533

【つれづれ】[WordPress]ソースコードを表示させるようにカスタマイズしました【CKEditor編】

シェアする

関連記事
スポンサーリンク




やろうやろうと思って・・・

ほったらかしにしてたコト(汗)

WordPress

WordPress

上でソースコードをキレイに表示させるカスタマイズです。

何かのプラグインを入れればイイと思っていた

そんな甘いモノじゃありませんでした・・・。

ここを見る限りだと、

Syntax Highlighter

を入れれば終わりですよね?

が、CKEditorを使っていた!

おいらが使っているのは

CKEditor

で標準エディタじゃないんですよ。さあ、困った。どうすりゃいいか。

Code

このブログに助けられる

すっかり放置されていらっしゃるようなブログですが・・・

しかし、いかんせん情報が古い(致し方ないですが)なので、我流にやってみました。ご参考になれば幸いです。

やったこと

プラグインをインストール

Crayon Syntax Highlighter
SyntaxHighlighter CKEditor Button
ckeditor-syntaxhighlight

この3つをインストールします。

“Crayon Syntax Highlighter”の設定を変更

このままだと・・・

"<" ">"

がHTML変換されて出てきてしますので、

Crayon Syntax Highlighter

のプラグイン設定のここを確認、設定されていなかったら設定します。

Code

Code

あとは・・・

CKEditorにできた

Code

のボタンをクリック、

Code

このエディタからコードを入力すればOKです。

・・・こういう記事苦手や(笑)

Code

染谷昌利

染谷昌利

氏を素直に尊敬する・・・。

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

Twitter でササキタイキをフォローしよう!

スポンサーリンク