Zenn
😎

user.js で TinyMCE のカラーパレットで選択できる配色を制御する

2023/08/23に公開
#
memo
#
movabletype
tech

備忘用メモ:

概要

  • TinyMCE で標準搭載されてるカラーパレットで選択できる配色の制御を行う
  • ExtendTinyMCE プラグインの開発が終了しているので、それ以外の方法で対応が必要
  • 今回は user.js に color_map の定義を追加して対応する

方法

user.js に以下のような記述を追加する

// TinyMCE のカラーパレットの配色制御
  const config = MT.Editor.TinyMCE.config;
  $.extend(config, {
    color_map: [
        '#f0f8ff', 'Aliceblue',
        '#008b8b', 'Darkcyan',
        '#ffffe0', 'Lightyellow',
        '#ff7f50', 'Coral',
        '#ffffff', 'White',
     ]
  });

before
before

after
after

おわりに

MTAppjQuery のアップデートが発生した場合に記述が消える（のかなぁ…？）気がしないでもないので、user.js を退避するなどの考慮が必要になりそう

Discussion