Damien MATHIEU

Le générateur automatique d’administration de Django est super sympa. En trois lignes de code, vous avez une interface pour ajouter, modifier et supprimer des données de votre modèle.
Cependant dans le cas de textareas, il peut arriver d’avoir besoin d’avoir un éditeur de texte avancé.

Nous allons donc ici voir comment implémenter TinyMCE aux textareas d’une page de l’administration particulière.
Mais cette technique peut également très bien fonctionne avec FCKEditor ou tout autre éditeur WYSIWYG. Le tout est, après, de changer le code javascript.

Prenons le fichier admin.py de notre application :
from django.contrib import admin
from project.application.models import Page
class PageAdmin(admin.ModelAdmin):
  list_display = ('name', 'url')
  fieldsets = [
    (None, {'fields': ['name', 'url']}),
    ('Content', {'fields': ['content']}),
  ]
admin.site.register(Page, PageAdmin)

Nous définissons donc une interface d’administration pour notre modèle Page qui contient les champs name, url et contenu.
Ce dernier champ est celui qui va prendre un textarea.

Commencons par ajouter des documents javascript externes spécifiquement pour ce modèle.
Après fieldsets[], ajouter
class Media:
  js = (
    '/js/tiny_mce/tiny_mce.js',
    '/js/admin_pages.js'
  )
Nous incluons donc les deux documents javascript supplémentaires dans la page des pages. Et uniquement celle-ci.

Installez tinymce dans /js/. Et créer le fichier /js/admin_pages.js
Dans lequel vous placerez
tinyMCE.init({
  mode : 'textareas',
  theme : "simple"
});
Ainsi, vous transformez tous les textareas de la page en champs tinymce (mais dans notre cas, il s’agit d’un seul).
Redémarrez votre application et vous verrez votre bel éditeur de texte enrichi

Libre à vous par la suite d’enrichir votre administration avec du javascript de cette manière.