Somewhere in the TinyMCE files, you can specify which tags should be allowed in the editor, but I can't remember what file it can be specified in. I'll try to find out and return to you if I can find the right file.
I'm pretty sure if you added this as a css class then TinyMCE wouldn't strip it out. You would be best to add the class to the <p> tag and increase the margin/padding in css.
This approach would also mean your client/editor could reuse this via the 'styles' dropdown.
so it will remove empty divs. Try removing the - and touch your web.config before checking again. If you're still having problems, you may need to disable tidyhtml in umbracosettings.congif or the web.config (can't remember which)
In this case it is not Umbraco that touches your markup, but it is TinyMCE doing it. TinyMCE is configured to output valid XHTML by default. Empty tags are not valid XHTML as far as I know, so they are being stripped. Fortunatelly, you can change this behaviour in many ways.
The meaning of Umbraco not touching your markup is this: You control in your templates, macros and css what code is being spit out to the client. No extra code is being added here and you have FULL control over it.
Leaving aside the point of whether or not you should, If you follow the steps I list a few posts above you should be able to enter whatever markup you like into the editor and have it remain there when you publish.
Dan is correct on this one. One thing I have noticed is that the change to your tinyMCEconfig file doesn't happen right away. One way I have gotten around this is to change my web.config file slightly (just put an extra space in it somewhere) so that it reloads the config files. It is the tidyEditor setting that is removing it on publish, you need to change this line: <TidyEditorContent>True</TidyEditorContent> to false in your umbracoSettings.config. You also need to make the change in your tinyMceConfig.config file as that is executed when you click the 'Update' button on your HTML View Source pop up.
Adding HTML in the Rich Text editor
Why does the Rich Text editor strip out divs?
I have a simple div I'm using to add some space down the page between two paragraphs. .
For example if i do this
When I hit Update and then the HTML button again, the div is still there.
However if I hit Save and Publish, the DIV is stripped out and the html looks like this.
What is going on?
I thinks it's because of the tidy-implementation in tiny mce. I think it can be fixed somehow but I'm unfortunately not quite sure how-
Tidy makes sure that the output HTML is clean but sometimes it's a bit strict.
/Jan
Hi Brad
Somewhere in the TinyMCE files, you can specify which tags should be allowed in the editor, but I can't remember what file it can be specified in. I'll try to find out and return to you if I can find the right file.
/Kim A
Hi Brad,
I'm pretty sure if you added this as a css class then TinyMCE wouldn't strip it out. You would be best to add the class to the <p> tag and increase the margin/padding in css.
This approach would also mean your client/editor could reuse this via the 'styles' dropdown.
Cheers,
Chris
The reason it is cleaning it up is because there is no reason you need that div, if there is nothing in it when you can do it in the paragraph above:
<p style="padding-bottom:50px;">Some text here</p>
<p>This text should be 50 pixels down</p>
Or below:
<p>Some text here</p>
<p style="padding-top:50px;">This text should be 50 pixels down</p>
Hi Brad
By default, tinymce in umbraco will remove empty divs. You can change this setting in /config/tinymcesettings.config according to the rules at http://wiki.moxiecode.com/index.php/TinyMCE:Configuration/valid_elements
By default, it seems to use
so it will remove empty divs. Try removing the - and touch your web.config before checking again. If you're still having problems, you may need to disable tidyhtml in umbracosettings.congif or the web.config (can't remember which)
Dan
I 'fixed' it by changing the input time to simple editor. A bit disappoiting really. All those claims of Umbraco not touching your markup.
All points above about just putting the style on the <p> taken and appriciated.
Despite that, I can't imagine why it would remove empty DIVs. Imagine I have a class that has an image as it's background.
div .bgImage{
background: black url('../images/bgimage.png') repeat-none;
}
Then in code I want to do this.
Sure. I'm not sure why you would want to do this, but that is not the point. I tried the above and it got stripped out.
Might not be best practice but it is valid markukp. Who decided that the editor would 'search out empty divs and delete them'?
Very odd.
Not a big deal in my case. Thanks all. Now I know.
Hi Brad,
In this case it is not Umbraco that touches your markup, but it is TinyMCE doing it. TinyMCE is configured to output valid XHTML by default. Empty tags are not valid XHTML as far as I know, so they are being stripped. Fortunatelly, you can change this behaviour in many ways.
The meaning of Umbraco not touching your markup is this: You control in your templates, macros and css what code is being spit out to the client. No extra code is being added here and you have FULL control over it.
Hope this clarifies things a bit,
Regards,
Peter
Peter
Point taken... I should not use emply tags. I stand corrected. Thanks.
Brad
Hi Brad
Leaving aside the point of whether or not you should, If you follow the steps I list a few posts above you should be able to enter whatever markup you like into the editor and have it remain there when you publish.
Dan
Dan is correct on this one. One thing I have noticed is that the change to your tinyMCEconfig file doesn't happen right away. One way I have gotten around this is to change my web.config file slightly (just put an extra space in it somewhere) so that it reloads the config files. It is the tidyEditor setting that is removing it on publish, you need to change this line: <TidyEditorContent>True</TidyEditorContent> to false in your umbracoSettings.config. You also need to make the change in your tinyMceConfig.config file as that is executed when you click the 'Update' button on your HTML View Source pop up.
I would just add a css style to give you the spacing you need
sometimes I put an empty div in when I am using jquery. I use that empty div to write output to....
Dandrayne has the solution here.
I am dreadfully stripping a site out of WordPress. To keep exact for sake of time crunch I have to use the exact same html it produces.
In my case tinyMCE was stripping out a header tag that was necessary for css to work.
I added the header to the authorized tags in the config file as Dandrayne mentioned and voila - solution!
is working on a reply...