CODEWITHSUNDEEP
jquerytinymce
Zhivko
Zhivko

Reputation: 550

Set color style to tinyMCE text selection through the API

I am trying to apply a specific color to the selected text in the editor using the tinyMCE api (jQuery version)

This is what I am doing so far:

var node = tinyMCE.activeEditor.selection.getNode();
tinyMCE.DOM.setStyle(node, 'color', '#FFF');

The problem is this will change the color of the whole node instead of just the marked text. Is there a way to apply the color only to the marked text through the tinyMCE API?

Thanks

Upvotes: 3

Views: 2800

Answers (2)

Claudio Romano
Claudio Romano

Reputation: 51

I've found this simple solution. Set the selection background / foreground color 

tinyMCE.init({
    ...
    theme_advanced_text_colors : "FF00FF,FFFF00,000000",
    ...
});

Upvotes: 0

Zhivko
Zhivko

Reputation: 550

I have found the answer. In case someone else is stuck here I'll post the solution.

// Registering the special format with a variable
tinymce.activeEditor.formatter.register('custom_format', {inline : 'span', styles : {color : '%value'}});

// Applying the specified format with the variable specified
tinymce.activeEditor.formatter.apply('custom_format', {value : 'red'});

Upvotes: 6

Related Questions