Top

Editors


To use Quill Editor you have to add the following script file
<!--quill editor js-->
<script src="../assets/js/editors/quill.js"></script>
<script src="../assets/js/assets/js/custom-add-product3.js"></script>
To use Quill Editor you have to add the following style file
<!-- quill editor css -->
<link rel="stylesheet" href="../assets/css/vendors/quill.snow.css">
<link rel="stylesheet" href="../assets/css/vendors/quill.bubble.css">
<!-- Html code for display summernote -->
<div class="summernote">
  <p class="text-muted">
  A qualified expert who is in charge of developing and designing websites is known as a web designer. 
  They make advantage of their knowledge of current web design trends to create websites that are both 
  aesthetically pleasing and user-friendly. Making sure that the websites they develop are responsive—that is,
  that they easily adjust to multiple screen sizes and devices—is a crucial component of their work. 
</p>
</div>
To use summer note you have to add the following script file
<!--Summer-note js-->
<script src="../assets/js/summernote/summernote.js"></script>
<script src="../assets/js/summernote/summernote.custom.js"></script>
To use summer note you have to add the following style file
<!-- Summernote css -->
<link rel="stylesheet" href="../assets/css/summernote.css">
<!-- Html code for display ckeditor -->
  <textarea id="editor1" name="editor1" cols="30"
  rows="10"><h2>Technical details <a id="tech-details" name="tech-details"></a></h2>
    <table align="right" border="1" cellpadding="5" cellspacing="0">
      <caption><strong>Mission crew</strong></caption>
      <thead>
        <tr>
          <th scope="col">Position</th>
          <th scope="col">Astronaut</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>Commander</td>
          <td>Neil A. Armstrong</td>
        </tr>
      </tbody>
    </table>
  <p>Launched by a <strong>Saturn V</strong> rocket from <a href="#">Kennedy Space Center</a> in Merritt Island, Florida on July 16, Apollo 11 was the fifth manned mission of <a href="#">NASA</a>'s Apollo program. The Apollo spacecraft had three parts:</p>
  <ol>
    <li><strong>Command Module</strong> with a cabin for the three astronauts which was the only part which landed back on Earth</li>
    <li><strong>Service Module</strong> which supported the Command Module with propulsion, electrical power, oxygen and water</li>
    <li><strong>Lunar Module</strong> for landing on the Moon.</li>
  </ol>
  <p>After being sent to the Moon by the Saturn V's upper stage, the astronauts separated the spacecraft from it and travelled for three days until they entered into lunar orbit. Armstrong and Aldrin then moved into the Lunar Module and landed in the <a href="#">Sea of Tranquility</a>. They stayed a total of about 21 and a half hours on the lunar surface. After lifting off in the upper part of the Lunar Module and rejoining Collins in the Command Module, they returned to Earth and landed in the <a href="#">Pacific Ocean</a> on July 24.</p>
</textarea>
To use summer note you have to add the following script files
<!--ckeditor js-->
<script src="../assets/js/ckeditor/ckeditor.js"></script>
<script src="../assets/js/ckeditor/styles.js"></script>
<script src="../assets/js/ckeditor/adapters/jquery.js"></script>
<script src="../assets/js/ckeditor/ckeditor.custom.js"></script>
<!-- Html code for display simple mde -->
<textarea
<div id="editable">A site designer is now very important in the digital age since the internet provides access to information, entertainment, and business.</textarea>
</div>
<div id="html_container"></div>
To use simple mde you have to add the following script files
<!-- Simple MDE editor jquery-->
<script src="../assets/js/simple-mde/simplemde.min.js"></script>
<script src="../assets/js/simple-mde/simplemde.custom.js"></script>
To use simple mde you have to add the following style files
<!-- Simple-MDE css -->
<link rel="stylesheet prefetch" href="../assets/css/simple-mde.css">
<div class="ace-editor" id="editor">
  /* Sample JavaScript edit source */
  // Define a module
  var app = angular.module('app', ['ui.bootstrap']);
  // Define a conroller.
  app.controller('GrokController', ['$scope', '$filter',
  function($scope, $filter) {
    $scope.today = function() {
    $scope.dt = new Date();
  };
  $scope.today();
  $scope.isOpened = false;
  $scope.open = function($event) {
  $event.preventDefault();
  $event.stopPropagation();
  $scope.isOpened = true;
  };
}]);
/* End of sample edit source */
</div>
To use ace code you have to add the following script files
<!-- ace code editor js -->
<script src="../assets/js/ace-editor/ace.js"></script>
<script src="../assets/js/ace-editor/ace-custom.js"></script>