FCKeditor 2.0 online editor

FCKeditor
The 2.0 version finally came out. The reason why the word "finally" was used was that the FLASH insertion function was widely seen in this version. In all online editors, FCKeditor
It is currently the best editor on the Internet. It has powerful functions, supports multiple browsers, and has no platform restrictions. It can be integrated with multiple WEB languages, supports multiple languages, and is open-source ~~

FCKeditor can directly use a brand new website without any modifications. However, for the vast majority of existing websites, some FCKeditor settings are not suitable for your use. This article aims to tell you how to modify FCKeditor to make it easier for your website to use.

The first task is to streamline the powerful editor. Of course, it is to streamline the file, not the function. Here, I use the FCKeditor of asp as an example to go
FCKeditor
In the 2.0 folder, delete all the folders starting with "_". These folders contain examples or other tools. In fact, only the editor folder,
Fckconfig. js, fckeditor. asp, fckeditor. js, fckstyles. xml, and fcktemplates. xml.
Now, the outermost layer is simplified. after entering the editor folder, delete the "_ source" folder first. Here are some source files, which are useless for use.

Go to the images folder and delete the smiley folder. Some files are placed with emoticon icons. As I will use my emoticon icons, delete them first. Of course, if you want to use
Do not delete the emoticon icon. Exit
Images and then enter the lang folder, here the things can be a big cleansing, only keep fck1_agemanager. js, zh-cn.js, en. js,
Zh. js these four files, the first file is the language configuration file, with it and fckconfig. js settings correspond to the corresponding language file, zh-cn.js is simplified Chinese
Language Pack: en. js. zh. js is in Traditional Chinese. How is it? A few hundred KB is missing at once ~

Exit the lang folder and enter the skin file.
Folder, if you want to use the default fckeditor milk yellow, then delete the other two folders except the default folder. If you want to use other folders, consider it yourself,
I will give you a suggestion. If you don't want to use the default one, select the silver one, because silver, that is, the gray one, and that office2003 skin, I am
I don't like it very much, and the image is relatively large, and the download time is increased. No!

The last step of streamlining, exit the skin folder, and then enter
Filemanager. If you are not using the latest fckeditor version, a folder browser is used. The new version also has an upload folder. One by one
First, go to filemanager/browser/default/connectors/. Because I use asp, delete all files except the asp folder.
Division. Then go to filemanager/upload/, and leave only the asp folder. At this point, the simplified editor has been completed. Next, we will modify the settings of the editor.
Change.

--------------------------------------------------------------------------------

The first modified file is the fckeditor configuration file, which is located in the fckconfig. js file under the root directory. Please follow the list below (take fckeditor 2.0 as the standard ):

Find row 20th FCKConfig. DefaultLanguage = 'en'; change to FCKConfig. DefaultLanguage = 'zh-cn'; set the default language to simplified Chinese
Find row 40th FCKConfig. TabSpaces = 0; change to FCKConfig. TabSpaces = 1; that is, you can use the Tab key in the editor.

If your editor is still used at the front-end of the website, for example, for message book or diary reply, you have to consider security. Do not use the Default toolbar on the front-end or customize the function, either use the Basic defined by the system, that is, the Basic toolbar,
Find row 64th FCKConfig. ToolbarSets ["Basic"] = [
['Bold ', 'italic', '-', 'orderedlist', 'unorderedlist', '-',/* 'link', */'unlink ', '-', 'style', 'fontsize', 'textcolor', 'bgcolor', '-', 'smiley ', 'specialchar', 'replace ', 'preview']
];
This is the Basic I changed. I removed the image function and removed the Add link function, because the image and link and flash and image button adding functions allow the front-end page to directly access and upload files, if I don't change it here, I will upload a Trojan to you. Isn't it ready? However, fckeditor also supports the right-click function in the editing area.
Find row 73rd
FCKConfig. ContextMenu
=
['Generic ',/* 'link', */'anchor',/* 'image', */'flash', 'select', 'textarea ', 'checkbox', 'Radio ', 'textfield', 'hiddenfield',/* 'imagebutton', */'call', 'bulletedlist', 'numberedlist', 'tablecell ', 'table', 'form']
;

This is also the "link, image, FLASH, image button" function that I changed to remove the right mouse button.

Find row 77th FCKConfig. FontNames = 'arial; Comic Sans MS; Courier New; Tahoma; Times New Roman; Verdana ';
Add several common fonts FCKConfig. FontNames = '; _ GB2312; Arial; Comic Sans MS; Courier New; Tahoma; Times New Roman; Verdana ';

The next step is to set the upload function. Take ASP as an example. In fact, the default value of fck is asp. Just delete all the Codes commented out under line 1, and then
After browser.html and upload. asp? Type = XX is changed to Type = YY, where YY is the name of the folder where you want to save the file.

If you still want to use your own emoticon icon, jump to row 3 and change the folder address of the emoticon icon and the file name of the emoticon icon below, the three numbers below are the number of emotices displayed on each line and the width and height of the pop-up window. The size depends on the size of the window arranged by the emoticon icon. OK. The change to the total configuration file is complete.

--------------------------------------------------------------------------------

Next, set the editor location. My habit is to put the editor under the root directory, and the five files mentioned at the beginning are also under the root directory (Tips: it is recommended to put it under the root directory, we recommend that you use
The path is also set to an absolute path, such as "/fckeditor/", and my usual setting is "/"), which is conducive to fckeditor update and upgrade, and all the folders on the website are
It can be called at will. There is no problem where the name of other folders has changed and the editor cannot be used elsewhere.

Open the fckeditor. asp file and find sBasePath = "/fckeditor/" to change it to sBasePath = "/"
Open the fckeditor. js file and find this. BasePath = '/fckeditor/'; change this. BasePath = '/';

The default display font in the editor is 12px, while the default font on my home page is 14px, which makes it quite uncomfortable. You can modify the style sheet to meet the requirements, open/editor/css/fck_editorarea.css and change row 4th to font-size: 14px.

The next step is to set the file to be uploaded. This is troublesome. Please perform this operation carefully.

Open \ editor \ filemanager \ browser \ default \ frmresourcetype.html, locate row 15th, and insert"
['Uploadfile', 'uploadfile'], "in combination with the settings in fckconfig. js just now, my upload file path is
/Uploadfile, of course, you can also change it to the folder you want, but the name here must be the same as the YY in "Type = YY" in fckconfig. js.

Before you finish, go to editor \ filemanager \ browser \ default \ connectors \ asp to open
Config. asp: Change ConfigIsEnabled = False to ConfigIsEnabled =
True. If the file cannot be uploaded, set ConfigUserFilesPath =
"/UserFile" is changed to ConfigUserFilesPath = "/".
Add "Set ConfigDeniedExtensions = CreateObject (" Scripting. Dictionary ")"
ConfigAllowedExtensions. Add "uploadfile ",""
ConfigDeniedExtensions. Add "uploadfile ",""

Similarly, the settings here also correspond to the above and fckconfig. js.

Another upload function is quick upload. This function is available in fckeditor.
Only available in 2.0. This feature is not available in previous versions. Go to \ editor \ filemanager \ upload \ asp, and enable config. asp.
ConfigIsEnabled = False is set to ConfigIsEnabled =
True: Change ConfigUserFilesPath = "/UserFiles/" to the ConfigUserFilesPath
= "/Uploadfile/" & Year (Date () & "-" & Month (Date ())
& "/", Because my uploaded files are placed in the uploadfile folder and separated by month. Quick upload does not allow you to select folders, but directly uses the settings here
Upload. If this setting does not work well with the previous setting, your files will be uploaded in a mess, which is inconvenient for management. Repeat the operations in the previous config. asp file before adding

ConfigAllowedExtensions. Add "uploadfile ",""
ConfigDeniedExtensions. Add "uploadfile ",""

--------------------------------------------------------------------------------

Next, let's talk about how to create your own online editor. Here we take ASP and JS as examples. The sample code of ASP is generally used for background operations:
<%
Dim oFCKeditor
Set oFCKeditor = New FCKeditor
OFCKeditor. BasePath = "/"

OFCKeditor. ToolbarSet = "Default"
OFCKeditor. Width = "100%"
OFCKeditor. Height = "400"

OFCKeditor. Value = rs ("logbody ")
OFCKeditor. Create "logbody"
%>
ASP version, of course, can only be used in. asp is the extension of the page, if you are in front of fckedito. if BasePath is set to "/" in asp, the third row can be saved here. ASP only has one Create function. We recommend that you use ASP when modifying an article.

Next, let's look at the JS version:
<Script type = "text/javascript">
Var oFCKeditor = new FCKeditor ('logbody ');
OFCKeditor. BasePath = '/';
OFCKeditor. ToolbarSet = 'basic ';
OFCKeditor. Width = '000000 ';
OFCKeditor. Height = '20140901 ';
OFCKeditor. Value = '';
OFCKeditor. Create ();
</Script>
BasePath
As described above, the JS version can be used in any webpage or even html page. Because it is generated by the client, the advantage is that it can reduce network traffic, because only one of the editor files needs to be downloaded.
Second, the client can define when to display it. Because fckeditor initialization takes some time, JS is very useful in this regard.

In addition, another function in JS is the ReplaceTextarea () function, which can replace the specified TextArea and take the reply part of the log of my website as an example:
<Script type = "text/javascript">
<! --
Function showFCK (){
Var oFCKeditor = new FCKeditor ('fbcontent ');
OFCKeditor. BasePath = '/';
OFCKeditor. ToolbarSet = 'basic ';
OFCKeditor. Width = '000000 ';
OFCKeditor. Height = '20140901 ';
OFCKeditor. Value = '';
// OFCKeditor. Create ();
OFCKeditor. ReplaceTextarea ();
// Document. blog_feedback.blogsubmit.disabled = '';
Document. blog_feedback.blogsubmit.style.display = '';
Document. blog_feedback.openFCK.disabled = 'true ';
Document. blog_feedback.openFCK.style.display = 'none ';
}
// -->
</Script>
Write it into a simple function. This fckeditor is generated only when the user opens the editor. You do not need to initialize an editor every time you refresh the page, so the page speed will be much faster.