How to Do

How to integrate CKEditor in websites and web apps

Pinterest LinkedIn Tumblr

If you want to integrate CKEditor in your web app, then you in the right place. When we create a website or web application, there are some Form fields on your page when you type on that you can not make text formatting, underline, bold, italic, etc. I have an amazing thing that can perform all these tasks that you want. You can also download it from here and link it to your pages. So without any waste of time lets introduce CKEditor. You can check this beautiful demo.

What it does

  • Basic Text Styles: Bold, Italic and More
  • Using the Copy Formatting Feature
  • Removing Text Formatting
  • Applying Styles to Editor Content
  • Applying Block-Level Text Formats
  • Setting Text and Background Color
  • Source Code Editing
  • HTML Output Formatting
  • Pasting Content from Microsoft Word
  • Inserting Code Snippets
  • Table Creation

How to Integrate into your website

in order to integrate it just follow some easy steps :
<script src="https://cdn.ckeditor.com/4.13.0/standard/ckeditor.js"></script>

And wherever you want to place your editor then put this code

<textarea name="editor1"></textarea>
 <script>
     CKEDITOR.replace( 'editor1' );
 </script>

Hence the Final code would be as :

<html>
     <head>
	 <meta charset="utf-8">
	  <title>CKEditor Tutorial by Geekquench.com</title>
	<script src="https://cdn.ckeditor.com/4.8.0/standard/ckeditor.js"></script>
    </head>
   <body>
	<textarea name="editor1"></textarea>
	<script>
		CKEDITOR.replace( 'editor1' );
	</script>
   </body>
</html>

Congratulations !! 🙂 Now you can integrate CKEditor, nice thing on the web page, Although these steps were very easy if you still face any problem then you can watch this video tells how to integrate CKEditor.

The same thing is told in this video.

I am a professional Web / Software developer, B.Tech CSE, who has been working in PHP & CodeIgniter and WordPress for more than 2+ years and know it inside and out, including the creation of Web Apps, WordPress websites from scratch and their customization.

13 Comments

  1. Oh my! I’m always so lost when it comes to this stuff. You made it so easy to follow

  2. Thank you for sharing this. I am so lost when it comes to HTML. I will definitely be saving this for future reference.

  3. This sounds like a pretty helpful tool, thanks for sharing info on this.

Write A Comment