Is there ANY WAY to make WYSIWYG-editor to allow your own coding?

Uh, quick question: What client would want to add “code” to a site but be unable to understand how to do HTML? I’m not trying to be a smart ass, but what types of stuff are they trying to add in? Yes Divs and other things get pulled out by the Visual Editor, but why are they trying to put that in in the first place if they don’t know how to use the stuff (and are incapable of using the Code editor)? Is it a case that they are writing things up in Word or DreamWeaver and want to export as HTML and copy and paste it into WordPress?

harknell asks exactly what I was wondering. Maybe you could explain your situation differently?

What the hell is someone who doesn’t know anything about HTML or CSS doing running a website? Maybe they should stick to Blogger.

You know excatly how to make the website which your client wants but WordPress WYSIWYG editor doesn’t allow you to do that. Instead WYSIWYG editor window changes your website to something else. Now – if you turn the visual editor off as you propably have to do, you can write your codes as you want and it works. But after the website is ready and it’s running you have to give the controls to your client who still doesn’t know any HTML/CSS. Of course he needs to update the site and only thing he can do is to use the WYSIWYG-editor. I assume you can understand what happens next and you can propably understand that client won’t be very happy with the results.

Well, that’s poor design then.

Here’s the thing, what *exactly* are you doing that “WYSIWYG editor doesn’t allow”? Because what you type into the post content should never be more than:

• straight text
• links
• images

Simple as that, really. Any site/theme that does not work with what the wysiwyg editor produces is a poorly designed theme. The editor produces perfectly valid code if you don’t try to do anything funky with it. Type text. Highlight things and make them italic or bold. Use the image button to add images. Use the link button to add links. What’s so difficult about that?

But the real question: What in the heck are you doing in the editor that requires disabling the visual aspects of it? Remember, your client is going to have to do whatever you’re doing, so why in the world are you designing the site such that you have to do something funky there?

So – here is my question. Is there ANY WAY to make visual editor NOT to change the code – leave to code you have written intact so to speak?

No, there isn’t. That’s sort of the whole point. Your client isn’t going to write any code in there, is he? So why would you want it to leave the code he inputs alone?

Hmmm… My client doesn’t want to add the code, he/them don’t know anything about the code. I myself want to add the code because the layout is more complicated than just plain white empty area text on it. I have many different kinds of pages on the website I’m making. There are personel introduction with images and table structures with hovering, many kinds of presentations of the office they have and also there is plain text going in all sorts of ways. Then there is the news page which is why I chose the WordPress as CMS. The news page is mainly the page my client wants to update, which is no problem. It’s the sort of thing WordPress is perfect for.

Every now and then they need to update also other pages which have more complicated structures (or “poor design” as Otto42 called it). The HTML and CSS has been tested and is valid. When my client opens those pages to visual editor, those structures change and the layout is not the same anymore.

To me and my client the website looks great and the site works well as a plain html/css website (I mean if it’s running without WordPress). I can make it look ok with WordPress but it doesn’t function well when you need to update the more complicated pages. If it’s so that visual editor of the WordPress is the ultimate decision maker what’s good design and what’s poor design, then it’s propably poor design. Dunno – go figure.

Your client isn’t going to write any code in there, is he? So why would you want it to leave the code he inputs alone?

Yes, he/them will not write any code at all. But the pages they need to update are made of codes. My wild fantasy was that it would be easy for them to update the pages with WordPress. But I guess it ain’t so – and the reason is also clear: the poor design.

One question still bugs me. Why WYSIWYG-editor can’t show the page as it is? I mean – why it has to change the code? I find it strange.

– TH

Ahhh, you’re making sense now. Let me restate your problem as I understood it:

Your client isn’t writing new posts. (Well, maybe he is, but that’s not the issue here.) Your client is updating pages (in the WP meaning of “page”) that you wrote previously. But when you wrote them, you inserted markup using the code editor, but that markup disappears when the client opens the page in the visual editor. Is that the problem?

Lots of people complain about the visual editor’s “cleanup” functions, so let’s not get into the debate here as to why it removes certain code. Instead, let’s discuss the practical solution. Basically, it’s the one Otto gave to you: Separate content from presentation.

The best thing in this situation (assuming you stick with WP) is to go back and write the page entirely using the visual editor, like your client will do when he updates the page in future. Then, use your stylesheet (rather than code embedded into the post) to make that page look the way you want it. Alternatively, use a unique page template for the specific page in question (read more).

I kind of understand what he means. I have designed several web sites for different clients. They like to maintain their sites. I have a policy that if they break it after I’ve given it to them, I’ll be happy to fix it. But it will cost.

One client in particular likes to add his own page content. I’ve designed the site to use, in some cases, pullquotes. So that he can use pullquotes in his pages or posts if he wants to, I’ve simply added a button to the quicktags.js file and he uses the plain old WP editor. There’s nothing on the plain editor that he can’t use, he at least knows how to upload his own images and click the “Send to Editor” button, and he does quite a bit of posting of YouTube videos so the WYSIWYG editor just wasn’t gonna fly.

I thought this was a nice solution, tailor made to his needs. I have done this with other clients, just created a button that calls the stylesheet class (open/closed) and put it in the quicktags.js file and they love it.

You might consider that depending on what function you are trying to implement. ??

Thank you very much for advice. I didn’t even know that you can have unique page templates. It’s good news. It may be the solution to my problems. I try it or the other methods. Thanks!

-TH

Ps. I still silently and very queitly wish to see visual editor which have on/off-option for the cleanup functions. ??

Well, I can see why it might be that way. Although now that WP is used more and more as a true CMS, it stands to reason that more people will be updating their own content, and that doesn’t mean just posts anymore. If any anyone is going to do is create new posts or edit existing posts, the WYSIWYG editor is, as Otto said, all they should be using.

But once they start stomping around on the back end, they better know what they are doing or know someone to call who does when (not IF, but WHEN) their site (or at least the design) blows up.

I’m not sure why your page design is so problematic and why the design would change so drastically from one page to another without an example. But custom page templates might definitely be your answer.

Good luck with the project.

Oh, pshaw! Why do anything “silently” around here!? I doubt there are many “shrinking violets” on this board; no one here is shy! Go ahead, be loud and proud! ??

Download and instal the Advanced TinyMCE editor from: https://www.mkbergman.com/?page_id=383
This will allow you to add Divs.

A workaround is to go to Admin Panel / Users / Your Profile and untick Use the visual editor when writing

OR try this:
1. Open the file called tiny_mce.js located in the wp-includes\js\tinymce folder
2. Goto line 130 – look for this: `this._def(“extended_valid_elements”, “”);
3. Change it to this: this._def(“extended_valid_elements”, “div[id|class]”);`
Thanks to Scott Bernadot in a comment at: https://urbangiraffe.com/plugins/disable-wpautop/

OR try this plugin: Disable WPautop at https://urbangiraffe.com/plugins/disable-wpautop/

OR (not recommended) you can change the tiny_mce_config.php file

Change 'p/-div[*]
to 'p[*],-div[*]

'-'means remove empty elements
'p/div' means replace div by p
'[*]'means any attribute allowed
With thanks to: Xzeed at https://www.ads-software.com/support/topic/139510

i’m with maisteriharju. stripping out divs classes and ids is a pain.

I edit people’s blog posts, i want to be able to use tinymce editor (code view) in admin mode to add a little style to vanilla text n pics.

Advanced editor is not an option as this gives punters too much opportunity for ‘overdesign’ (and they have to figure out all the buttons). i have to clean it up.

my punters dont have the knowledge to code html so they are not going to add erroneous code. they are unlikely to move from pure wysiwg.

but i need to work on their entries via the code view. what’s the problem with that?

Anyway thanks richarduk, i tried changing tiny_mce.js and tiny_mce_config.php.

i can use divs now, but attributes are still stripped out, something else at work here (WP 2.3.2)?

Upgrade to 2.5?

Theoretically that’s meant to be better at letting users insert their own code etc.

There are many good reasons why there should be an option to turn off the visual editor’s revision of code, not the least of which is that designers of code generators cannot possibly anticipate everyone’s needs.

WP’s code “clean-up” (frequently “mess-up”) was a problem even before using WP as a CMS, which I have begun to do recently (with some reservation). I too would like to design pages and templates that require somewhat more complicated code, but that can later be edited by the user in the visual editor. This is *mostly* possible, until the editor, in its mysterious way, decides that it doesn’t like something. And sometimes the “clean-up” even removes code, such as carriage returns, that are entered through the visual editor.

WP provides a lot of flexibility – defense of such a defective editor (and insulting people who are essentially reporting a major bug) instead of seeking solutions is unfortunate. Version 2.5.1 doesn’t seem much better to me, and I’m hoping that in the future there will be the possibility of turning off the clean-up function entirely while maintaining the visual editor (many of us know code better than the visual editor does).

One other issue: when one follows good code formatting practices, the WP editor completely undoes it and makes code much harder to read.

I thoroughly agree with ceilidhdad here. I am no high-and-almighty web-standards person, but I do check that my work is of a good standard format, so I do find it annoying when the visual editor decides to change it to what it thinks is better.

WYSIWYG editors are notoriously bad for sometimes making inappropriate changes, and although I love WordPress and think they’ve got a lot of things right (setting the gold standards for quite a few other scripts) there is always room for improvement for the WYSIWYG editor. I would also welcome an on-off button as originally suggested by maisteriharju.

I posted on another post but have to add my $0.02 here as well. I agree that we should be able to edit a post/page’s html without it being edited as it is currently (and I’m running 2.5.1). I design the site and insert the code I want into the post/page using the HTML view, and if the client wants to make a simple edit change to the text, if he for example wants to add several spaces in a row, by using the visual editor and hitting the “return” button (to generate page breaks) 2 or 3 times he gets absolutely nothing. So if I go into the HTML and actually place
tags where he wants his page breaks, it STILL strips them, and, to me, this is completely unacceptable. I’m not trying to add some unGodly piece of html scripting or coding. Simple page breaks or new paragraphs are stripped and this is ridiculous.