Ckeditor is a new generation of FCKeditor, which is a redevelopment version. Ckeditor is one of the world's best online web text editors. It is widely used in various websites for its amazing performance and scalability. Ckfinder is a powerful Ajax File Manager. Its simple user interface enables all types of users to learn and use it intuitively and quickly, whether from senior professionals or Internet beginners.
URL:
Ckeditor: http://ckeditor.com/
Ckfinder: http://ckfinder.com/
Use of ckeditor
Preparations
1. Download ckeditor and decompress it to the Web root directory.
2. Simplified directory:
_ Samples folder (the sample file can be deleted)
_ Source folder (Source Program File, which can be deleted)
Changes.html (update list, which can be deleted)
Install.html (Installation Point, which can be deleted)
License.html (license, can be deleted)
Ckeditor configuration (config. js file)
For more information about API parameters, see http://docs.cksource.com/ckeditor_api /. CopyCode The Code is as follows: // customize the ckeditor Style
Ckeditor. editorconfig = function (config ){
// Configure the default configuration
Config. Language = 'zh-cn'; // configuration language
// Config. uicolor = '# fff'; // background color
// Config. width = 400; // width
// Config. Height = 400; // height
// Config. Skin = 'v2'; // editor skin Style
// Cancel the "drag to change the size" Function
// Config. resize_enabled = false;
// Use the basic Toolbar
// Config. toolbar = "Basic ";
// Use the all-around Toolbar
Config. toolbar = "full ";
// Use the custom Toolbar
// Config. toolbar =
//[
// ['Source', 'preview', '-'],
// ['Cut ', 'copy', 'paste', 'pastetext ', 'pastefromword',],
// ['Undo ', 'redo', '-', 'Find ', 'replace', '-', 'selectall', 'removeformat'],
// ['Image', 'flash', 'table', 'horizontalrule', 'smilil', specialchar, 'pagebreak'],
//'/',
// ['Bold ', 'italic', 'underline', '-', 'subscript', 'superscript'],
// ['Numberlist', 'bulletedlist', '-', 'outdent ', 'indent', 'blockquote'],
// ['Justifyleft', 'justifycenter', 'justifyright', 'justifyblock'],
// ['Link', 'unlink', 'anchor '],
//'/',
// ['Format', 'font', 'fontsize'],
// ['Textcolor', 'bgcolor'],
// ['Delimiter', 'showbucket', '-', 'about']
//];
};
ckeditor application
1. Load ckeditor. JS:
2. modify the page command validaterequest = "false"
<% @ page Language = "C #" validaterequest = "false" %>
3. use ckeditor in the label:
text = '<% # BIND ("info ") %> 'runat = "server">
4. obtain or set the content in the Editor
// obtain the content in the Editor
lblview. TEXT = server. htmlencode (this.txt content. text);
// set the content in the Editor
// txtcontent. TEXT = server. htmldecode ("
Settings
");
Ckfinder usage
Preparations
1. Download ASP. Net of ckfinder and decompress it to the Web root directory.
2. Copy the ckfinder. dll file under the/bin/release directory to the site bin directory.
3. Simplified directory:
_ Samples folder (the sample file can be deleted)
_ Source folder (source program files can be deleted)
Ckfinder Configuration
1. Open "\ ckfinder \ config. ascx" and specify the default path for baseurl in the setconfig method, for example:
// Use userfiles as the default path. subdirectories such as images and Flash are automatically generated under the directory.
Baseurl = "~ /Ckfinder/userfiles /";
// Note: Pay attention to "~ /".
2. Integration with ckeditor
Open the config. js file in the ckeditor directory in the function.Copy codeThe Code is as follows: // customize the ckeditor Style
Ckeditor. editorconfig = function (config ){
......
};
Add the following content: copy Code the code is as follows: // integrate ckfinder in ckeditor. Make sure that the ckfinder path is selected correctly.
config. filebrowserbrowseurl = location. Hash + '/ckfinder/ckfinder.html';
config. filebrowserimagebrowseurl = location. Hash + '/ckfinder/ckfinder.html? Type = images ';
config. filebrowserflashbrowseurl = location. Hash +'/ckfinder/ckfinder.html? Type = flash ';
config. filebrowseruploadurl = location. Hash +'/ckfinder/CORE/connector/aspx/connector. aspx? Command = quickupload & type = files ';
config. filebrowserimageuploadurl = location. Hash +'/ckfinder/CORE/connector/aspx/connector. aspx? Command = quickupload & type = images ';
config. filebrowserflashuploadurl = location. Hash +'/ckfinder/CORE/connector/aspx/connector. aspx? Command = quickupload & type = flash ';
// config. filebrowser1_wwidth = '000000';
// config. filebrowser1_wheight = '000000';
Ckfinder applications
1. Add the ckfinder. dll Control in the bin directory of the site root directory in the toolbar.
2. Drag and Drop controls to the web page
3. Modify the ckfinder control attribute basepath to the relative path of the ckfinder directory.
FAQs
1. Symptoms: files cannot be viewed due to security reasons. Contact the system administrator and check the ckfinder configuration file.
Cause: user authentication is not set or the user is not logged on.
Statement:Copy codeThe Code is as follows: public override bool checkauthentication ()
{
Return false;
}
Solution: Modify public override bool checkauthentication () in the config. ascx file of ckfinder to add the user identity permission verification method.
2. Symptoms: Unknown error
Cause: user authentication is not performed, but the baseurl path is incorrect.
Statement:Copy codeThe Code is as follows: public override bool checkauthentication ()
{
Return true;
}
Solution: Modify public override void setconfig () in the config. ascx file of ckfinder.
// Use userfiles as the default path. subdirectories such as images and Flash are automatically generated under the directory.
Baseurl = "~ /Ckfinder/userfiles /";
// Note: Pay attention to "~ /".
3. symptom: An error "HTTP Error 404-not found" is reported when you access a page with ckfinder.
solution: Modify the basepath attribute of the ckfinder control to the relative path of the ckfinder directory.