How to integrate ckeditor with php website.


12th Jul, 2019

Click here to share


Ckeditor is an elegant WYSIWYG plugin for developing web applications. It is been available for a long time now since 2003 and it powers many web applications today.

Before the end of this lesson, you will learn how you can integrate this awesome ckeditor WYSIWYG editor in your web application.

This lesson assumes that you have the basic knowledge of HTML, CSS and JavaScript.  Otherwise, firstly go through our tutorials on these before coming here.

If you are ready to go ahead follow these steps to do that.

1 visit ckeditor click the link below to download CK editor zip file.

This is ckeditor version 4.11. Fully rich for any kind of web app you are building.

2 extract the zip file into your project directory.

3 Include the javascript and stylesheet files into your project.

See the example below on how to include ckeditor to your project.

<!DOCTYPE html>



          <meta charset="utf-8">

          <title>Enamble Ckeditor</title>


          <link rel="stylesheet" href="css/samples.css">

          <link rel="stylesheet" href="toolbarconfigurator/lib/codemirror/neo.css">



          <textarea name="ckeditor">Ckeditor is active here</textarea>


<script src="../ckeditor.js"></script>    

          <script src="js/sample.js"></script>


           CKEDITOR.replace( 'ckeditor');






The only thing you need to include ckeditor is the code above.

If you have followed it very well you should be able to see a screen like an image shown below.

If you did not achieve that ensure that you included the absolute path.

You can also download the complete code for this lesson from this GitHub repo.

Ckeditor is very easy to use and you can read more on their website.

Leave a Reply


Total of 0 Comment