= Editing Django templates with Emacs =

This page lists some helpers to edit django templates with the Emacs editor.
* [http://code.djangoproject.com/wiki/Emacs#django-html-mumamo-mode nXhtml and
django-html-mumamo-mode]
* [http://code.djangoproject.com/wiki/Emacs#django-mode django-mode]
* [http://code.djangoproject.com/wiki/Emacs#django-html-mode django-html-mode]
* [http://code.djangoproject.com/wiki/Emacs#Yasnippet Yasnippet]
== django-html-mumamo-mode ==
'''Status: works well.'''
MUltiple MAjor MOde is an extension for Emacs that allows one buffer to use mult
iple modes for different stretches of text. It's bundled with [http://ourcomment
s.org/Emacs/nXhtml/doc/nxhtml.html nXhtml], and now includes a django-html-mumam
o-mode for Django templates.
This uses django-mode from django-mode.el above for the django parts and html-mo
de for the html parts.
(In addition it uses css-mode for css parts etc.)
django-html-mumamo-mode provides:
* '''Syntax highlighting''' aka font locking
* '''Indentation''' of template tags
* ... and '''all the benefits''' of [http://ourcomments.org/Emacs/nXhtml/doc/nx
html.html nXhtml]
To get nXHTML (includes django-html-mumamo-mode), download the nxHTML package re
lease directly from the web site at: http://ourcomments.org/Emacs/DL/elisp/nxhtm
l/zip/nxhtml-2.08-100425.zip
Downloading it from the Launchpad branch site will give you the latest snapshot,
but there may be issues with the latest build so it is not recommend.
And append:
{{{
(load "~/.emacs.d/nxhtml/autostart.el")
(setq mumamo-background-colors nil)
(add-to-list 'auto-mode-alist '("\\.html$" . django-html-mumamo-mode))
}}}
to your .emacs. See the issue reported at http://stackoverflow.com/questions/11
46701/turning-off-chunk-coloring-in-emacs-nxhtml-mode to understand why the setq
statement is needed. The add-to-list line is used to force any HTML file loade
d into django-html-mumamo-mode.
To use django-html-mumamo-mode run:
{{{
M-x django-html-mumamo-mode
}}}
Sample screenshot:
{{{
#!html
<img src="http://code.djangoproject.com/attachment/wiki/Emacs/nxhtml-django-html
-mumamo.png?format=raw" alt="Screenshot of Django template in GNU Emacs with nXh
tml.">
}}}

== django-mode ==
'''Status: old, download link does not work.'''
[http://cavedoni.com/ I] ve started hacking on an editing mode for Django templates
in Emacs. (Please note that this is the first time I ever do Emacs Lisp, and tha
t what I currently have is nothing more than a start. If you can come up with fi
xes or improvements, these are much appreciated).
The most obvious benefit that it provides at the moment is syntax highlighting o
f variables and blocks.
It knows about the Django default tag names and uses a different coloring for co
mments. At the moment it is configured to automatically kick-in for files with e
xtension `.djhtml` (I made it up that way, in order not to clash with other defa
ults one may have with .html files). Of course you can invoke it with `M-x djang
o-mode` in any buffer.
You can get it here: http://unicoders.org/code/hacks/trunk/django-mode.el (link
dead)
Put it somewhere where Emacs can find it then add this line to your `.emacs` fil
e:
{{{
(load "django-mode.el")
}}}
This is a sample screenshot of the results with the
ki.org/cgi-bin/wiki?ColorTheme color theme]:

Charcoal Black

[http://www.emacswi

{{{
#!html
<img src="http://code.djangoproject.com/attachment/wiki/Emacs/emacs-django-templ
ate.png?format=raw" alt="Screenshot of Django template in GNU Emacs, Mac OS X">
}}}
== django-html-mode ==
'''Status: unmaintained.'''
There is another emacs django template mode. It is derived mode from html (sgml)
.
There is an updated and improved version of this mode on: [https://code.edge.lau
nchpad.net/~eopadoan/+junk/django-html-mode]
* '''Updated the supported tags''' to current (django 1.0b3).
* Added '''auto-close''' command ( {{{C-c ]}}} ).
To get, run on a shell:
{{{
bzr branch lp:~eopadoan/+junk/django-html-mode
}}}
Note: The django-html-mode code does not appear to support template tag indentat
ion.

== Yasnippet ==
If you are using [http://code.google.com/p/yasnippet/ Yasnippet], you can get th
e [https://edge.launchpad.net/django-mode django-mode] with many useful snippets
.
To get, run on a shell:
{{{
cd /tmp
mkdir ~/.emacs/plugins
bzr branch lp:python-mode
bzr branch lp:django-mode
mv /tmp/python-mode/python-mode.el ~/.emacs.d
mv /tmp/django-mode/*.el ~/.emacs.d
mv /tmp/django-mode/snippets ~/.emacs.d/plugins
}}}
And append something like:
{{{
(add-to-list 'load-path "~/.emacs.d/plugins/yasnippet-0.6.1c")
(require 'yasnippet)
(yas/initialize)
(yas/load-directory "~/.emacs.d/plugins/yasnippet-0.6.1c/snippets")
(require 'django-html-mode)
(require 'django-mode)
(yas/load-directory "~/.emacs.d/plugins/django-mode/snippets")
}}}
to your .emacs.
The django-mode yasnippets code depend on python-mode.el, so it also has to be d
ownloaded. Note: there is a difference between python.el (which comes with the
native Emacs distribution) and python-mode.el, which has to be downloaded separa
tely.
Also, if you use django-html-mumamo-mode, you should not use Ysnippet since the
automatic template tag indenting will not function correctly with the Ysnippet d
jango-html-mode and django-mode code loaded.