Main Program to use Nicedit

The Nicedit WYSIWYG Content Editor is very small, but useful editor. By including a javascript file, you can use it on your web page. In addition to the basic function, you can write extension of the WYSIWYG editor.

The nicedit is very small, and has sophisticated library, whose name is "bklib". When you customize it, you have to understand the library. But after learning it,  you'll find it is very useful library to use on Javascript programming.

The bklib mainly provides function to control the closure of Javascript. The best way to learn it is to actually work it on your web browser.

In this page, I'll show you the example to use it with extension script.

Source code location

The location of the source code using WYSIWYG editor is in the "/ALINOUS_HOME/samples/nicedit/" folder.

Niceedit user source code

The "index.html" is the main part of this page.

Using Nicedit

The source code of the "index.html" is below.


This Html and Javascript in it uses the Nicedit editor.

Included files

This Html code includes necessary external files in following part.


The base file to use Nicedit is below.

  • /jquery/nicedit/nicEdit.js

And the extension codes are below.

  • /samples/nicedit/ext/nicetable.js
  • /samples/nicedit/ext/niceanchor.js
  • /samples/nicedit/ext/nicimages.js
  • /samples/nicedit/ext/niceobjects.js
  • /samples/nicedit/ext/nicealinous.js

About those extentions, this website explains about them, so take a look at the parent page, which is WYSIWYG Content Editor.

Setting WYSIWYG editor

In order to put the WYSIWYG Editor on the web page, put textarea tag with id attribute like below.

This textarea's id is "area1", and make it be a WYSIWYG editor instance. In order to do that, write javascript and stylesheet in the header section of the Html like below.


This javascript load Nicedit instance with the extension, and apply the instance to the textarea whose id attribute is "area1".


Go to Top