Website how to integrate Baidu Ueditor editor

In the normal use of Web site maintenance, Rich Text editor is an essential element of the site. Now on the market various kinds of editor function design is uneven, I do a few sites are used Cicada know to build station system to do, and Cicada know the default built-in editor is kindeditor, function is simple, has not met my needs, such as multi-image upload, video release, code highlighting and other functions.

So want to change an editor, I heard that Baidu's Ueditro is also good, so it is intended to integrate Ueditor into the cicada knowledge system. Operation is not very troublesome, under the sharing of the next process, considering the generality of everyone, design cicada knowledge system changes I will not too much to explain, here the main sharing in the site of the main process of integration Ueditor .

First go to Baidu ueditor official website (http://ueditor.baidu.com/website/) Download the application of their own website program the latest Ueditor. Unzip the folder into the Web site customization directory , below I take the root directory as an example, the specific directory to adjust itself.

Find the content edit, create the page file, introduce the following code (note to adjust the path):

<script type="text/javascript" src="ueditor.config.js " ></script><script type="text/javascript " src= " Ueditor.all.js"></script>

Add the following code at the Content editor:

<script id="container" name="content" type=" Text/plain ">         content     </script>    <script type="text/javascript  ">        var ue = Ue.geteditor ('container');    </script>

Itor () parameters can be configured according to their own situation.

If you want to use the code highlighting feature, you can introduce the following code in the foreground Content Presentation page file:

<script type="text/javascript" src="/ueditor/third-party/ Syntaxhighlighter/shcore.js"></script><link rel="stylesheet" type="text/css " href="/ueditor/third-party/ Syntaxhighlighter/shcoredefault.css"><script>syntaxhighlighter.all (); </script>

The overall process is very simple, the rest is based on their own specific needs, configuration of some parameters, finally show the final.

Background article content editing:

Code highlighting:

Website how to integrate Baidu Ueditor editor