Methods and configuration methods for calling the fckeditor editor in asp.net

Source: Internet
Author: User
Tags file upload net command php tutorial

I. Integration method
FCKeditor is applied in ASP. NET, two groups of files are required, one is FCKeditor itself, and the other is used for ASP.. NET FCKeditor control (divided into 1.1 and 2.0 versions. Version 2.0 is used here ).

1. Add FCKeditor to the project.
Decompress the FCKeditor editor and get the fckeditor folder. Copy the folder to the project of the Web application (or the child directory ).
Decompress the FCKeditor control and have an assembly in its subdirectory bin/Release/2.0. Reference this assembly in a Web application project.

2. Use FCKeditor on the page
There are two methods.
(1) manual encoding
Add the ASP. NET command to the page:
<% @ Register Namespace = "FredCK. FCKeditorV2" Assembly = "FredCK. FCKeditorV2" TagPrefix = "FCKeditorV2" %>
Add the FCKeditor control as needed:
<FCKeditorV2: FCKeditor id = "FCKeditor1" runat = "server"/>
(2) integrated into the Visual Studio Toolkit
Open an ASP. NET page, expand Toolbox, right-click the menu, and select "Choose Items... ", in the displayed" Choose Toolbox Items "session Box". on the "NET Framework Components" tab, select "Browse", find and select the FCKeditor assembly, open it, return to the "Choose Toolbox Items" window, and click "OK" to import the control.
In this case, a control named FCKeditor is displayed under the General category of Toolbox, which can be used just like the built-in control of Visual Studio.

3. Configure the path of the FCKeditor editor.
The FCKeditor control is used on the page. You need to know the path of the FCKeditor file group. There are two configuration methods.
(1) configure web. config
Add
<Add key = "FCKeditor: BasePath" value = "~ /PathOfFCKeditor/"/>
After this configuration method is used, you do not need to configure its BasePath attribute for the FCKeditor control used on any page of the project.
(2) directly configure the FCKeditor control used
In the code on the page, set the attribute BasePath of FCKeditor to the path of the FCKeditor file group, or set its BasePath value in the Page_Init event processor.

4. Configure the FCKeditor file Upload path
In the appSettings configuration section of web. config, add
<Add key = "FCKeditor: UserFilesPath" value = "~ /YourUploadFilePath "/>
   
This completes the integration of FCKeditor to ASP. NET pages.


II. Configure FCKeditor
According to the default configuration of FCKeditor, you can complete some common HTML visual editing tasks. However, further configuration is required in actual applications. The FCKeditor control has few configurable attributes and can only act on one single instance after configuration. In fact, you need to configure the common configuration file/fckconfig in the FCKeditor file group. js and ASP.. NET private file Upload management code file/editor/filemanager/connectors/asp tutorial x/config. configure ascx.
   
1. Configure the control language
FCKeditor automatically detects the language encoding used by the browser. The default language is English. Modify the configuration line "FCKConfig. DefaultLanguage = 'en';" to 'zh-cn'. Use Chinese as the default language.

2. Configure the control application technology
FCKeditor is used for php Tutorial technology by default. Modify the configuration line "var _ FileBrowserLanguage = 'php';" and "var _ QuickUploadLanguage = 'php';" to 'asp', using ASP. NET technology.

3. Configure the Tab key
The default Tab key is unavailable in FCKeditor. You can modify the configuration line "FCKConfig. TabSpaces = 0;" to 1, and enable the Tab key.

4. Customize the FCKeditor toolbar
FCKConfig provides two toolbar configurations. In the configuration line "FCKConfig. ToolbarSets [" Default "] = [...];", the configuration of all available buttons is defined (as the Default configuration of the toolbar ). In the configuration line "FCKConfig. ToolbarSets [" Basic "] = [...];", the toolbar configuration of a simplified button is defined. In actual use, there are too many configuration buttons by default, and there are too few simplified configuration buttons. Therefore, you need to customize the toolbar.
Configuration value [...] in the format of [[v, v2 ,.., vN], '/', [...],...] (vN indicates the name of the button to be displayed, '/' indicates the next row of the subsequent button group. If you do not need a button for the entire group, delete the group (in the form of [,...]). If you only do not need a button in the group, delete the button.

5. Customize available text fonts
FCKeditor is made by foreigners. The default font is also a Spanish font. Modify the configuration line "FCKConfig. FontNames = '...';" and add the names of Chinese characters to be used, such as, and _ GB2312.
By default, FCKConfig uses the HTML font keyword to indicate the optional font size, which leads to inconsistent display effects in different browsers. Therefore, we recommend that you modify the configuration line "FCKConfig. FontSizes = '...';" to remove the font keyword value and add the pixel value or pound value. (Of course, if the global style sheet is defined on the webpage, you do not need to modify this setting, but you should teach the end user how to set the font to achieve the best display effect .)

6. Enable file Upload
FCKeditor provides powerful and easy-to-use file upload functions, but the file upload function is not available in the default configuration, which is based on security considerations. However, I think that access security control should be implemented by programs rather than controls.
In the config. ascx file, modify the value of CheckAuthentication () to true. If you want to upload a file with multiple extensions, set the value of ForceSingleExtension in SetConfig () to false. FCKeditor can upload files, images, Flash files, and multimedia files by default () modify AllowedTypes to increase or decrease the allowed types (this type can be defined in TypeConfig ["TypeName"]. For example, in the AllowedExtensions attribute, you can customize the file extension allowed by this type, customize the file extension that is not allowed in DeniedExtensions ).
In the fckconfig. js file, modify the configuration line "FCKConfig. LinkBrowserURL = FCKConfig. BasePath + 'filemanager/browser/default/browser.html? Connector = '+ encodeURIComponent (FCKConfig. basePath + 'filemanager/ORS/'+ _ FileBrowserLanguage +'/connector. '+ _ FileBrowserExtension); "is FCKConfig. linkBrowserURL = FCKConfig. basePath + 'filemanager/browser/default/browser.html? Type = File & Connector = '+ encodeURIComponent (FCKConfig. basePath + 'filemanager/ORS/'+ _ FileBrowserLanguage +'/connector. '+ _ FileBrowserExtension); "; modify the configuration line" FCKConfig. linkUploadURL = FCKConfig. basePath + 'filemanager/connectors/'+ _ QuickUploadLanguage +'/upload. '+ _ QuickUploadExtension; "is" FCKConfig. linkUploadURL = FCKConfig. basePath + 'filemanager/ORS/'+ _ QuickUploadLanguage +' /Upload. '+ _ QuickUploadExtension + '? Type = file ';". (In this configuration File, it seems that Type = File is used as the default parameter, but if this parameter is not added, an error will occur .)
   
7. Other configurations
For the configuration attributes in these two configuration files, you can easily know the meaning of the two configuration files from the name, which can be basically customized. Note that the format of the attribute value must be correct.


3. Set the FCKeditor file to ASP. NET.
The FCKeditor file group contains files for various application technologies supported by the FCKeditor. Therefore, many files are not required for ASP. NET applications.

In the root directory, only the folder editor is retained. The files fckconfig. js, fckeditor. js, fckpackager. xml, fckstyles. xml, and fcktemplates. xml are retained.
Only the folder aspx is retained under the subdirectory editor, filemanager, and connectors.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.