Learn Django tinymce text editor. In this tutorial, you will learn Django tiny MCE editor. We use the editor in the admin page of Django to add data into our database models using the Tiny MCE editor. Like RichTextFeild.
The tinymce package for the django is available here
pip install django
This command will install the latest Django package into your local machine.
Firstly Create a Django Project :
python -admin django startproject project
This command will create new project.
Navigate to Project folder :
cd project #projectname
This will change the current directory of the terminal to the project directory
Secondly Creating app with Demo app :
py manage.py startapp demo
Create a demo app for the Django project we have created.
Thirdly Create Urls.py in Demo app
from django.urls import path from . import views urlpatterns = [ path('', views.home, name="home") ]
Here, We are creating the routing paths for the home view this will render out the Html page we have created for the model form. However the ” will represent the localhost path it will render the Html template as the homepage for the project on the localhost address. i.e. 127.0.0.1:8000.
Configure the Tiny MCE in Settings.py :
# Application definition INSTALLED_APPS = [ 'demo', 'tinymce', 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', ]
Add the demo and tinymce package to the installed app in Settings.py file of the project.
Model Creation in Demo app :
from django.db import models from tinymce.models import HTMLField # Create your models here. class Student(models.Model): name = models.CharField(max_length=200) remark = HTMLField()
Here, We are creating the Student model in the demo app with two fields name and remark. For name field we are using the basic models package of Django and for the remark field we are using the Html Field from the tinymce editor fields which we have imported.
Let’s Register model in admin.py
from django.contrib import admin from .models import * # Register your models here. admin.site.register(Student)
Configuring the admin site by registering the Student model in the demo app inside the admin.py file. This will make changes to the admin interface and resemble the Student model into the admin site.
Add Tiny MCE in urls.py
from django.contrib import admin from django.urls import path from django.urls.conf import include urlpatterns = [ path('admin/', admin.site.urls), path('tinymce/', include('tinymce.urls')), path('', include('demo.urls')) ]
Finally, Configure the tinymce URL’s into the main URLs file of the project. This will render all the views present in the tinymce app which we previously configured in the installed apps of settings.py file