HTML code formatting (JCE / TinyMCE)

[e-motiv]

I have this frustrating problem that JCE or TinyMCE reformats my HTML code. Though this HTML formatting is a nice feature, it breaks the fucntionality I want. It has to do with curly braces and a plugin (MooBot in my case, but I guess other similar problems exists).
What I want is:

Code: Select all

{slide-vertical-closed=<h2><strong>Wat biedt EVA je?</strong></h2>}

but what I get (after Update) is (notice the line breaks (new lines)):

Code: Select all

{slide-vertical-closed=
<h2><strong>Wat biedt EVA je?</strong></h2>
}

In short, how can I make the editor NOT break that line ? (I need <h2> for SEO, so I rather keep that tag).

P.S. I think this problem is related, but no answers there either.

[happy_noodle_boy]

The rendered HTML is displayed correctly.

The linebreaks in the HTML is not the result of any specific formatting by TinyMCE or JCE (in fact a quick test revelaed that FCK and wysiwygpro behave in the same way). This may be a symptom of the HTML extraction from the converted textarea and does not appear to be browser specific.

Short of creating a special cleanup routine for JCE or TinyMCE, there does not seem to be any other way to "fix" this. Its not actually a bug, as it does not affect normal HTML creation (the rendered HTML and specifically the H2 block element are displayed correctly).

If you do not abslolutely have to use a block element (ie: H2 etc) use a span instead and you will not have the problem.

[e-motiv]

Thanks for the reply, happy_noodle_boy, but...

The linebreaks in the HTML is not the result of any specific formatting by TinyMCE or JCE (in fact a quick test revelaed that FCK and wysiwygpro behave in the same way). This may be a symptom of the HTML extraction from the converted textarea and does not appear to be browser specific.

On my site, FCK doesn't reformat the HTML, dunno about WysiwygPro. Strange..
Anyway, do you mean that that "HTML extraction" you talk about, is programmed in Joomla, the editors or javascript behavior? (You wouldn't also happen to know the file and lines of that extraction routine? Maybe I could hack something..)

Short of creating a special cleanup routine for JCE or TinyMCE, there does not seem to be any other way to "fix" this. Its not actually a bug, as it does not affect normal HTML creation (the rendered HTML and specifically the H2 block element are displayed correctly).

Isn't there, like a "don't cleanup" setting in 1. any setting somewhere or 2. special code, tag or else that tells that cleanup routine to ignore a certain line ? (This last one, 2, could be a nice FR, don't you think?

If you do not absolutely have to use a block element (ie: H2 etc) use a span instead and you will not have the problem.

I know, I know, but I have reasons to use the h2!

[happy_noodle_boy]

On my site, FCK doesn't reformat the HTML, dunno about WysiwygPro. Strange..
Anyway, do you mean that that "HTML extraction" you talk about, is programmed in Joomla, the editors or javascript behavior? (You wouldn't also happen to know the file and lines of that extraction routine? Maybe I could hack something..)

I tested against the demos on the respective sites.

Isn't there, like a "don't cleanup" setting in 1. any setting somewhere or 2. special code, tag or else that tells that cleanup routine to ignore a certain line ? (This last one, 2, could be a nice FR, don't you think?

I don't think its a cleanup thing, I think its a native javascript/browser thing. There is a possibility that you can reverse or prevent the process using a cleanup routine in TinyMCE/JCE

I know, I know, but I have reasons to use the h2!

block elements have their own formatting, headings, divs and paragraphs etc. always break to a newline, thats how they work. Therein lies the problem.

[e-motiv]

I am confused by your statements. Forgive me for not getting you , but..
If you only "think" its a native javascript/browser thing, how can you be sure then that block elements have their own formatting, headings, divs and paragraphs etc. always break to a newline. I mean, I am clearly talking about the HTML source code, not about the html presentation. Aren't you mixing those 2 up by the latter? Because in your latter statement it's obvious that they are block elements if you are talking about presentation, and that's not a problem for me, but it's simply text (being the source code of HTML) and it's in that HTML source code where the H2 gets the linebreaks I don't want. On the other hand, if you are sure about the latter in the text/source representation, you must know where the problem lies?
Am i making myself clear or confusing you too now? I tried my best.

So, in case of the native js/browser thing, any idea how to confirm/change this? I am having this behavior in IE7 and FF2 (without even Saving or applying, just when switching from source to non-source via the WYSIWYG editor).

[happy_noodle_boy]

I'm not 100% sure of this myself, this is just from testing and observation . Unfortunately, I'm not the js guru who makes TinyMCE, and my javascript knowlege is a green belt at best, but it would seem that the presentation formatting of the block element informs the html extracted from the rich text area.

This may be a little quirk that requires a little fixing, in fact there is a fair bit of code in TinyMCE (and I'm sure the other editors as well) devoted to addressing little browser quirks.

Why can't the bot deal with this anyway? It would be much simpler to 'fix' this there.

[e-motiv]

For a reference for other people, I got an answer from the makers of moobot, and they will try and "fix" the break thingy.
Here is the thread:

Hello,

Thanks for the answer!

Now, if you consider SEO (Search Engine Optimization), you must know that this cannot be solved with css. (h2 has more effect than any css, at least last time I saw a google dance).
So, I will wait anxiously for your addition to remove paragraph and line break tags!! That would be great for me. Thanks alot!

I hope you don't mind me putting this in the forum?

GReetings, R.
<hr/>
--------------------------------------------------------------------------------
From: [email protected]

Hello Ruben,

that issue is easily solved using CSS. Please refrain from using HTML Tags as part of the MooBot Tags, as not every plugin supports that, while not only editors will generate trouble. What we will only add is to remove paragraph and line break tags around the MooBot tags in future as those get very likely inserted by editors.

To find out which CSS class to address look into the pages source code, or use Firefox and the Web Developer plugin or the View Source Chart Plugin. Every plugin has its own dedicated CSS classes assigned. Look also into the documentation which CSS style file is associated with the plugin, and how to correctly customize it.

Some plugins allow to set a arbitrary CSS class for individual styling in addition to the default assigned ones: http://support.pillwax.com/open-source

Regards, M.

Open Source Support

PILLWAX Industrial Solutions Consulting
Software Technology Licenses

Web: http://technology.pillwax.com

[e-motiv]

Thread continued..

That's a pitty, but well..
Thanks for your effort nonetheless..

P.S. I installed the HTML cleanup, but it doesn't do anything when going from HTML source view back to wysiwyg in the editor. It's there that the misschief happens. Just FYI, since I think that cannot be cleaned up by any plugin.

From: Pillwax.com
the update with the HTML cleanup around MooBot tags has been released today. For using <h2> or related tags in the MooBot tags, sorry that for that there will be no support in future. When using the Tab or Accordion plugins than those create <h..> tags by itself without the need to define those manually.

[e-motiv]

thread continued..

From pillwax.com
There was a minor mistake in processing the settings for the Cleanup, and the latest release 1.16.1 available on your "My Page" on our site fixes that.

For your own understanding: The cleanup is only done when the page is loaded in the FRONTEND, not with the editor. For any cleanup to be done in the editor, an editor plugin is required (if supported by the particular editor) and that is outside of our scope. Again, ANY CLEANUP IS DONE ON THE FRONTEND PAGE!

You may check that when loading the frontend page with the MooBot effect in question, and then by comparing the pages source code with the HTML source code the editor has.

It's clear like I already suspected that my major problem lies in the editor (or Joomla). But it's nice they put some cleanup feature in their plugin!! gogo, Pillwax! :-)

Anyone any suggestions?

[radision]

HTML code show direct like:

<html>
......

BBCode is ok, but not HTML.

how to show it correctly ?