Sunday, February 27, 2011

Integrating CKEditor with Django filebrowser and admin console..

There are great docs out there already to show how you to integrate CKEditor into the Django admin console, but how does one make it work with the Django filebrowser app?

1. Install CKEeditor and get it working on your Django admin console (see

The rest of the instructions were based off an issue report regarding CKEditor and the Django filebrowser
2. The Django filebrowser comes with a JavaScript code that enables CKEditor to be used.
class Media:
            js = ("ckeditor/ckeditor.js",
3. Copy the change_form.html (if you're using the grappelli Django app, copy the templates/change_form.html from that app)

{% block extrahead %}
                            <script type="text/javascript">
                                if (CKEDITOR) {
                                    // Added by Roger Hu 02/27/2010
                                    CKEDITOR.config.filebrowserBrowseUrl = '/admin/filebrowser/browse?pop=3';

Once this happens, you should be able to use CKEditor with filebrowser:


  1. Btw, I used django-filebrowser-no-grappelli. Works well with some minor differences in settings. Bad thing: it does not support staticfiles. The workaround is to simlink it's media/filebrowser directory into the project media directory.