In a previous post that I posted here, I got responses that contentEditable and designMode are bad practices. So I switched to TinyMCE, but that uses designMode as well... is there something bad about it?
Im using it for a Rich Text editor on my website fyi.
They were trying to tell you not to re-invent the wheel.
If you're using designMode, you probably want either a rich text editor (with toolbars) or a syntax-highlighting code editor.
In either case, you should reuse existing libraries rather than re-creating them from scratch. (Rich text editors are hard, especially across browsers)
Related
I'm making a forum-like website, and really want to implement a WYSIWYG editor if possible because my targeted users are foreign to technical work. Doing something like image upload/display/resize using markups will be too hard for them I suppose.
But after reading here on stackoverflow and trying it out myself, I suppose the WYSIWYG editor I'm using (WYSIHTML5) won't be safe enough for public use.
So come my questions:
Is there any "WYSIWYG editor"-like library that doesn't actually use html markup? Something like stackoverflow's editor (with toolbar and a real time preview box) is acceptable actually.
If there's nothing like that, is there anyway you can think of to implement WYSIWYG editor that can prevent user from doing harm to the server and/or other users? What can I do to ensure that?
If you like StackOverflow's editor and think it will fit your needs, it's called PageDown. You can find the code here.
Right now I am using the TinyMCE wysiwyg editor within my projects.
However there are some disadvantages with tinyMCE:
Tons of GET requests
Big
It is slow. I can't have a large number of TinyMCE editors at the same time. (Especially in IE)
Changing the DOM position of the TinyMCE caused issues where the listeners got lost.
Complicated to generate new TinyMCE editors dynamically during "runtime".
Hard to control by jQuery
Is there any WYSIWYG editor you would suggest?
A big plus would be a jQuery based editor as this project works with jQuery anyway.
You could try CKEditor http://ckeditor.com/blog/CKEditor_for_jQuery (formerly FCKeditor)
I'll suggest jHtmlArea, its jQuery powered and its quite fast
1 image file using CSS Image sprites
1 line of javascript, 1 line of CSS
I have used it in a lot of projects before and its quite good.
http://jhtmlarea.codeplex.com/
CKEditor is Slow!
If you need something as fast as possible, you could use http://unverse.net/Whizzywig-2011, but its ugly, so there is also something like http://aloha-editor.org/
I am after a JavaScript Rich Text Editor that supports highlighting words and triggering events when those highlighted words are clicked, like what Gmail does when in spellcheck mode.
I will need to heavily customize any existing solution, so something that is easy to extend would be ideal. Currently I am leaning towards TinyMCE.
Richtextbox or HTML?
If it is HTML, then you should stick with TinyMCE. :
It's (very) easy to integrate
It works across browsers
The toolbars were easy to modify
Wordpress uses it!
For what its worth, we also looked at FCKEditor but preferred TinyMCE
UPDATE: While some users wanted it, spell checking has never been on the "essentials" list. It has always been quicker / cheaper for us to teach the handful of users how to use the spell checking features of IE, Firefox or Chrome instead of putting it in the editor.
Imagine trying to code the 3 been soup example!!!
TinyMCE seems to be the best one these days. You might want to take a look at FCKEditor and HTMLArea as well. You can find a list of such WYSIWYG HTML editors here.
What are the options for something that will let users make text bold/italic/underline/etc as they are writing in a textarea and work in all browsers?
Give a look to FKCEditor, I always recommend it...
I always liked TinyMCE
http://tinymce.moxiecode.com/
I favor the Rich Text Editor in the YUI
I've used InnovaStudio WYSIWYG. Pretty extensible and cheap.
FCKEditor is a popular choice, although it's incredibly bloated. There's a nice simple example in jQuery jQuery Plugins
I wrote my own in the end as I wanted to customise the editor quite a lot. It's not too difficult to do and typically involves popping an iframe on the page, setting the contenteditable to be true and then using a simple javascript command to update the html of the iframe.
I am intended to develop a rich input textarea similar to Google mail. Any ideal or resource to share? Thanks in advance!
My suggestion is to use TinyMCE it is a great Rich Text Box. Yahoo also has a really great Rich Text Editor (which has been deprecated).
These are not textareas, btw - they are IFRAMEs holding full HTML managed by the editor code. I also recommend FCKeditor - very configurable and easily integrated. You can write your code using textareas, make a javascript call and those textareas go hidden and the IFRAME gets injected in place. Upon submit the html gets copied back in the textarea. so really don't need to do much...
I am not sure what google uses, but I've used FCKEditor and it worked out great.
Look at the ContentEditable tag. And also have a look at Squire on gihub which is an open source rich text editor that is very lightweight and flexible (used in opera's mail client)
The editors given in the other answers are very heavy and come with their own (outdated, bloated) UI components.