Online editor Ckeditor (1) - php (30)

Online Editor

Online editor, also called WYSIWYG editor, is a common html source code editor.

What you see is what you get: When the user inputs, both the format and style can be saved intact by the system. Finally, when viewing, the output can be based on the original structure input by the user.

Classification of online editors

There are many common online editors on the market, FCKeditor (online editor + Ajax browser server file manager, free), Ckeditor (Content and Knowledge, online editor Separated from the server-side file manager, the online editor is free, the server-side file manager is charged (CKfinder)), Baidu's Ueditor, Kindeditor

The online editor function

The online editor is what you see is what you get.

Function

1. Convenient operation and improve user experience
2. Simplify operation
3. Improve content compatibility

Ckeditor & Ckfinder

Ckeditor has a long history and is widely used in domestic and foreign web projects.

Basically all online editors are similar, nothing more than the number of plug-ins (functions) and operation manual

Why use Ckeditor?

1. Widely used
2. Ckeditor is very mature (market or product)
3. Ckeditor has good compatibility (all online editors are written in js)

Ckeditor installation

Unzip the obtained Ckeditor and put it in You can use it by going to the corresponding project location.

1. Get Ckeditor editor. http://www.ckeditor.com

basic: basic, with fewer functions

standard: standard, with common functions

full: complete, with all functions

Download:

2 Unzip to the specified directory

3 Place the Ckeditor folder to the project location you need to use

Ckeditor directory structure

Use Ckeditor

Currently you can edit the form element of the html source code: textarea

Therefore, edit online The use of the tool is based on the textarea element

1. Load the Ckeditor js file. /ckeditor/ckeditor.js

2 There must be a textarea element in the interface.

3 Replace textarea with the corresponding Ckeditor editor

a) The simplest way: add a class attribute to the textarea tag with the value Ckeditor

The textarea element must have an id or name attribute A

b) Standard way: Use the class CKEDITOR provided by Ckeditor and its replacement method replace

myck1 can be the value of id or the value of the name attribute

c) Advanced way: Use jQuery for textarea To replace

, you must first load jQuery.js

load the interface file jquery.js provided by CKEDITOR for jQuery. /ckeditor/adapters/jquery.js

Use jQuery syntax to replace textarea elements

Configuration (customization) Ckeditor

Ckeditor provides three configuration methods

1. Modify the configuration file config provided by the system. js

Modify the configuration file

Effect

Features: All Ckeditors in the project will be affected by config.js.

2 The customized configuration file needs to be loaded into the Ckeditor instance using the customized configuration file.

Note:

               Using the basic version to load Ckeditor, there is no way to use customized configuration files

             Only the standard version and jquery version can be used

Features: Only Ckeditor instances loaded with customized configuration files will be affected, others will not be affected. (This method is used more often)

The above has introduced the online editor Ckeditor (1) - php (30), including the relevant content. I hope it will be helpful to friends who are interested in PHP tutorials.