7

我有一些预设颜色,我想添加与我的网站主题相匹配的颜色。如何更改 TinyMce 中的默认字体调色板?

screenshot-with-shadow.png http://img407.imageshack.us/img407/4526/screenshotwithshadow.png

4

4 回答 4

3

A.简单但肮脏的方法是编辑源代码。获取文件 tiny_mce.js 并搜索字符串“ 000000,993300,333300,”——这是拆分按钮颜色定义的开始。您现在可以根据需要编辑颜色。这将调整所有 ColorSplitButton 实例的颜色设置。

B.另一种方法是在编辑器初始化后调整颜色,而不是像摆弄源代码那样肮脏。您需要将setup 参数添加到您的 tinymce 配置中(或将其放入您自己的 tinymce 插件之一):

   setup : function(ed) {
      ed.onInit.add(function(ed) {

         $('.mceColorSplitMenu').find('#_mce_item_2').get(0).setAttribute('data-mce-color','#0202FF');
         $('.mceColorSplitMenu').find('#_mce_item_3').get(0).setAttribute('data-mce-color','#0203FF');
          ...
         $('.mceColorSplitMenu').find('#_mce_item_41').get(0).setAttribute('data-mce-color','#0241FF');
      });
   }

请注意,您可能还想更改 SplitButton 的其他属性(即标题、背景颜色……)

C. 最干净但耗时的解决方案是使用自己的 ColorSplitButton 开发自己的插件,其中包含您在该控件元素的设置中选择的颜色(查看 tinymce 开发人员版本)有一个名为ColorSplitButton.js. 这是一些包含颜色设置的代码:

    ColorSplitButton : function(id, s, ed) {
        var t = this;

        t.parent(id, s, ed);

        /**
         * Settings object.
         *
         * @property settings
         * @type Object
         */
        t.settings = s = tinymce.extend({
            colors : '000000,993300,333300,003300,003366,000080,333399,333333,800000,FF6600,808000,008000,008080,0000FF,666699,808080,FF0000,FF9900,99CC00,339966,33CCCC,3366FF,800080,999999,FF00FF,FFCC00,FFFF00,00FF00,00FFFF,00CCFF,993366,C0C0C0,FF99CC,FFCC99,FFFF99,CCFFCC,CCFFFF,99CCFF,CC99FF,FFFFFF',
            grid_width : 8,
            default_color : '#888888'
        }, t.settings);
于 2012-03-26T16:53:46.080 回答
3

尝试在编辑器配置中使用“textcolor_map”设置?

tinymce.init({
  textcolor_map: [
    'D7C0D0', 'color1',
    'F7C7DB', 'color2',
  ]
})

我也试图找到如何更改 Tinymce 中的默认字体调色板。大多数诸如上述的答案都指向使用基于“theme_advanced_”的配置属性之一。但是,“高级”主题未与版本 4 打包,并且版本 4 默认使用的“现代”主题不公开相同的属性。无论如何,主题独立的解决方案将是可取的。

瞧!快速浏览“textcolor”插件会发现,当插件设置其颜色图时,它首先会查看编辑器设置中的上述属性。

于 2015-07-18T11:22:45.393 回答
1

好吧,有点晚了,但我的解决方案是:

1.假设您正在使用'textcolor'插件,复制'plugins'目录中的'textcolor'文件夹并给它一个新名称(比如说'mytextcolor')。这将是您的新插件的名称(mytextcolor)

2.在你的'mytextcolor'文件夹中打开plugin.min.js,在第12行你会找到默认的调色板。用新的颜色名称和代码修改它。

3.在您的 tinymce 配置中,将插件参数中的“textcolor”重命名为“mytextcolor”

希望有帮助

于 2015-01-29T12:42:30.553 回答
0
theme_name_text_colors: "#hexhex, #hexhex, #hexhex"

将其放入init()函数中,您的颜色托盘将变为自定义。而且您仍然可以获得更多颜色按钮。

参考:https ://www.youtube.com/watch?v=dySkwdZG9J0

于 2014-07-21T00:49:38.823 回答