Для любого блога или сайта, хоть отдаленно связанного с ИТ, совершенно необходима простая и удобная возможность подсветки синтаксиса.

Нашел в русскоязычном интернете материалы, где предлагают прикрутить highlightjs (highlightjs.org). Этот способ вы тоже можете рассмотреть. Нужные классы добавляются при исполнении JS-кода.

Мне больше нравится использование библиотеки pygments  (pygments.org). От первого способа этот принципиально отличается тем, что нужные для оформления кода css-классы добавляются с помощью фильтра в шаблоне Django. Достаточно использовать в шаблоне пару тегов, чтобы автоматические находить и преобразовывать любой код, входящий в этот блок.

А теперь по порядку.

Как выглядит подсвеченный код?

Код Python

  1. def icons_delete_handler(sender, **kwargs):
  2. image_file = kwargs['instance']
  3. try:
  4. storage, path = image_file.icon.storage, image_file.icon.path
  5. storage.delete(path)
  6. except:
  7. pass

Код Shell

  1. root@localhost:~# python manage.py rebuild_index
  2. root@localhost:~# source env/bin/activate

Как подключить подсветку кода?

Я использую виртуальное окружение на сервере, поэтому все команды буду делать в нем.

В первую очередь необходимо установить библиотеку pygments:

  1. (env)root@localhost:/var/www/django# pip install pygments

Далее устанавливаем модуль django-pygments:

  1. (env)root@localhost:/var/www/django# pip install django-pygments

В раздел INSTALLED_APPS Вашего settings.py нужно добавить 'django_pygments':

  1. INSTALLED_APPS = (
  2. 'grappelli',
  3. 'multiupload',
  4. 'django.contrib.auth',
  5. 'django.contrib.contenttypes',
  6. 'django.contrib.sessions',
  7. 'django.contrib.sites',
  8. 'django.contrib.messages',
  9. #...
  10. 'django_pygments',
  11. )

В шаблоне

В шаблоне, где могут выводиться тексты с кодом, нужно подключить шаблонный тег {% load pygmentify %}

Переменные, в которых будет выводиться код, нужно обернуть в блок {% pygment %}:

  1. {% load thumbnail %}
  2. {% load pygmentify %}
  3. <div class="post-body">
  4. {% pygment %}
  5. {{ post.body|safe }}
  6. {% endpygment %}
  7. </div>

Настройка завершена!

Использование при публикации материалов:

Заключайте фрагменты кода в тег <pre lang="python">....</pre>, указывая нужный язык. Например, чтобы получить результат, который Вы видели в первом примере, код вставляется таким образом:

<pre lang="python">
def icons_delete_handler(sender, **kwargs):
        image_file = kwargs['instance']
        try:
            storage, path = image_file.icon.storage, image_file.icon.path
            storage.delete(path)
        except:
            pass
</pre>

Список поддерживаемых языков Вы можете найти на сайте: http://pygments.org/languages/

Надеюсь, эта публикация будет полезной для Вас. Жду Ваших вопросов!

В следующий раз рассмотрю другие способы подсветки синтаксиса при использовании визуального редактора кода.