How to use CkEditor in Django?

#django #python #tutorial #upload

Hello Everyone,
Do you need to know that how to use CkEditor in Django, what are the settings for CkEditor and how to use it in Templates also?

First of all, you have to install CkEditor

pip install django-ckeditor

create a django project

django-admin startproject PROJECT_NAME

create a app in Project

python manage.py startapp app1

add app1 and ckeditor in settings.py INSTALLED APPS

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'app1',
    'ckeditor',
]

Now create Models in models.py. In this file, you have to import RichTextField using 'from ckeditor.fields import RichTextField' syntex.

from django.db import models
from ckeditor.fields import RichTextField

# Create your models here.
class User(models.Model):
    user_name = models.CharField(max_length=70)
    pwd = models.CharField(max_length=100)

    def __str__(self):
        return self.user_name



class Post(models.Model):
    user = models.ForeignKey(User, on_delete=models.CASCADE)
    title = models.CharField(max_length=100)
    content = RichTextField(blank=True,null=True)

    def __str__(self):
        return self.title

from django.contrib import admin
from .models import User, Post

# Register your models here.
@admin.register(User)
class UserAdmin(admin.ModelAdmin):
    list_display = ['id','user_name','pwd']



@admin.register(Post)
class PostAdmin(admin.ModelAdmin):
    list_display = ['id','user','title']

create forms.py file in app1.

from django import forms
from .models import *
from ckeditor.fields import RichTextField


class PostForm(forms.ModelForm):
    userName = forms.CharField(widget=forms.TextInput(), required=True, max_length=100)
    title = forms.CharField(widget=forms.TextInput(),required=True, max_length=100)
    content = RichTextField()

    class Meta:
        model  = Post
        fields = ('userName','title','content',)

create urls.py file in app1

from django.urls import path
from . import views

urlpatterns = [
    path('', views.home, name='home'),
    path('add_post/', views.AddPostView.as_view(), name='add_post'),
    path('all_post/', views.SeePostView.as_view(), name='see_post'),
]

include app1's urls.py file in project's urls.py, like this:-

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('app1.urls'))
]

Coding in views.py file

from django.shortcuts import render
from django.views.generic.list import ListView
from .models import User, Post
from .forms import PostForm
from django.http import HttpResponse
# Create your views here.

def home(request):
    return HttpResponse('<a href=add_post/>Add Post</a>')


class AddPostView(ListView):
    model = Post

    def get(self, request):
        form = PostForm()
        return render(request, 'app1/index.html', {'form':form})
    def post(self, request):
        form = PostForm(request.POST)
        if form.is_valid():
            userName = form.cleaned_data['userName']
            title = form.cleaned_data['title']
            content = form.cleaned_data['content']

            user_obj = User.objects.get(user_name=userName)
            add_post = Post.objects.create(user=user_obj, title=title, content=content)
            add_post.save()
            form = PostForm()
            return render(request,'app1/index.html',{'form':form})


class SeePostView(AddPostView):
    model = Post

    def get(self,request):
        all_post = self.model.objects.all().order_by('-id')
        return render(request, 'app1/all_post.html', {'posts':all_post})