DjangoへWYSIWYGエディターを導入する手順① - 株式会社CoLabMix

DjangoへWYSIWYGエディターを導入する手順①

開発部の「エイジ」です。

今回はDjangoへWYSIWYGエディターを追加したいと思います。

★関連記事

DjangoへWYSIWYGエディターを導入する手順②

完成すると下記のようなフォームが表示されます。

環境

Django v3.1
Python v3.6.5

WYSIWYG editorとは

【読み方】 ウィジウィグエディター

WYSIWYGとは、見たままのものを実際に作成出力するという言葉のWhat You See Is What You Getの頭文字をとったものであり、WYSIWYGエディターとは編集中の画面に表示されるものと同じものが、最終結果(HTML、印刷結果等)として得られるようなアプリケーションのこと。

WYSIWYGエディター

 

導入するメリット

WYSIWYGなので一つのフォームの中にHTMLダグを保存できそのまま表示でき便利です。

 

 

インストール

今回は、summernoteいうbootstrapを使ったWYSIWYGエディターを使用します。

公式

 


 

settings.pyに追記

 

urls.pyに追記


 

画像保存の機能追加

画像を保存するディレクトリを追加します

 

settings.py、urls.pyに追記します。


 

 

マイグレーション


 

今回は以上です。最後までお読みいただきありがとうございました。
次回は実際にフォームに当てる部分を書きたいと思います。

★関連記事

DjangoへWYSIWYGエディターを導入する手順②

 

 

 

 

 

このブログは株式会社CoLabMixによる技術ブログです。

GCP、AWSなどでのインフラ構築・運用や、クローリング・分析・検索などを主体とした開発を行なっています。

Ruby on RailsやDjango、Pythonなどの開発依頼などお気軽にお声がけください。

開発パートナーを増やしたいという企業と積極的に繋がっていきたいです。

お問い合わせやご依頼・ご相談など

    関連記事

    1. SublimeText3でリモートのサーバ上にあるファイルを開いたり編…

    2. Elasticsearch 6 を使ったデータ検証 その1(Docke…

    3. ZABBIXのアラートをSlackに飛ばす

    4. Django でWebアプリケーションを作成してみる その1(ubun…

    5. 【Django】入力フォームの増減機能からDBに保存する方法

    6. kibana と Beats (metricbeat)を使ってサーバの…