入力フォームに画像を挿入したり文字のフォントをテキストから変更できるsummernoteの導入方法

summernoteとは

中央揃え文字の色を変えたりできるなど様々な機能を使うことが出来ます

summernote導入

headにこちらを追加します
使用環境： HTML5

index.html

  <link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
  <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
  <link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
  <script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.js"></script>    

bodyにこちらを追加します

index.html

  <div id="content"></div>
  <script>
    $(document).ready(function() {
        $('#content').summernote();
    });
  </script>

これでsummernoteを導入できます

間違った箇所がございましたらご指摘よろしくお願いいたします。

僕のポートフォリオであるメモアプリのソースコードは公開しているので良かったらご覧ください
https://github.com/shou-github/memo.App/

以下のURLからご使用頂けます。
https://memoapps.herokuapp.com/