如何在TinyMce编辑器中更改默认字体调色板? [英] How can I change the default font color palette in the TinyMce editor?

问题描述

我想添加一些预设的颜色，这些颜色与我网站的主题一起出现.如何在TinyMce中更改默认字体调色板?

I have some preset colors that I'd like to add which goes along with my website's theme. How can I change the default font color palette in TinyMce?

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

推荐答案

A .一种简单但肮脏的方法是编辑源代码.取文件tiny_mce.js并搜索字符串" 000000,993300,333300，"-这是SplitButton颜色定义的开始.现在，您可以根据需要编辑颜色.这将调整所有ColorSplitButton实例的颜色设置.

A. The easy but dirty way is to edit the source code. Take the file tiny_mce.js and search for the string "000000,993300,333300," - this is the start of the color definition of the SplitButton. You may now edit the colors as you like. This will adjust the color setting for all ColorSplitButton instances.

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

B. An other way, not as dirty as to fiddle with the source code is to adjust the colors after editor initialization. You will need to add the setup parameter to your tinymce configuration (or put it inside one of your own tinymce plugins):

   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的其他属性(即标题，背景色...)

Be aware that you might want to change other attriubtes of the SplitButton as well (i.e. the title, background color,...)

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

C. The cleanest but time-consuming solution is to develop an own plugin using an own ColorSplitButton containing the colors of your choice in the setting for that control element (have a look at the tinymce developer version) there is a file called ColorSplitButton.js . Here is some code containing the color setting:

    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);

这篇关于如何在TinyMce编辑器中更改默认字体调色板?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！