change output of wysiwyg underline

9 posts by 3 authors in: Forums > CMS Builder
Last Post: April 3, 2012   (RSS)

By squeazel - March 29, 2012

Is there any way to change what the underline option in the wysiwyg editor does? Currently, it adds an inline text-decoration style, but that is overriding any other styles I have set.

Elsewhere in the forums I see how to customize the style of elements such as anchors or headings, however since this is an inline style and not an element I'm not sure how to change this.

If it's not possible to do up-front, can I adjust the inline style on the fly using php?

thank you!

Re: [charnushka] change output of wysiwyg underline

By zip222 - March 30, 2012

Would removing that button from the editor be an option for you? That is fairly easy to do.

Re: [zip222] change output of wysiwyg underline

By squeazel - March 30, 2012

Thanks for the suggestion but unfortunately I do need that button. I'll be removing almost every button, however italic and underline are something I need to offer on this site. Italic just throws up an <em> tag, which is great. I wish underline could just just an old-fashioned <u> tag, which I doubt will stop working anytime soon.

Re: [charnushka] change output of wysiwyg underline

By (Deleted User) - April 3, 2012

Hi zip222,

I just had a quick look over at TinyMCE's forum to see if this has come up before - this thread http://www.tinymce.com/forum/viewtopic.php?id=12291 contains a lot of information about why they don't natively support the <u> tag.

After reading through that, I have the following solution to offer you (if you're up for editing the code directly) - add this:

formats : {
underline : {inline : 'span', 'classes' : 'underline', exact : true},
}

to cmsAdmin/lib/wysiwyg.php at about line 53 (after 'tinyMCE.init {...')

This will force the 'undeline' button to add a span to the selected text with the class 'underline' (which you can then set in your main css for the site).

Let me know if this helps.

Tom

Re: [charnushka] change output of wysiwyg underline

By (Deleted User) - April 3, 2012

Hi charnushka,

To do that you'll need to edit cmsAdmin/lib/wysiwyg.css (save it as wysiwyg_custom.css) and add the following above the "site specific.." info box:

body.mceContentBody.underline {
text-decoration:underline;
}

This will add the 'underline' class to the everything that is drawn inside the tinyMCE window, so the spans with the underline class will have a style assigned to them!

Let me know if this helps,

Tom

Re: [Tom P] change output of wysiwyg underline

By squeazel - April 3, 2012

Thanks Tom. Didn't seem to work but generalizing it as follows seemed to do the trick:

.underline {
text-decoration:underline;
}

Re: [charnushka] change output of wysiwyg underline

By zip222 - April 3, 2012

The reason Tom P's css didn't work is because it is missing a space before ".underline"

body.mceContentBody .underline {
text-decoration:underline;
}

Re: [zip222] change output of wysiwyg underline

By (Deleted User) - April 3, 2012

Good spot zip222!