How to install HTML Editor NicEdit?

NicEdit Installation

Dear Visitors of Our Blog! Today I’d like to tell How to install HTML Editor NicEdit. After installation of visual HTML editor NicEdit you can easily edit pages of your website directly in browser (for example in firefox). If you’d like to download NicEdit, move to page with article NicEdit — rich text editor.

To install NicEdit we need to write two strings in any place of your webpage using JavaScript:

<script src="https://site.softmaker.kz/files/b>" type="text/javascript"></script>

<script type="text/javascript">
	bkLib.onDomLoaded(
		Call functions
	);
</script>

PathToJSFile – Write path with the nicEdit.js file. Functions call – In that place functions are called and they change the view of HTML editor NicEdit.

Example 1:

If you want to convert all textarea tags to rich text editor NicEdit on your page, then you you have to write:

<script type="text/javascript" src="https://site.softmaker.kz/files/b>"></script>

<script type="text/javascript"> 
	bkLib.onDomLoaded( 
		function() {
			nicEditors.allTextAreas() 
		} 	
	);
</script>

The expression “src=”https://site.softmaker.kz/files/b>”” indicate that nicEdit.js file is contained in the root directory on your server. The expression “function() { nicEditors.allTextAreas() }” converts all textarea tags to Inline Content Editor NicEdit on your page.

Example 2:

If you want to change only one textarea tag, you should write:

<script src="https://site.softmaker.kz/files/NicEdit/nicEdit.js" type="text/javascript"></script>

<script type="text/javascript"> 
bkLib.onDomLoaded(
	function() {
		new nicEditor({
			fullPanel : true
		}
		).panelInstance("area1");
	}
); 

 <div>
	<textarea cols="50" id="area1"> 
	</textarea>
 </div>

You can see that to indicate specific textarea tag you should write in the expression:

function() {
	new nicEditor(
	{fullPanel : true}
	).panelInstance("area1");
}

Name of id in our case is id=”area1“.

Example 3:

In order to place several textarea tags with various button sets at a time on one page you need to write:

First, one button:

<script src="https://site.softmaker.kz/files/NicEdit/nicEdit.js" type="text/javascript"></script> 

<script type="text/javascript">

bkLib.onDomLoaded( 
function() { 
	new nicEditor({
		buttonList : ['fontSize']
		}
	).panelInstance("area1");
}
);

<div>
	<textarea cols="50" id="area1"> 
	</textarea>
</div>

Second, nine buttons:

bkLib.onDomLoaded( 
function() {
new nicEditor({
	buttonList : 
	['fontSize','bold','italic','underline','strikeThrough',
	'subscript','superscript','html','image']
	}
	).panelInstance('area2'); 
}
);

<div>
	<textarea cols="50" id="area2"> 
	</textarea>
</div>

buttonList – It is a list of your buttons.

/by