CODEWITHSUNDEEP
tinymce
SAK
SAK

Reputation: 3898

Applying css in TinyMCE

I am implementing ForeColor in TinyMCE Rich Text Editor.

it uses style to apply forecolor to selected text as like this 

<span style="color: rgb(255, 0, 0);" mce_style="color: #ff0000;">Hello</span>.

i want to apply css class instead of "style" here.. how to apply css class here? These Css Classes contain ColorCodes.

Example:

<span class="colorRed">Hello</span>

My CSS Class

.colorRed
{
color: #ff0000;
}

thank you

Upvotes: 8

Views: 33203

Answers (2)

Abdennour TOUMI
Abdennour TOUMI

Reputation: 93491

Search on content_css attribute an add your CSS file relative path(i.e:myLibFolder/myCss.css) after adding ","

$('textarea.tinymce').tinymce({
                    // 
                    //
                    //....
                    ,
                    content_css: "css/content.css,myLibFolder/myCss.css"  
                    ,
                     //


});

Upvotes: 3

Thariama
Thariama

Reputation: 50832

Because you want your css to be applied to tinymces editor content you will need to add your class to the class your editor content gets styled with.

If you are not using a user-defined content_css file when initializing tinymce (init-function) a content_css file will be used depending on the theme you have set in the init function (file used is to be found in a subfolder of folder themes).

I suggest you create an own content.css which you load using content_css setting in the init function. See this link for the tinymce documentation for this. For a first step you could copy one of the content.css from the themes directory and modify it.

Upvotes: 12

Related Questions