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. Django でWebアプリケーションを作成してみる その1(ubun…

    2. CentOS8に負荷試験ツールLocustを入れてのテスト その1

    3. IT完全未経験からWebエンジニア転職の為に行った活動

    4. CentOS7にLAMP環境(PHP7.2)のインストール

    5. RedHatLinux8でのxfsdumpを使ったRDXへのフルバック…

    6. CentOS7にZABBIXサーバのインストール

    最近の記事

    制作実績一覧

    ITシステム開発の開発先・発注先の選び方を見つけるコンシェルジュサービス

    ITシステム開発の開発先・発注先の選び方を見つけるコンシェルジュサービス

    ITクリエイターのための転職・仕事情報サイト

    ITクリエイターのための転職・仕事情報サイト

    SNS分析での転職支援

    SNS分析での転職支援

    受託パートナーのマッチングとSES人材のマッチング

    受託パートナーのマッチングとSES人材のマッチング