CODEWITHSUNDEEP
javascripttinymce
turkinator
turkinator

Reputation: 925

TinyMCE - Color Pickers are empty

Using TinyMCE, I cannot get the Foreground and Background color pickers to display any colors.

enter image description here

I've tried manually adding a textcolor_map, as described here: https://www.tiny.cloud/docs/plugins/textcolor/ but it still doesn't show any colors.

If I add the ColorPicker plugin, then I get a "Custom" option, but still no actual colors.

tinymce.init({
        selector: '.editor',
        theme: 'modern',
        plugins: [
            'link image lists charmap hr anchor pagebreak spellchecker textcolor',
            'visualblocks visualchars code fullscreen media nonbreaking',
            'table contextmenu directionality template  paste fullpage inlinepopups'
        ], 
        toolbar1: 'undo redo | bold italic underline strikethrough  | forecolor backcolor emoticons| bullist numlist table | link unlink',
        toolbar2: 'fontselect fontsizeselect | alignleft aligncenter alignright alignjustify | outdent indent | code fullscreen',
        inline: true,
        removed_menuitems: 'newdocument',
 });

Upvotes: 0

Views: 473

Answers (1)

Łukasz Blaszyński
Łukasz Blaszyński

Reputation: 1565

I have copied your config and created a fiddle: http://fiddle.tinymce.com/B9gaab

Looks like that everything works fine in clean environment, so the problem is probably related with some styling you have on your website.

Because tiny mce is rendered in context of your webpage you can have some general styling which may override some tinyMCE UI elements.

regarding textColor it use table inside to show all color elements. I will suggest to check if any of styles is not override by your styling. Image present structure rendered by TinyMce for textcolor tooltip content.

enter image description here

For sure you are not overriding by class names because they are tinymce specific, but probably you have some overrides for td elements or table/tbody.

Upvotes: 1

Related Questions