How to implement HTML Editor in your website?
HTML Editor is an application that is used to view or edit or Replicate any webpage by copy and paste or drag and drop. The main feature of this HTML editor is you can easily replicate including the CSS Style like font family, color, style and so on.HTML Editor will give you split-screen view hence you can easily view the preview and edit the code in same time.
Now let we see how to implement HTML editor in your site.
Download the pre-created source of HTML Editor Here. And extract all the files in a folder
Create a file called index.php outside the extracted folder
Paste the following code inside the index.php
mysql_connect(‘HostName’, ‘UserName’, ‘Password’) or die(‘Conn Err!!!!’);
mysql_select_db(‘Your DataBase Name’);
$content = $_POST[‘cms_short’];
mysql_query(“INSERT INTO ss_cms(CMS_DESC) VALUES(‘$content’)”) or die(“Insert Err!!”);
In the above code enter your Hostname, Username, Password and your Database name to connect with your database.
After the end of php statement paste the following page
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<meta http-equiv=”content-type” content=”text/html; charset=utf-8″/>
Call the java script function inside your HTML and create a form and paste it inside body tag.
<form name=”formdata” method=”post”>
<textarea cols=”80″ rows=”10″ name=”cms_short”> </textarea>
CKEDITOR.replace( ‘cms_short’ );
<input type=”submit” name=”send_data” value=”Submit”/>
The above code creates a form named formdata and inside that it creates a div tag. Inside those div tag it creates a textarea with 80 column and 10 rows , name the text area as CMS_shorts. After that it declares a script in which replaces the cms_short with CKEDITOR.js. Under that create a button with name send_data.
Declare a php to retrieve data to display your HTML in below HTML Editor.
<?php $get_tb = mysql_query(“SELECT * FROM ss_cms WHERE CMS_ID = ’64′”); $get_row = mysql_fetch_assoc($get_tb); ?>
<p> <?=$get_row[‘CMS_DESC’]; ?></p>
The above code will retrieve data from table name ss_cms and table row CMS_DESC in CMS_ID “64”
Vola! You have successfully implemented HTML Editor in your website. If you feel that you have stuck at implementing the HTML Editor please don’t hesitate to contact us. Let us know how your implementation of HTML Editor works in your site below in the comments.
Looking for Ecommerce Website Development Company?How to implement HTML Editor in your website? by Mahesh Putta