How to use CKEditor as form input?
Welcome back to shortlearner.com, today in this post we will see how to integrate ckeditor in our web based projects.
so before start the integration we should take an small overview and knowing the amazing benefits and features of CKeditor.
most of the time we need an editor that will help us to bold, italic and underline the paragraph and also help us to upload multiple images with in the paragraph.
Amazing Features
- Applying Styles to Editor Content
- Applying Block-Level Text Formats
- Basic Text Styles: Bold, Italic and More
- HTML Output Formatting
- Inserting Code Snippets
- Pasting Content from Microsoft Word
- Removing Text Formatting
- Setting Text and Background Color
- Source Code Editing
- Table Creation
- Using the Copy Formatting Feature
Also Read
How to Install PHP on CentOS.
How to Send Attachment on mail using PHP.
PHP Login Script With Remember me.
Unable to create a directory a wordpress error
How to Integrate
It is very easy to implement the features of CK Editor in our web application.
just follow the below steps
step1
Add this CKeditor JavaScript file at head section of our web page
<script src="https://cdn.ckeditor.com/4.13.0/standard/ckeditor.js"></script>
Step2
Now we will add our textarea tag and a small lines of JavaScript code.
<textarea name="editor1"></textarea>
<script>
CKEDITOR.replace( 'editor1' );
</script>
Complete Code
<html>
<head>
<meta charset="utf-8">
<title>CKEditor Tutorial by shortlearner.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>
Demo