ASP. NET CKEditor and Ckfinder configuration

The first time this really made a big head, at least eventually learned. Share the steps below

The first step:

Download CKEditor Latest and Ckfinder latest NET version of the website

Step Two:

Unzip 2 copy files to the bottom of the website, preferably on a lateral

The third step, remember to refer to the following DLL under Ckfinder

Fourth Step:

Configuring the Ckedit tool bar

In the config.js underneath the Ckedit, I'm a simple toolbar.

Config.language = ' ZH-CN ';
Config.uicolor = ' #DBEEF5 ';
Config.toolbar = ' full ';
Config.height = 400;
config.resize_enabled = false;
Config.toolbar_full = [
[' Bold ', ' Italic ', ' underline ', ' Strike ', '-', ' subscript ', ' superscript '],
[' Numberedlist ', ' BulletedList ', '-', ' outdent ', ' Indent '],
[' Justifyleft ', ' justifycenter ', ' justifyright ', ' Justifyblock '],
[' Format ', ' FontSize '],
[' TextColor ', ' BGColor '],
[' Image ']
];

corresponding picture

Below this is all the toolbar configuration you choose

Config.toolbar_full = [
[' Source ', '-', ' Save ', ' NewPage ', ' Preview ', '-', ' Templates '],
[' Cut ', ' Copy ', ' Paste ', ' pastetext ', ' Pastefromword ', '-', ' Print ', ' spellchecker ', ' Scayt '],
[' Undo ', ' Redo ', '-', ' Find ', ' Replace ', '-', ' selectall ', ' Removeformat '],
[' Form ', ' Checkbox ', ' Radio ', ' TextField ', ' Textarea ', ' Select ', ' Button ', ' ImageButton ', ' HiddenField '],
‘/‘,
[' Bold ', ' Italic ', ' underline ', ' Strike ', '-', ' subscript ', ' superscript '],
[' Numberedlist ', ' BulletedList ', '-', ' outdent ', ' Indent ', ' Blockquote '],
[' Justifyleft ', ' justifycenter ', ' justifyright ', ' Justifyblock '],
[' Link ', ' Unlink ', ' Anchor '],
[' Image ', ' Flash ', ' Table ', ' horizontalrule ', ' Smiley ', ' Specialchar ', ' pagebreak '],
‘/‘,
[' Styles ', ' Format ', ' Font ', ' FontSize '],
[' TextColor ', ' BGColor ']
];

Fifth Step integration with Ckfinder

Or the config inside the Ckeditr

To integrate Ckfinder in CKEditor, note that the path selection for Ckfinder is correct.
Config.filebrowserbrowseurl = Location.hash + '/admin/ckfinder/ckfinder.html ';
Config.filebrowserimagebrowseurl = Location.hash + '/admin/ckfinder/ckfinder.html? Type=images ';
Config.filebrowseruploadurl = Location.hash + '/admin/ckfinder/core/connector/aspx/connector.aspx?command= Quickupload&type=files ';
Config.filebrowserimageuploadurl = Location.hash + '/admin/ckfinder/core/connector/aspx/connector.aspx?command= Quickupload&type=images ';
Config.filebrowserwindowwidth = ' 800 ';
Config.filebrowserwindowheight = ' 500 ';

And then configure Ckfinder to find the Config.ascx. Return this method to True allows uploading

and set the path to the image upload

Last use

Reference 2 JS

<script src= "Ckeditor/ckeditor.js" type= "Text/javascript" ></script>
<script src= "Ckfinder/ckfinder.js" type= "Text/javascript" ></script>

Add class= on the control "CKEditor is OK.

<asp:textbox id= "tbcontent" runat= "Server" textmode= "MultiLine" class= "CKEditor" ></asp:TextBox>

ASP. NET CKEditor and Ckfinder configuration