Appendix:
I. How to set the language for uploading files
In the fckconfig. js file under the root directory of FCKeditor
Var _ FileBrowserLanguage = 'asp '; // asp | aspx | cfm | lasso | perl | php | py
Var _ QuickUploadLanguage = 'asp '; // asp | aspx | cfm | lasso | php
The two lines are changed to the editor language you need to call. If asp.net is used, it is changed to aspx;
2. Solve Chinese problems:
Add the following to web. config:
<Globalization requestEncoding = "GB2312" responseEncoding = "GB2312"/>
In this way, Chinese files can be displayed, but the URL address is also Chinese;
If the server does not parse the Chinese address properly, the image may not be browsed;
So modify: editor \ filemanager \ browser \ default \ frmresourceslist.html
In OpenFile function
Window. top. opener. SetUrl (fileUrl );
To:
Window. top. opener. SetUrl (escape (fileUrl ));
3. Set the upload directory:
1: Set in web. config:
<Deleetask>
<Add key = "FCKeditor: UserFilesPath" value = "/fck/UpLoad/"/>
</AppSettings>
2: Set in Session:
Add the following code to editor \ filemanager \ browser \ default \ connectors \ aspx \ connector. aspx:
<Script runat = "server" language = "C #">
Protected override void OnInit (EventArgs e)
{
Session ["FCKeditor: UserFilesPath"] = "/fck/UpLoad1 /";
}
</Script>
In asp.net, how does one dynamically set the path for uploading images?
1. Modify the value of FCKConfig. ImageBrowserURL in javascript as follows:
FCKConfig. ImageBrowserURL + = "? Path = Path of the file to be uploaded ";
For example, to upload a file to the UploadFile folder in the root directory of the site, set it:
FCKConfig. ImageBrowserURL + = "? Path =/UploadFile ";
2. Add the following program to the end of the "editor \ filemanager \ browser \ default \ connectors \ aspx \ connector. aspx" file:
<Script runat = "server" language = "C #">
Protected override void OnInit (EventArgs e)
{
If (Request. QueryString ["Path"] = null ){
Session ["FCKeditor: UserFilesPath"] = "/UpLoadFiles/"; // set the default value
} Else {
Session ["FCKeditor: UserFilesPath"] = Request. QueryString ["Path"];
}
}
</Script>
--------------------------------------------------------------------------------
Configuration and usage skills in multiple Environments
--------------------------------------------------------------------------------
Add right-click menu in fckeditor
I am going to introduce how to configure FCKEditor on the Internet. There are many examples of how to streamline it. If you need it, You can google it. I don't need to go into details here. Now we will introduce how to customize this editor, including how to add items on the toolbar, generate responses, and right-click the menu. It seems very easy!
The book is back to the beginning.
1. Custom right-click menu:
1. First, add the name of the toolbar item you want to add in editor/lang/zh-cn.js, this file defines a FCKLang variable, written in the format of the inside, such as: First: "1", note that if it is not in the penultimate line (the penultimate line is "}"), the comma at the end must exist. Otherwise, no editor will appear on the webpage, I have made such a low-level mistake. After waking up, I would like to say hello to a quiet mouth. We are Chinese, and naturally correspond to Chinese after the colon, this is what will be displayed on the web page in the future.
2. In the editor/_ source/internals/fckcommands. create a new command in js: case 'first': oCommand = new FCKFirstCommand ('first', FCKLang. first); does break pay attention to the FCKFirstCommand in the red font? This is a custom command. We will discuss it later.
3. Then, add a context menu in editor/_ source/internals/fckcontextmenu. js. In case 'generic ': Add the following: oGroup. add (new FCKContextMenuItem (this, 'first', FCKLang. first, true). If the fourth Boolean parameter is set to true, the menu has an icon, and vice versa. Here, I specify that my custom menu has a graphic icon, so I should put the icon under the editor \ skins \ xxx \ toolbar directory, among them, xxx is the skin of the editor you selected in your configuration file, but our icon name is learned and must be renewed. OK, so the right-click menu is added. Run your webpage to see if FCKEditor works? If it does not work, you need to refer to this article again ^_^.
4. Then, the most critical step is to upload the file!
5. Now we will discuss the FCKFirstCommand in step 2. After the menu is added, what functions do you have to have? Well, create this class in editor/_ source/commandclasses/fck_othercommands.js:
Four FCKeditor practical application skills
After a class is created, two static functions are created: xxx. prototype. Execute, xxx. prototype. GetState. The former is an event processing function, that is, all the functions to be executed by right-clicking the menu are written in this function, and the latter returns the menu status (available? Unavailable ?). To demonstrate this, we implement the simplest function: FCKPageCommand. prototype. Execute = function () {window. alert ("It works! ");} Is simple enough, but a prompt box is displayed. Of course, here we can also use the FCKFirstCommand defined by FCKEditor, for example, FCKDialogCommand, which is also defined in fck_othercommands.js. Of course, if so, A dialog box is displayed. Run the webpage again, right-click, and click your custom menu. Is a prompt box displayed?
FCKeditor has now reached version 2.3.1. For WEB developers in China, it has basically been "How much is known", and many people have integrated it into their own projects, many other large websites have benefited from this. Starting today, I will give a little introduction to some of the techniques I have summarized during the use of FCKeditor. Of course, these are actually what FCK originally has, but they are not found when many people use FCK.
1. Open the editor in due time
Most of the time, you do not need to open the editor directly when opening the page, but only open it when you use it. This gives you a good user experience, on the other hand, it can eliminate the impact of FCK on the page opening speed during loading,
Click "Open Editor" to Open the Editor interface.
Implementation principle: Use the javascript fck to create a hidden TextArea domain during page loading (without enabling FCK, the name and ID of this TextArea must be the same as the name of the created FCK instance. When you click the "Open Editor" button, you can call a function to create FCKeditor using the ReplaceTextarea () method of FCK, the Code is as follows:
<Script type = "text/javascript">
<! --
Function showFCK (){
Var oFCKeditor = new FCKeditor ('fbcontent ');
OFCKeditor. BasePath = '/FCKeditor /';
OFCKeditor. ToolbarSet = 'basic ';
OFCKeditor. Width = '000000 ';
OFCKeditor. Height = '20140901 ';
OFCKeditor. ReplaceTextarea ();
}
// -->
</Script>
<Textarea name = "fbContent" id = "fbContent"> <textarea>
2. Use the FCKeditor API
The FCKeditor Editor provides a rich set of APIs to implement many customized functions for End users, such as basic data verification, the fck api provides the GetLength () method to determine whether content exists in the current editor area by using JS when submitting the file;
For example, how to insert content to FCK through a script and use InsertHTML;
Also, when you customize features, the intermediate steps may need to execute some nested FCK operations, so use the ExecuteCommand () method.
For a detailed list of APIS, see the FCKeditor Wiki. For common APIs, see _ samples/html/sample08.html in the fck compressed package. No code is pasted here.
3. external editing bar (multiple editing fields share one editing bar)
This feature is provided only in Version 2.3. If FCKeditor of the previous version uses multiple editors on the same page, it must be created one by one. Now, this external function is available, you don't have to worry about it. You just need to place the toolbar in a proper position, and then you can create and edit domains without restrictions,
To implement this function, you must first define the container of a toolbar in the page: <divid = "xToolbar"> </div>, and then set it based on the container id attribute.
ASP implementation code: <div id = "fckToolBar"> </div>
<%
Dim oFCKeditor
Set oFCKeditor = New FCKeditor
With oFCKeditor
. BasePath = fckPath
. Config ("ToolbarLocation") = "Out: fckToolBar"
. ToolbarSet = "Basic"
. Width = "100%"
. Height = "200"
. Value = ""
. Create "jcontent"
. Height = "150"
. Value = ""
. Create "jreach"
End
%>
JAVASCRIPT implementation code: <div id = "xToolbar"> </div>
FCKeditor 1:
<Script type = "text/javascript">
<! --
// Automatically calculates the editor base path based on the _ samples directory.
// This is usefull only for these samples. A real application shoshould use something like this:
// OFCKeditor. BasePath = '/fckeditor/'; // '/fckeditor/' is the default value.
Var sBasePath = document. location. pathname. substring (0, document. location. pathname. lastIndexOf ('_ samples '));
Var oFCKeditor = new FCKeditor ('fckeditor _ 1 ');
OFCKeditor. BasePath = sBasePath;
OFCKeditor. Height = 100;
OFCKeditor. Config ['toolbarlocation'] = 'out: parent (xToolbar )';
OFCKeditor. Value = 'this is some <strong> sample text </strong>. You are using FCKeditor .';
OFCKeditor. Create ();
// -->
</Script>
<Br/>
FCKeditor 2:
<Script type = "text/javascript">
<! --
OFCKeditor = new FCKeditor ('fckeditor _ 2 ');
OFCKeditor. BasePath = sBasePath;
OFCKeditor. Height = 100;
OFCKeditor. Config ['toolbarlocation'] = 'out: parent (xToolbar )';
OFCKeditor. Value = 'this is some <strong> sample text </strong>. You are using FCKeditor .';
OFCKeditor. Create ();
// -->
</Script>
For detailed demos in this section, refer:
_ Samples/html/sample11.html
_ Samples/html/sample11_frame.html
4. File Management and file upload Permissions
The security of file management in FCKeditor is worth noting, but many people have not noticed it, although FCKeditor has always been used to filter the types of uploaded files in each Release version, she has not considered another question: Who can upload files? Who can browse server files?
I encountered this problem when I first started using FCKeditor. Fortunately, NetRube (author of The FCKeditor culture and FCKeditor ASP upload program) promptly reminded me, the method is to modify the FCK upload program, perform permission judgment in it, and then in fckconfig. remove some functions from js. However, with the constant upgrade of the FCK version, the configuration program fckconfig. js needs to be changed once every upgrade. I find bored, so there is no way to better control this configuration? Actually, there is.
In fckconfig. js, there are settings about whether to enable the upload and browsing server. When creating FCKeditor, you can use a program to determine whether to create an editor with the upload and browsing function. First, I first set all the upload and browsing settings to false in fckconfig. js. Then I use the following code:
ASP version: <%
Dim oFCKeditor
Set oFCKeditor = New FCKeditor
With oFCKeditor
. BasePath = fckPath
. Config ("ToolbarLocation") = "Out: fckToolBar"
If request. cookies (site_sn) ("issuper") = "yes" then
. Config ("LinkBrowser") = "true"
. Config ("ImageBrowser") = "true"
. Config ("FlashBrowser") = "true"
. Config ("LinkUpload") = "true"
. Config ("ImageUpload") = "true"
. Config ("FlashUpload") = "true"
End if
. ToolbarSet = "Basic"
. Width = "100%"
. Height = "200"
. Value = ""
. Create "jcontent"
%>
JAVASCRIPT version: var oFCKeditor = new FCKeditor ('fbcontent ');
<% If power = powercode then %>
OFCKeditor. Config ['linkbrowser '] = true;
OFCKeditor. Config ['imagebrowser '] = true;
OFCKeditor. Config ['flashbroath'] = true;
OFCKeditor. Config ['linkupload'] = true;
OFCKeditor. Config ['imageupload'] = true;
OFCKeditor. Config ['flashupload'] = true;
<% End if %>
OFCKeditor. ToolbarSet = 'basic ';
OFCKeditor. Width = '000000 ';
OFCKeditor. Height = '20140901 ';
OFCKeditor. Value = '';
OFCKeditor. Create ();
FCKPageCommand. prototype. Execute = function ()
{
Window. alert ("It works! ");
}
Configure and use FCKeditor in ASP environment
Let's talk about my testing environment: XPSP2, IIS5.1, FCKeditor2.0
Create a new site on IIS. I directly named it FCKeditor.
Create a site in DW. The test Server is a local machine and supports VBScript.
Download FCKeditor2.0, which is open-source and can be found in many places on the Internet ......
The downloaded package should be a compressed package. decompress the package to the root directory of the FCKeditor site and call the package without any changes. When you get there, you will find it easy to die!
Create an index. asp page under the root directory of the site, and add the following code in the <body> section (call the editor ):
<%
Dim oFCKeditor
Set oFCKeditor = New FCKeditor
OFCKeditor. BasePath = "/FCKeditor/" // set the editor path, which is a directory under the root directory of my site
OFCKeditor. ToolbarSet = "Default"
OFCKeditor. Width = "100%"
OFCKeditor. Height = "600"
OFCKeditor. Value = "" // This is the initial Value for the editor.
OFCKeditor. Create "logbody" // the content in the later editor is obtained by this logbody, And the name is determined by you.
%>
After adding this section, do not forget to add the second line before index. asp
<! -- # Include file = "FCKeditor/fckeditor. asp" -->
Include fckeditor. asp. Remember!
That's easy!
Now you only need to use this editor as a control to extract its data: request ("logbody ")
Now let's relax. The test is successful.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
