Django-tinymce: A WYSIWYG editor for Django

TinyMCE is a JavaScript WYSIWYG editor that converts an HTML textarea field into an editor instance. django-tinymce is a Django application that contains a widget that renders a form field as a TinyMCE editor.

Features of django-tinymce include:

– Using it as a form widget or with a view

– Integrate the TinyMCE spellchecker

Follow the tutorial below to integrate tinymce in django, to create richer forms for your web development needs. (Note: This tutorial shows you how to install and integrate tinyMCE using a virtual env for development. If you are developing projects in Django without using a virtual env, then this might not be the tutorial for you.)

Before you install:

-Make sure you have a version of Django that is 1.0 or higher (if you do not have Django installed, please install it).

1. Activate your virtualenv first, and then install django-tinymce using pip:

(also install django-staticfiles if needed)

2. Download a build of TinyMCE from http://www.tinymce.com. If you’re developing with javascript using jQuery, downloading the jQuery package would be fine.)

3. Add tinymce to INSTALLED_APPS in settings.py for your project:

4. Go to your urls.py and add tinymce.urls to your project:

This step isn’t required, though, so you may skip this step. 

5.  Copy the jscripts/tiny_mce directory from the tinyMCE distribution into a directory named js in your media root. (Or make sure it’s in a directory where you can access your JS files.)

The next steps are the basic usage for tinymce. Numbers with an asterisk * are steps to integrate tinyMCE differently. –

6. Include the tiny_mce.js file in your <head> tag, like this:

7. Render your form’s CharField into a textarea.

8. In your JS Script, initialize tinyMCE, like this:

Note: You can customize tinyMCE’s buttons on its toolbar. Visit http://www.tinymce.com/ and read the documentation.

*6. Import tinyMCE in the views file that you’d like to use tinyMCE in:

*7. Render your form’s CharField into a TinyMCE widget:

*8. Make sure django-tinymce is  importing from django.forms.util. Check tinymce’s widgets.py and make sure that it looks like:

For more information about how to integrate tinyMCE, visit these pages:

http://www.tinymce.com/wiki.php

http://readthedocs.org/docs/django-tinymce/en/latest/index.html