有人能描述如何在django.contrib.flatpages中实现ckeditor吗？

Question

有没有人能告诉我怎么在django.contrib.flatpages中使用ckeditor？

Answer 1

如果你想找到一个不需要修改模板的解决方案，可以看看这个页面：http://johansdevblog.blogspot.it/2009/10/adding-ckeditor-to-django-admin.html

我在这里把例子写下来，以防链接失效。这是一个简单的模型。

from django.db import models

class SampleModel(models.Model):
    title = models.CharField(max_length=50)
    text = models.TextField()

def __unicode__(self):
    return self.title

接下来，介绍一下如何为特定类型的字段添加ckeditor支持，这里我们以文本区域（TextArea）为例。

from sampleapp.models import SampleModel
from django.contrib import admin
from django import forms
from django.db import models

class SampleModelAdmin(admin.ModelAdmin):
    formfield_overrides = { models.TextField: {'widget': forms.Textarea(attrs={'class':'ckeditor'})}, }

class Media:
    js = ('ckeditor/ckeditor.js',) # The , at the end of this list IS important.

admin.site.register(SampleModel,SampleModelAdmin)

到这一步，ckeditor.js会检查所有带有“ckeditor”这个类属性的文本区域。

Answer 2

找到一个不错的解决方案：

这有点复杂。我在我的urls.py文件里用了admin.autodiscover()，这样它就会自动为flatpages创建一个管理界面，这个功能是django.contrib.flatpages里定义的。我当然不想去改动Django自带的东西，也不想放弃自动发现的方便性。

http://www.elidickinson.com/story/django-flatpages-and-ckeditor/2011-11

Answer 3

要完成这个任务，有几个步骤。首先，确保你的 Django 能够提供 ckeditor.js 文件。关于如何做到这一点，可以参考这个链接：http://docs.djangoproject.com/en/1.2/howto/static-files/#howto-static-files。在这个例子中，我会从 127.0.0.1:8000/js/ckeditor/ckeditor.js 提供这个文件。

接下来，你需要覆盖默认的 flatpage 修改表单模板。在你的模板目录下，创建一个文件，路径是：<你的模板目录>/admin/flatpages/flatpage/change_form.html

在这个文件里，写入以下内容：


{% extends "admin/change_form.html" %}
{% block extrahead %}
{{ block.super }}
<script type="text/javascript" src="/js/ckeditor/ckeditor.js"></script>

<script type="text/javascript" charset="utf-8">
var $ = jQuery = django.jQuery.noConflict();  // Use djangos jquery as our jQuery
</script>

<script type="text/javascript" src="/js/ckeditor/adapters/jquery.js"></script>

<script type="text/javascript" charset="utf-8">
$(document).ready( function(){
 $( 'textarea' ).ckeditor({
  "skin":"kama",
  "width" : 850,
  // "toolbar" : "Basic",  // uncomment this line to use a basic toolbar

 });
});

</script>

{# Adding some custom style to perty thing up a bit. #}
<style type="text/css">
div>.cke_skin_kama{
 width: 100%;
 padding: 0!important;
 clear: both;
}
</style>

{% endblock %}

前几行是 Django 默认的额外头部内容。后面的代码则是引入 ckeditor 的 JavaScript 文件，并且使用 Django 已经引入的 jQuery 和 ckeditor 的 jQuery 适配器。最后，我们还给页面强加了一些样式，因为默认情况下，页面看起来有点乱。

从这里开始，你可以通过在 ckeditor 的调用中实现不同的选项，快速更改工具栏。如果有非技术人员需要编辑这些 flatpages，使用简单的工具栏可能会更合适。你只需在上面的代码中取消注释那一行即可实现。

有人能描述如何在django.contrib.flatpages中实现ckeditor吗？

3 个回答

撰写回答