← すべてのドキュメント

スキンとテーマの設定

config.skin は、エディターの外観(クロム)を選びます。値はクラスとしてエディターのコンテナーに追加されます。skin: "dark" を指定するとコンテナーに rte-skin-dark が付き、テーマのスタイルシートがそれを基にスタイルを適用します。

var config = {};
config.skin = "dark";          // "" (default look), "dark", "gray", "blue", "rounded-corner"
var editor = new RichTextEditor("#div_editor", config);

既定のテーマのスキン

値外観
(not set)既定の明るい外観で、角は直角です。
dark暗い色のツールバーと外観。暗い色のアプリケーションシェル向けです。
gray落ち着いたグレーのツールバー。白いページとのコントラストが控えめです。
blue青いアクセントのツールバー。
rounded-corner既定の配色で、エディターの枠の角が丸くなります。

独自のスキン

エディターは値を検証しないので、対応するクラスに自分でスタイルを付ければ、どんな名前でも使えます。

/* Your own skin: any class name works, the editor just prefixes it. */
.rte-skin-brand .rte-toolbar { background: #101828; }
.rte-skin-brand .rte-toolbar button { color: #e6eefc; }

外観ではなく編集面を変更する場合は、contentCssUrl と setContentCssText を参照してください。スキン全体を用意しなくても、rte-square モディファイアーで角を直角にできます。