kindeditor使用教程(Django項目后臺admin富文本KindEditor教程0基礎)

要在Django項目的后臺admin中使用富文本編輯器KindEditor,你需要按照以下步驟進行設置。

步驟1:安裝KindEditor

首先,你需要下載KindEditor的安裝包,并將其解壓到你的Django項目的static目錄中。

步驟2:配置settings.py

在你的Django項目的settings.py文件中,找到STATIC_URL設置項,并添加以下內容:

STATICFILES_DIRS = [

os.path.join(BASE_DIR, ‘static’),

]

步驟3:創建一個富文本字段

在你的models.py文件中,創建一個富文本字段,例如:

from django.db import models

class MyModel(models.Model):

content = models.TextField()

步驟4:創建一個自定義的admin表單

在你的admin.py文件中,創建一個自定義的admin表單,例如:

from django import forms

from django.contrib import admin

from django.forms import ModelForm

from django.utils.html import format_html

from myapp.models import MyModel

class MyModelForm(ModelForm):

content = forms.CharField(widget=forms.Textarea(attrs={‘class’: ‘kindeditor’}))

class Meta:

model = MyModel

fields = ‘all’

class MyModelAdmin(admin.ModelAdmin):

form = MyModelForm

list_display = (‘id’, ‘content_preview’)

def content_preview(self, obj):

return format_html(obj.content[:50] + ‘…’)

content_preview.short_description = ‘Content Preview’

admin.site.register(MyModel, MyModelAdmin)

步驟5:創建一個JavaScript文件

在你的static目錄下創建一個名為kindeditor_init.js的JavaScript文件,內容如下:

$(document).ready(function() {

$(‘.kindeditor’).each(function() {

KindEditor.create(this);

});

});

步驟6:在admin模板中加載JavaScript文件

在你的admin模板(例如admin/base_site.html)中,添加以下內容:

{% extends “admin/base.html” %}

{% block extrahead %}

{{ block.super }}

{% endblock %}

步驟7:運行你的Django項目

現在,你可以運行你的Django項目,并在admin中使用KindEditor富文本編輯器來編輯content字段了。

希望這個教程對你有幫助!