[SOLVED] Changing styles in TinyMCE

[Guido]

Hi,

I use TinyMCE as my back-end WYSIWYG editor, and I have an issue which is probably quite common but I'd like to know if someone has found some way to work around this.

I have made some styles in the custom style list of TinyMCE, that correspond with the styles on my pages. However, when changing let's say a certain paragraph style to a header style, TinyMCE will add the header style to that text, but will not remove the paragraph style resulting in text that has both styles applied to it.

I know the way to work around this is first selecting the 'styles' from the dropdown to remove the current style and after that applying the desired style, but I think this will be confusing to a lot of my clients. So is there any way I can make this more user-friendly?

[velden]

I don't fully understand. As far as I know, those editors don't apply styles to elements but classes, right?

So you're in control via CSS what styles are applied to what specific elements.

Maybe you can post a small example code; before/after.

[Guido]

Sorry, should have been more clear:

Let's say I have this:

Code: Select all

<span class="header1">Bourgondisch leven</span>

But I want to change the class to "paragraph1". So I select the text and select the "paragraph" style from the dropdown with my custom classes. I'll then end up with:

Code: Select all

<span class="header1 paragraph1">Bourgondisch leven</span>

So the text now has two classes: the one it had before and the one I chose second. While in my opinion it should replace the old class with the new one.

As I said, the only way to do this via WYSIWYG is selecting the text, choosing the top 'styles' button from the custom classes dropdown, this way removing the current class, selecting the text again and applying the desired class. Which is annoying because a lot of people except a "Word" kind of style.

[velden]

I think this behaviour is what you want because it gives you possibility to add multiple classes to an element.

Alternative would be a multiselect but apparently that's not what TinyMCE has choosen.

BTW. I think you can remove class, by selecting it once again.

[Guido]

Thanks for your reply,

Well yeah I agree that in some cases it may come in handy to apply multiple classes to an element or a piece of text, but I think in the majority of the cases unexperienced users would like a more 'Word' behaviour.

You're almost right, you can remove classes by selecting the 'styles' word in the dropdown.

Any TinyMCE tips are welcome, maybe it's a good idea to start a discussion here about what the CMSMS community believes would be the best behaviour of the module.