Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
tree: d34bd99e1f
Fetching contributors…

Cannot retrieve contributors at this time

77 lines (55 sloc) 2.692 kb

Extending django-wysiwyg

The django-wysiwyg module can easily by extended with new editor types.

The editor switching in implemented by selecting templates based on the DJANGO_WYSIWYG_FLAVOR setting. Adding an extra editor simply requires these templates to be added:

  • django_wysiwyg/editorname/includes.html
  • django_wysiwyg/editorname/editor_instance.html


The includes file will be added to the top of the page, to provide all required scripts. It is loaded by the {% wysiwyg_setup %} code. The template could contain something like:

<script type="text/javascript" src="{{ DJANGO_WYSIWYG_MEDIA_URL }}ckeditor.js"></script>
<script type="text/javascript" src="{{ DJANGO_WYSIWYG_MEDIA_URL }}sample.css"></script>

Secondly, the file has to provide a few JavaScript functions, to implement the :doc:`javascript_api` This is used for Ajax environments, or interfaces which use a lot of DOM manipulation. The required API functions have the following structure:

var django_wysiwyg =
    editors: {},  // where the editor object can be stored.

    is_loaded: function()
        // ... some test to see if the scripts were loaded properly.
        return window.MYEDITOR != null;

    enable: function(editor_name, field_name)
        this.editors[editor_name] = // ... enable the editor for the field name

    disable: function(editor_name)
        // ... disable the editor

The enable() function should be able to deal with attempts to enable the editor twice. It should also store the created WYSIWYG editor instance in the this.editors[editor_name] variable. That allows the caller to access the object when it needs to.

For more inspiration, you can inspect the files in the django_wysiwyg template directory.


The editor-instance template is used to instantiate a single editor statically. It is loaded by the {% wysiwyg_editor fieldname %} line in the template. The contents of the template can look something like:

<script type="text/javascript">
    django_wysiwyg.enable('{{ editor_name }}', '{{ field_id }}');

In most cases, this should be enough to instantiate the editor for a specific field.

Extending existing templates

Some templates also provide blocks, that allow them to be extended. For example, the yui_advanced editor, is implemented by extending the yui templates.

Jump to Line
Something went wrong with that request. Please try again.