Integrating Summernote WYSIWYG Editor in Django

Summernote is a simple WYSIWYG editor. django-summernote allows you to embed Summernote into Django very handy. Support admin mixins and widgets.

Follow the steps below:

1) Install the package via pip:

pip install django-summernote

2) Add django_summernote to INSTALLED_APPS in settings.py.

INSTALLED_APPS += ('django_summernote', )

3) Add django_summernote.urls to urls.py.

from django.urls import include 
... 
urlpatterns = [
 	... 
	path('summernote/', include('django_summernote.urls')),
 	... 
 ]

4) If you're using Django 3.x with default SummernoteWidget set in your Django settings:

X_FRAME_OPTIONS = 'SAMEORIGIN'

5) Run database migration:

python manage.py migrate

Usage:

In forms.py

from django_summernote.widgets import SummernoteWidget 
class PostCreateForm(forms.ModelForm): 
	class Meta: 
		model = models.Post 
		fields = ( 
			'title', 
			'text', 
			'image', 
		) 
		widgets = { 
			'text': SummernoteWidget(), 
		}

In your template use safe templatetag:

{{ post.text|safe }}

2 0