Copy-paste the stylesheet <link> into your <head> to load the CSS.
<link href="../assets/plugins/summernote/summernote-lite.css" rel="stylesheet">
Copy-paste the following <script> near the end of your pages under JS Implementing Plugins to enable it.
<script src="../assets/plugins/summernote/summernote-lite.js"></script>
Copy-paste the init function under JS Plugins Init., before the closing </body> tag, to enable it.
<script>
// Initialization summernote
$('.summernote').summernote();
</script>
<textarea id="default" name="" placeholder="Product Description" class="form-control"></textarea>
<script>
$('#default').summernote({
height: 150
});
</script>
<textarea id="airMode" name="" placeholder="Product Description">
<div class="p-4">
<p>This is an Air-mode editable area.</p>
<ul>
<li>Select a text to reveal the toolbar.</li>
<li>Edit rich document on-the-fly, so elastic!</li>
</ul>
End of air-mode area
</div>
</textarea>
<script>
$('#airMode').summernote(
{
airMode: true
}
);
</script>