Backpager - Online Wysiwyg Editor

[mahesh2k 0]

I was looking for stackoverflow style WYSIWYG editor. I found such with backpager. Not yet tested on IE or chrome. But using it on firefox 5 as of now. It looks like has similar editing features to that of stack over flow's editor. You can see the preview immediately using this editor which is good and makes it similar to MCE editors. I think the layout is also good and shows preview in right hand side and left hand side seems to be with code. So those who are looking for such online editors should check out this page. You can use this page for wiki and similar other page editor requirement. You can use it and preview it before copying to wiki or stackoverflow or other services.It is also good for online technical documentation which has similar markup. it'll work for most of your needs and i suggest you to check out for yourself.

There are some bugs with it as of now which are surely going to be fixed soon as per developer note. But i think it';s pretty much working for most of the time. Minor list related issues were there which i guess developer fixed few weeks back. So if you want to try this online markup editor then check this site. If you know any other similar markup editor then please feel free to post about it here i would like to know about it as i do some markup for docs online.

[yordan 10]

what does the "online" part of the name mean? Do you edit your page on a remote computer, and then get it back on your own computer in order to put it on your website?

[8ennett 0]

yordan, it seems to be a purely online editor embedded in the page.

Seems to be a pretty basic construct using a couple of jQuery functions to parse the custom syntax. Also the custom syntax seems to be more of a nuisance than a benefit. The buttons provided on the editor don't supply you anywhere near enough custom syntax to create a decent html page. Because of this if you want a html tag that isn't included in the buttons you have to type it in yourself. When you start mixing real html with the custom syntax it's possible you could accidentally trigger a parsing character without knowing it, then when you copy the source you are copying the incorrect html markup. It would probably work out better if they didn't have the custom syntax operators being parsed at the same time as html. Either stick with one or the other. The preview panel is nothing special, I've thrown together a quick example of how to do this without using jQuery. It may not look pretty but that's easily fixed with a little css modifying.

<div style="position: absolute;height: 40%;border: 2px solid  #FF0000;width:90%;"><textarea id="input"  style="position:relative;height:100%;width:100%;"  onkeyup="document.getElementById('preview').innerHTML=this.value;"  onkeypress="document.getElementById('preview').innerHTML=this.value;"></textarea></div> <div style="position:absolute;height:40%;border: 2px solid #000000;width:90%;top:50%;" id="preview"></div>

As you can see it's simply two DIV elements and a TEXTAREA with a little javascript thrown in. This will modify the contents of the preview div with the html you typed in to the textarea. And since it's being displayed in a html div tag, the browser you are using parses it as html giving you an accurate preview in real time. With an extra little piece of coding you can write a javascript file to use BBCode instead of html and parse the output in the preview panel.

Backpager does seem to have potential, the design of the page is easy on the eyes and laid out in an efficient format. Maybe some work on the features such as more code buttons (text alignment, text color etc.) and parsing new lines in the editor with line breaks and paragraphs in the preview pane. I like the undo/redo feature as well, thumbs up to jquery for that.

Maybe if implementing this type of editor to a wiki site or something similar, try replacing the html and custom syntax with standard BBCode parser instead. You can write one up in PHP using the preg_replace function to swap the bbcode for html and still display the output in a live preview on the page using AJAX. BBCode seems to be easier to understand than the custom syntax at Backpager.

[mahesh2k 0]

There is another editor which is available for free. It has both online and offline download versions. You can download this editor on dekstop and do the changes. I don't know how it works on desktop as i have used it on my browser as of now. But soonwill test it on desktop as well. You can get this editor - called CKeditor. It is good text editor with all the modern features included in it. I guess this editor is built in inside forums like Vbulltein and Punbb. Not sure if other forums like electron forums etc are supporting it as of now. Most of the options which were included in backpages are also into this IDE. So there is no loss of features. You can also test it live in your text editor or by pressing the view button. It lets you choose interface color for the IDE. It also has custom toolbar for some of the tasks. Multi-language interface is also supported. You can also see if there are any skins available for the IDE. I'm sure desktop version of this IDE is going to be interesting. I am going to try it soon, so this one is just for you if you like such IDE's.