Ticket #60 (closed task: fixed)

Opened 3 years ago

Last modified 3 years ago

Document: how to use WYMeditor in Django administration

Reported by: peter Owned by: jf.hovinne
Priority: minor Milestone: 0.4
Component: editor Version: trunk
Keywords: Django integration Cc:

Description

I have managed to easily integrate WYMeditor into Django's administrative interface.

Since I couldn't edit the Wiki, I filed it as a ticket in hope someone will copy it to a better location.


Here is how I did it...

First I copied the wymeditor to my project's static-served files directory, which in my case had an URL prefix of /site/media/

There I put the wymeditor, jquery and a special file admin_textarea.js, that I have written myself consisting of:

$(document).ready(function() {
    $('head', document).append('<link rel="stylesheet" type="text/css" media="screen" href="/site/media/wymeditor/skins/default/screen.css" />');
    $("textarea").wymeditor({
        updateSelector: "input:submit",
        updateEvent:    "click"    
    });
});

This file instructs the browser to load an additional WYMeditor's CSS and to convert each <textarea> HTML tag into a WYMeditor.

In each of the Django models that I whished to set WYMeditor for, I have added the following js setting to the Admin section:

class ExampleModel(models.Model):
   text = models.TextField()     # each TextField will have WYM editing enabled
   class Admin:
   js = ('/site/media/jquery.js',
         '/site/media/wymeditor/jquery.wymeditor.js',
         '/site/media/admin_textarea.js')      

That is it. If you wish to use WYM in your own Django app, just follow the steps and replace the /site/media/... with whatever your static media prefix is.

Change History

Changed 3 years ago by peter

Errata...

The Django example has erroneous identation (which in Python is cruical). Here is the correct one:

class ExampleModel(models.Model):
    text = models.TextField()     # each TextField will have WYM editing enabled
    class Admin:
         js = ('/site/media/jquery.js',
               '/site/media/wymeditor/jquery.wymeditor.js',
               '/site/media/admin_textarea.js')      

Changed 3 years ago by jf.hovinne

  • priority changed from trivial to minor
  • status changed from new to assigned
  • milestone set to 0.4

That's great, thanks!

I think we should add a 'Integration examples' or 'Implementations' category in the wiki.
Perhaps a 'examples' directory in trunk/src would be useful, too.

Changed 3 years ago by jf.hovinne

  • status changed from assigned to closed
  • resolution set to fixed
Note: See TracTickets for help on using tickets.