技术交流QQ群:1027579432，欢迎你的加入！
本教程来源于B站杨仕航Django2.0开发视频教程，如需转载，必须注明来源！
1.简单文本编辑
使用HTML丰富页面.png
- 首先打开blog文件目录下的templates文件夹下的blog_detail.html模板文件，由于该模板文件可能会执行一些js代码，不是很安全。因此，对当中的{{ blog.content }}模板标签增加一个过滤器{{ blog.content|safe }}，如下所示：
<div class="blog-content">{{ blog.content|safe }}</div> -
简单文本编辑：打开http://localhost:8000/admin/网址，对其中的某篇博客内容进行加粗和换行编辑操作。如下所示：
这是一篇测试博客。<b>Shell</b>是一个用 C 语言编写的程序，它是用户使用 Linux 的桥梁。<br>Shell 既是一种命令语言，又是一种程序设计语言。Shell 是指一种应用程序，这个应用程序提供了一个界面，用户通过这个界面访问操作系统内核的服务。Ken Thompson 的 sh 是第一种 Unix Shell，Windows Explorer 是一个典型的图形界面 Shell。
简单文本编辑效果.png
存在的问题.png
- 对博客列表前端页面中出现的问题，打开blog_list.html模板文件，对模板标签{{ blog.content|truncatechars:120 }}修改为{{ blog.content|striptags|truncatechars:120 }}，如下所示：
<p>{{ blog.content|striptags|truncatechars:120 }}</p>
问题已解决.png
2.富文本编辑(使用django-ckeditor)
富文本编辑选取原则.png
3.安装django-ckeditor
- pip install django-ckeditor
- 注册应用：ckeditor
- 配置model:把字段改成RichTextField
4.使用django-ckeditor
- 首先打开全局设置文件settings.py文件，注册django-ckeditor应用。添加如下内容：
INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'blog', 'ckeditor', ] - 接着打开blog文件目录下的models.py文件，将models.TextField()修改为RichTextField()，如下所示：
from ckeditor.fields import RichTextField content = RichTextField() -
进行数据库迁移：python manage.py makemigrations 和 python manage.py migrate
富文本编辑效果展示.png - 最后打开全局配置文件settings.py，将语言设置为中文简体。LANGUAGE_CODE = 'zh-Hans'改为zh-hans，如下所示：
LANGUAGE_CODE = 'zh-hans'
5.添加图片上传功能
本地图片无法上传.png
- 安装pillow: pip install pillow
- 注册应用： 'ckeditor-uploader'。打开全局配置文件settings.py文件，添加如下内容：
INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'blog', 'ckeditor', 'ckeditor_uploader', ] -
在blog应用根目录下创建media文件夹(用于保存需要上传的文件)，如下所示：
创建media文件夹.png - 配置settings：打开打开全局配置文件settings.py文件，在自定义参数前，添加如下内容：
# media MEDIA_URL = '/media/' MEDIA_ROOT = os.path.join(BASE_DIR, 'media') # 配置ckeditor CKEDITOR_UPLOAD_PATH = 'upload/' - 配置url:打开mysite文件目录下的urls.py文件，添加与media相关的路由设置，具体如下内容所示：
from django.contrib import admin from django.urls import include, path from django.conf import settings from django.conf.urls.static import static from . import views urlpatterns = [ # 博客首页 path('', views.home, name="home"), path('admin/', admin.site.urls), path('blog/', include('blog.urls')), path('ckeditor', include('ckeditor_uploader.urls')), ] urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) - 配置models: 把字段修改为RichTextUploadingField，将models.py中的RichTextField()修改为RichTextUploadingField()。如下所示：
from ckeditor_uploader.fields import RichTextUploadingField content = RichTextUploadingField() -
进行数据库迁移：python manage.py makemigrations 和 python manage.py migrate
图片上传效果展示.png
