今は概要をテキストのみで表示していますが、実際にはリンクを付けたり書式を設定したくなることも多いと思います。そこで、WYSIWYGエディタのTinyMCEを使ってみたいと思います。
まずはインストールです。
pip install django-tinymceとターミナルで実行しましょう。インストールが完了したら続いてプロジェクトで使えるようにinstalled_appに登録しましょう。
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'account',
'application',
'crispy_forms',
'tinymce', #追加
]settings.pyに上記のように記載を追加しましょう。続いてurls.pyにtinymcを追加します。
urlpatterns = [
path('admin/', admin.site.urls),
path('application/', include('application.urls')),
path('tinymce/', include('tinymce.urls')), #追加
path('', index.as_view()),
]続いてフォームにtinymceをウィジェットとして設定します。
from django import forms
from .models import Seminar
from tinymce.widgets import TinyMCE #追加
class SeminarForm(forms.ModelForm):
class Meta:
model = Seminar
fields = (
"name",
"type",
"accept_start_date",
"accept_end_date",
"start_date",
"end_date",
"overview")
widgets={
"overview":TinyMCE, #追加
}最後にindex.htmlで適用するフィルターをlinebreaksbrからsafeに変えます。tinymceを使うと保存されるのはhtmlコードになります。通常はセキュリティのためdjangoではhtmlコードはエスケープしてそのままコードとして表示されますが、safeのフィルターを適用することで、htmlとしてエスケープなしに表示できます。ただし、セキュリティ上問題があるので、訪問者が入力したデータはsafeで表示することがないようにしましょう。
{{ seminar.overview|safe }}