[Classic] fckediter detailed configuration instructions

Source: Internet
Author: User

Configuration Editor
The default option of "outputs" is selected, and the source code option is selected by default.
View plaincopy to clipboardprint?
Function fckeditor_oncomplete (editorinstance)
{
Editorinstance. switcheditmode ();
}

In the FCKeditor folder, there is a file named fckconfig. js. This is the configuration file of FCKeditor. You can change it to customize the editor as needed.
◊ Change the default enter key label
FCKeditor uses the previously entered content when you press enter by default.

Label segmentation. If this affects your page style, you can change the label by setting. Find the following content in the fckconfig. js file:

Fckconfig. entermode = 'P'; // P | Div | br
Fckconfig. shiftentermode = 'br '; // P | Div | br
The entermode In the first line is the tag when you press Enter. It can be changed to P, Div, or Br in the comment. The following line is the tag when you press Enter. The default value is
.
Modify the default item of the toolbar
FCKeditor has two toolbar styles by default, default and basic. You can set the toolbarset attribute of the FCKeditor. Net Control to switch. Of course, by changing the configuration file, you can customize your Toolbar or change the default toolbar. Find the following content in fckconfig. JS:
Fckconfig. toolbarsets ["default"] = [
['Source', 'docprops', '-', 'save', 'newpage', 'preview', '-', 'templates'],
['Cut ', 'copy', 'paste', 'pastetext ', 'pasteword','-', 'print', 'spellcheck'],
['Undo ', 'redo', '-', 'Find ', 'replace', '-', 'selectall', 'removeformat'],
['Form', 'checkbox', 'Radio ', 'textfield', 'textta', 'select', 'click', 'imagebutton ', 'hiddenfield'],
'/',
['Bold ', 'italic', 'underline', 'strikethangout', '-', 'subscript', 'superscript'],
['Orderedlist', 'unorderedlist', '-', 'outdent ', 'indent', 'blockquote'],
['Justifyleft', 'justifycenter', 'justifyright', 'justifyfull'],
['Link', 'unlink', 'anchor '],
['Image', 'flash', 'table', 'rule', 'smilil', 'specialchar ', 'pagebreak'],
'/',
['Style', 'fontformat', 'fontname', 'fontsize'],
['Textcolor', 'bgcolor'],
['Fitwindow', 'showbuckets', '-', 'about'] // No comma for the last row.
];
Fckconfig. toolbarsets ["Basic"] = [
['Bold ', 'italic', '-', 'orderedlist', 'unorderedlist', '-', 'link', 'unlink ','-', 'about']
];
The first one is the default tool bar. You can change it directly or write it according to the given style.
◊ Change the style of the editing area
The FCKeditor editing area is actually an HTML page, so we can change its style at will, such as the font size and background color. You can find the following content in fckconfig. JS:
Fckconfig. editorareacss = fckconfig. basepath + 'css/fck_editorarea.css ';
Fckconfig. editorareastyles = '';
The first line defines an external sample file fck_editorarea.css. Its path is/FCKeditor/Editor/CSS/fck_editorarea.css. Find it and change the editing area style directly.
The second line provides direct CSS writing, which can be written as follows:
Fckconfig. editorareastyles = 'body {font-size: 20pt} p {margin: 0px }';
Modify default emoticon
Find the following content in the fck_config.js file:
Fckconfig. smileypath = fckconfig. basepath + 'images/smiley/MSN /';
Fckconfig. smileyimages = comment '];
Fckconfig. smileycolumns = 8;
Fckconfig. smiley+wwidth = 320;
Fckconfig. smiley1_wheight = 210;
Smileypath is the storage path of the emoticon image, and smileyimages is the image name set. You can create a folder in the smiley directory, put the emoticon image, and then change smileyimages to the new emoon file name.
Upload provides the upload function.
To use the FCKeditor upload function normally, you need to change some configuration and code. The following describes the aspx system as an example:
First, you must change the configuration file to specify the programming language used by the system upload function. Locate the following configuration items:
VaR _ filebrowserlanguage = 'aspx '; // ASP | aspx | CFM | lasso | Perl | PHP | py
VaR _ quickuploadlanguage = 'aspx '; // ASP | aspx | CFM | lasso | Perl | PHP | py
Because it is An ASPX application, the above two items must be changed to "aspx". The default value is "php ".
In the/FCKeditor/Editor/filemanager/connectors directory, there are some files related to uploading in various languages. Open the/aspx/config. ascx user control and you will see two functions.
· Checkauthentication (): Verify whether you have the permission to upload files. If you have the permission, true is returned. Otherwise, false is returned.
· Setconfig (): File Upload Configuration
The simplest configuration method is to directly return true for checkauthentication and change the value of the userfilespath variable in the setconfig function. userfilespath is the path to save the uploaded file.
After configuration, you can test whether the upload function is normal through the/FCKeditor/Editor/filemanager/connectors/uploadtext.html file. If an error occurs during the test, "using the theme CSS file requires a header control on the page. (For example ).", This may be because the website uses the global theme function. You can add the statement "<% @ page stylesheettheme =" "%>" to the/filemanager/connectors/aspx/upload. ASPX page to remove the error.
◊ Dynamically changes the height of the editing area
The editing area is actually an IFRAME. To change the height of the editing area is to change the height of the IFRAME. When you view the webpage source file, you can find that the iframe id in the editing area is composed of the FCKeditor ID and "___ frame". You can get the following code to change the height:
VaR editarea = Document. getelementbyid ("fckeditor1 ___ frame"); // assume that fckeditor1 is the Client ID of FCKeditor and only applies to IE
Editarea. style. Height = '500px '; // change the height to 500px.
The toolbar is automatically hidden after the toolbar is loaded.
Fckeditor_oncomplete is a function automatically executed after FCKeditor is loaded. The function name must be named fckeditor_oncomplete. You can perform initialization in this function.

Function fckeditor_oncomplete (editorinstance)
{
Editorinstance. commands. getcommand ('source'). Execute (); // execute the "source code" command
Editorinstance. toolbarset. Collapse (); // hide the toolbar
}
You can also set it to hide the toolbar by default. Find the following content in the fck_config.js file:
Fckconfig. toolbarstartexpanded = true; // you can specify whether to expand or contract the toolbar by default.
Fckconfig. toolbarcancollapse = true; // you can specify whether the toolbar can be shrunk.

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.