Online editor Ckeditor (1)-php (30)

: This article mainly introduces the online editor Ckeditor (1)-php (30). For more information about PHP tutorials, see. Online Editor

The online editor is also known as the WYSIWYG editor. it is a common html source code editor.

What you see is what you get: When you enter a file, both the format and style can be kept intact by the system. at last, you can output the file according to the original structure you entered.

Online Editor category

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

Online Editor function

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

Function

1. Easy operation to improve user experience
2. Simplified operations
3. Improves content compatibility

Ckeditor & Ckfinder

Ckeditor has a long history and is widely used in web projects at home and abroad.

Basically all online editors are similar. it is nothing more than the number of plug-ins (functions) and the Operation Manual.

Why Ckeditor?

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

Ckeditor installation

Decompress the obtained Ckeditor and place it in the corresponding project location.

1. Obtain the Ckeditor editor. Http://www.ckeditor.com

Basic: basic, with fewer functions

Standard

Full: complete, with all functions

Download:

2. decompress the package to the specified directory.

3. Place the Ckeditor folder to the desired project location.

Ckeditor directory structure

Use Ckeditor

The form element that can edit the html source code: textarea

Therefore, the use of online editors is based on the textarea element.

1. load the Ckeditor js file. /Ckeditor. js

2. you must have a textarea element.

3. replace textarea with the corresponding Ckeditor editor.

A) simplest method: add a class attribute to the textarea tag and set the value to Ckeditor.

The textarea element must have one of the id or name attributes.

B) Standard mode: Use the Ckeditor class provided by CKEDITOR and its replace method

Myck1 can be the id value or the name attribute value.

C) advanced method: Use jQuery to replace textarea

Loading jQuery. js first

Load the interface file jQuery. js provided by CKEDITOR for jquery. /Ckeditor/adapters/jquery. js

Use jQuery syntax to replace textarea elements

Configure (custom) Ckeditor

Ckeditor provides three configuration methods:

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

Modify configuration file

Effect

Feature: all ckeditors in the project are affected by config. js.

2. Custom configuration file in the same format as the system configuration file config. js

Create a new user configuration file. the format of the configuration file is exactly the same as that of config. js.

Modify configuration options

Load the custom configuration file in the Ckeditor instance that uses the custom configuration file.

Note:

There is no way to use the custom configuration file to load Ckeditor using the basic version.

Only standard and jquery versions are available.

Features: only Ckeditor instances loaded with custom configuration files will be affected, while others will not. (This method is usually used)

The above introduces the online editor Ckeditor (1)-php (30), including some content, hope to be helpful to friends who are interested in PHP tutorials.