- 13.01.2015 9:12
- ← Назад к списку
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);
});
