How To Stop Stripping Div Tags in HTML/Visual Editor

  • In the HTML editor if I enter:

    <div class=”mycontent-wrapper”>
    <div class=”mycontent-top-bar”></div>
    <div class=”mycontent”>blah blah blah</div>
    <div class=”mycontent-btm-bar”></div>
    </div>

    then click on the “Visual” editor tab and back on the “HTML” tab I see:

    <div class=”mycontent-wrapper”>
    <div class=”mycontent”>blah blah blah</div>
    </div>

    Why are the “mycontent-top” and “mycontent-btm” div’s no longer there? Is this a documented “feature” of WordPress?

    Searching I see other folks have had the same problem but I’m not finding any solutions. Is there a fix or plugin to stop this behavior?

    Thanks,
    DAN

Viewing 10 replies - 1 through 10 (of 10 total)

  • Is there a fix or plugin to stop this behavior?

    Yes, if you are entering your own code, you can’t use the visual editor. Switching back and forth between the visual and html editors will mess up your code, and there is no fix for this other than not doing it.

    I am having the same problem… It’s frustrating as hell.
    If you build a page in HTML mode you have to stay there or the tags get scrambled.

    didn’t seem it was that way when i started using wordpress.
    is this an improvement?
    is there a setting to set to avoid the ‘help’ of the <div> tags?
    as limey said, it’s frustrating as hell.
    why not just wisiwig?

    [email protected]

    (@richardgriffinitservicescouk)

    Im having the same problem and its giving me an headache.

    If there is no fix then i will have to revert back to CS5.

    As a new WP user I can’t believe this.

    If I use any other visual HTML editor it never strips my code.

    Why is WP doing this!

    There needs to be an option to stop it doing so.

    It’s the most destructive button on the Edit page!

    There is an option to stop WordPress from doing this. You need to disable the visual editor. It’s under your user settings.

    Or ask the WP Team to reprogramme it so that it doesn’t do this?

    I can’t see why it needs to do this.

    Well, you either need to learn how to code without leaning on a visual editor or you need to learn how to edit kses.php, know how, why and where to place edits in there so you don’t introduce security weak spots and keep it updated. I’d say that the former is easier for most.

    Seems as though the visual tab sees a tag with nothing in a gets rid of it to keep things tidy. If you’ve ever seen how some of the older WYSIWYG used to output code you’d see why it works this way. Understanding this though there is a workaround…

    It’s not pretty but it works, any tag that is empty… stick a comment in it!

    So in Dan’s original question code, the workaround would look as follows…

    <div class="mycontent-wrapper">
   <div class="mycontent-top-bar"><!-- Top Bar --></div>
   <div class="mycontent">blah blah blah</div>
   <div class="mycontent-btm-bar"><!-- Bottom Bar --></div>
</div>

    Hope that’s of help, it works for me.

    It wasn’t technically an empty tag.

    It was like :

    <div style="clear:both;margin-bottom:40px;">&nbsp;</div>

    I don’t call that empty!

    But I get your point! ??

    The software should in any case warn the user it is about to delete the authors code and give a warning at least the first time!

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘How To Stop Stripping Div Tags in HTML/Visual Editor’ is closed to new replies.