SyntaxHighlighter系のタグ挿入ボタンプラグイン「SyntaxHighlighter TinyMCE Button」

TinyMCEにSyntaxHighlighter系のタグを挿入できるボタン機能を追加するプラグインです。

現在、「SyntaxHighlighter Evolved」を使用しているのですが、「SyntaxHighlighter TinyMCE Button」を使用すると手軽にコードを挿入ができます。

設定

「SyntaxHighlighter TinyMCE Button」でプラグイン検索で表示されます。
インストールをして有効化すると、サイドバーの設定に「SH TinyMCE Button」名で設定ページが追加されます。

設定は、特に操作しないでも使用できるようですが、「SyntaxHighlighter Evolved」を使用している場合、「SyntaxHighlighter Evolved」の設定で「すべてのブラシを読み込む」にチェックを入れる必要があります。SyntaxHighlighter Evolvedはpreタグを使用しないので、そのための設定だと思います。

「SH TinyMCE Button」基本設定で、使用しているプラグインにチェックをします。
SyntaxHighlighterTinyMCEButton1

「ボタンのデフォルト設定」にあるデフォルト言語で使用しない言語は、「使用しない」にチェックを入れることで、ボタン操作時に使用言語選択の選択肢を減らすことができます。
SyntaxHighlighterTinyMCEButton2

使用方法

ビジュアルエディタに「pre」と「CODE」ボタンが追加されます。
SyntaxHighlighterTinyMCEButton3

preボタンでは、エディタに書いたソースコードに使用します。
CODEボタンでは、開いたウインドウにソースコードを書いて挿入する形になります。
SyntaxHighlighterTinyMCEButton4

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です