TinyMCE4.xで使えるオプション

tinymce

 

基本的オプション

 

 TinyMCE 4.x では、さまざまなオプションを使用してエディタの設定をカスタマイズできる。

 

エディタを適用する要素のセレクタの指定

selector: "textarea"

もしくは

mode :"exact",
elements :"elm1,elm2",

 

言語指定

language: "ja"

 

使用するプラグインの読み込み

plugins: "link image code"

 

ツールバーに表示するボタンを指定

toolbar: "undo redo | bold italic | alignleft aligncenter alignright"

 

列を増やして表示したい場合はカンマで区切る

toolbar: ["code preview | undo redo | alignleft aligncenter alignright alignjustify | bold italic underline strikethrough forecolor backcolor removeformat | image media searchreplace",
	"styleselect fontsizeselect link unlink"
], 

 

メニューバー、ステータスバー、ツールバーの表示非表示

menubar: false,
statusbar: false,
toolbar: false,

 

表示設定オプション

エディタのサイズ

height: 300,
width: 600,

 

エディタ内のコンテンツに適用するCSSファイルを指定

content_css: "/path/to/your/content.css"

 

複数指定する場合はカンマで区切る。

 

エディタのbodyに指定するクラスを指定

body_class: "tiny_mce_class",

 

 

機能設定オプション

TinyMCEのブランド表示を無効にする

branding: false

 

エディタを読み取り専用にする

readonly: true

 

リンクのターゲット属性のデフォルト値を指定

default_link_target: "_blank"

 

禁止されているタグを許可する

extended_valid_elements : "script[*]",

 

生成されるURLを絶対パスにする

relative_urls : false,

デフォルトは相対パス。

 

イベント設定オプション

エディタの初期化時にカスタム処理を設定できる。

setup: function(editor) {
    editor.on('init', function() {
        処理
    });
}