Django! Прикручиваем TinyMCE.

День добрый! Если Вы изучаете Django, то со временем захочется вам добавить WYSIWIG в модели своих страниц.

Здесь я опишу краткий алгоритм, как без лишних хлопот это сделать.

Считаем, что Django и БД у Вас установлены.

Создаём проект:

django-admin.py startproject mysite

Заходим в папку и создаём модель:

cd ./mysite
python manage.py startapp page

Создаём папку media, туда мы будем скидывать tiny_mce. Заходим в эту папку и скачиваем tiny_mce.
[Офф сайт tiny_mce]

mkdir media
cd ./media
wget http://downloads.sourceforge.net/project/tinymce/TinyMCE/3.2.5/tinymce_3_2_5.zip
unzip ./tinymce_3_2_5.zip
mv ./tinymce/jscript/tiny_mce ./

Поясняю последние действия. Мы скачали архив с tiny_mce, распаковали и подняли на верх (т.е. в ./media) нужную нам папочку. Оставшееся можно уверенно похерить ))

Дальше нам понадобится ещё один файл textareas.js. Его можно скачать здесь, либо глянуть мануал здесь и создать его самому.

mkdir ./js
cd ./js
wget http://www.ivankin.net/files/textareas.js

В итоге у нас должно получиться следующее:

/media
|——–/tiny_mce #здесь лежит то tinymce_3_2_5
|——–/js #а здесь у нас лежит textareas.js


Теперь нам нужно грамотно подключить редактор к нашему проекту. Начнём с модели

Правим page/models.py:

    #-*- coding: utf-8 -*-
    from django.db import models
    from django.contrib import admin

    class Page(models.Model):
        title = models.CharField(max_length=100)
        text = models.TextField()
        date = models.DateTimeField()

        class Meta:
            verbose_name_plural = "Страницы"

    class PageAdmin(admin.ModelAdmin):
        list_display = ('title', 'date')

        class Media:
            js = (
                 '/media/tiny_mce/tiny_mce.js',
                 '/media/js/textareas.js',
            )

    admin.site.register(Page, PageAdmin)

Т.е. данным кодом мы создали простейшую модель страницы. У нас есть 3 поля: заголовок, тело сообщения (вот сюда мы и встраиваем редактор), ну и дата.
Главные строки, которые добавляют редактор это:

    class Media:
        js = (
                 '/media/tiny_mce/tiny_mce.js',
                 '/media/js/textareas.js',
        )

Включать его нужно в админские модели, т.е. то, что содержит models.AdminModel. Данный код просто объясняет платформе где у нас лежат нужные скрипты.

Дальше нам нужно отредактировать ещё 2 файла: settings.py и urls.py.

Начнём с settings.py. Я не привожу полный листинг этого файла, смотрите сами что нужно добавить и поменять:

    import os #это нам потребуется чтобы не громоздить пути
    ...
    ... #мотаем ниже
    ...
    ROOT='/home/ivankin/django/mysite/' #абсолютный путь к вашему проекту
    MEDIA_ROOT = os.path.join(ROOT, 'media/')
    #вот как раз, то что мы импортировали os в начале, позволяет нам использовать этот оператор
    ...
    ...
    ...
    MEDIA_URL = '/media/'
    ADMIN_MEDIA_PREFIX = '/admin_media/'
    # оч важно, чтоб эти 2 урла были отличные.. иначе работать не будет
    ...
    ...
    ...
    #Ну и собственно добавляем в INSTALLED_APPS
    INSTALLED_APPS = (
     #... добавляем наш модуль и админку
     'mysite.page',
     'django.contrib.admin',
    )

Оч внимательно проверните предыдущей путь. В основном все спотыкаются именно на нём.
Теперь правим urls.py

   from django.conf.urls.defaults import *
    import settings

    from django.contrib import admin

    urlpatterns = patterns('',
     (r'^admin/', include(admin.site.urls)),
    )

    urlpatterns += patterns('',
     url(r'^media/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT}),
    )

Посути всё. Если Вы делали всё тщательно и внимательно, а главное “с умом!”, то осталось только две команды (т.е. я надеюсь, что создать БД и прописать её в settings.py Вы можете):

python manage.py syncdb
python manage.py runserver

Ну и собственно переходим на http://localhost:8000/admin

В админке пробуем создать новую страницу. Вуаля! наш редактор работает)



Рад если Вам данная статья поможет ;)