How ought to be a go about creating a WYSIWYG web-based manager for input, ie. for news creation in a very CMS.
We’ve used google a lttle bit to find an answer, but when rendering comes around, Personally i think like I’ve missed something.
There’s no doubt that the general idea would be to have a iframe rather than a textarea. That you just then via JavaScript first turn on designMode on this document(iframe)
document. getElementById(editor). contentDocument. designMode = " on";
After this somewhat unsure. I have following, just a text hyperlink in making the text bold
< some sort of href=" javascript:; " onclick=" formatButton('teaser', 'Bold'); " unselectable=" on" > Bold< /a>
But it lets you do nothing. Also, I can’t give any data towards the iframe. So when editing a preexisting news article the item just shows nothing at all. Tried using JS to write (. innerHTML) towards the iframe, but very little luck.
Any help is great guys
I’m assuming you no longer want to employ, for example, FCKEditor
Probably not. I’d really like to understand how to do it by myself, for future benchmark. Also, I’ll be using it in some sort of commercial product, hence the more I do myself more suitable.
Cheers for the link tho, haven’t heard about that one prior to
Somethings job now, yet quite a few don’t.
Could possibly get ‘undo’ and ‘redo’ to figure. But can’t obtain bold, italic, underline or whatever else to work.
function initEditor(editor)
in case ($(editor). contentDocument)
$iframe = $(editor). contentDocument;
different
$iframe = thiseditor. insurance plan;
$iframe. designMode = " on";
try out
document. getElementById(editor). contentWindow. insurance plan. execCommand(" undo", phony, null);
catch (e)
alert(" This demo just isn't supported on your degree of Mozilla. " );
operate formatButton(editor, command)
in case ($(editor). contentDocument)
try out
$(editor). contentWindow. insurance plan. execCommand(command, false, null);
catch (e)
alert(" This demo just isn't supported on your degree of Mozilla. " );
different
window. frameseditor. focus();
thiseditor. insurance plan. execCommand(command, false, null);
$(editor). contentWindow. focus();
The exclusion throws:
Exclusion… " Component go back failure code: 0x80004005 (NS_ERROR_FAILURE) nsIDOMNSHTMLDocument. execCommand" nsresult: " 0x80004005 (NS_ERROR_FAILURE)" position: " JS mode:: http: //localhost/belujam/javascripts/global. js:: formatButton:: brand 224" data: not any
Ahh. Foolish Mistake on my own part. I experienced a. tpl file since the src of the iframe instead of a html document. It must n’t have forced the HTML formatting
I understand you require to build this yourself but a lot of Javascript WYSIWYG publishers produce massive volumes of spaghetti value.
We would suggest http: //www. xstandard. com/, it’s really a cross-browser WYSIWYG editor that produces totally valid XHTML and CSS. Even if it’s no use to you it is usually of use to another individual.
Just looked at that out. Not bad! Even free with regard to commercial use
Give it a move. Thanks dchesterton
In my opinion FCKEditor does the identical (valid XHTML/CSS), it is both free to get commercial use and Free like for example Freedom.
SOME SORT OF question, though — it appears you’re using this Prototype library here and there, nevertheless you’re still utilizing document. getElementById. Every reason Also, why name your variable having a $ in entrance
Yeah, applying Prototype. Most in the above was simply cut and paste from your Mozilla demo, can’t remember what ?t had been called.
" Additionally, why name your variable having a $ in front"
Ahh, didn’t spot that one! Thanks. Mostly utilizing PHP as you can prolly tell
Thinking of sure FCKEditor is actually free for business use
Hehe, really. Isn’t it well put together that Javascript will not mind, though Along with doesn’t the Prototype stockpile *rock this world*
FCKEditor is distributed under the GNU Lesser Majority of folks License, which, contrary to the GPL, just isn’t viral. The only requirement is if you distribute software that uses some sort of library or additional program under this LGPL, you must distribute the source WITH THE LGPLed PROGRAM MERELY (i. e., not for yours) under the same LGPL. Also, if you ever change the LGPLed program code, you have that will license it underneath the LGPL. Using that signal from elsewhere does not necessarily mean that elsewhere’ should be distributed under an Open Source licenses, however. The LGPL was created precisely and so free software might be used in commercial settings, theoretically to permit free software that’s not dominant in the field to come to be dominant through financial adoption.
Superb. Like the appear of FCKEditor Looks much better than the other.
Always with the Prototype library. Esp. with script. aculo. people
Indeed. Script. aculo. us also kicks some serious behind in most many ways.
In my practical experience I always found FCKEditor to be quite tempremental, sometimes the code is perfect but most times it wouldn’t be. The thing I favor about XStandard is the fact that it allows people (the CMS designer) more control over what a computer owner can input, at the. g. No Crimson 64pt Times Brand-new Roman text *shudder*. You instead place in your specified stylesheet and let the consumer choose from these pre-defined styles.
Also there is a massive difference somewhere between semantic and appropriate code; for example annoying enter twice in FCKEditor provide you with minicode< br /> < br /> /minicode whereas XStandard provide you with a new paragraph precisely as it should be.
However hey, what’s good for one isn’t always good for many
So pressing enter’ once will give you a line split and pressing this twice turns the actual line break proper paragraph
Irregardless, this is this difference between the phrase and LaTeX solutions, in my eyes — What You observe Is What You receive versus What You see Is What Everyone Mean.
No pressing enter once will give you a new paragraph but in the event you press shift+ent