Подсветка кода на сайте

highlight.js - хороший плагин для подсветки кода. Он способен сам определить язык программирование в тексте и подсветить код.

Установка плагина: скачиваем архив с необходимыми нам языками, распаковываем в папку на сайте и подключаем плагин на странице:

‹link href="highlight.css" rel="/путь до плагина/highlight/stylesheet"›‹/link›
‹script type="text/javascript" src="/путь до плагина/highlight/highlight.pack.js"›‹/script›


По умолчанию плагин highlight использует теги ‹pre›‹code›...‹/code›‹/pre› для подсвечивания:


‹script›hljs.initHighlightingOnLoad();‹/script›

‹!-- на странице --›
‹!-- если известен язык программирования --›
‹pre›‹code class="html"›...‹/code›‹/pre›
‹!-- в ином случае --›
‹pre›‹code class="nohighlight"›...‹/code›‹/pre›


Если нужно подключить все конструкции вида ‹pre›‹code›...‹/code›‹/pre›, тогда используем такой вид инициализации плагина

$(document).ready(function() {
  $('pre code').each(function(i, block) {
    hljs.highlightBlock(block);
  });
});


Можно также подсветить код в теге ‹div›:

hljs.configure({useBR: true});

$('div.code').each(function(i, block) {
  hljs.highlightBlock(block);
});