Syntax Highlighter

Те, кто занимается написанием статей по программированию или веб-разработке, наверняка сталкивались с необходимостью размещения блоков программного кода на странице блога или веб-сайта. И очень важно, чтобы этот код был читабелен и красиво оформлен – так его будет намного легче понять, усвоить и применить в своём проекте.

Для таких случаев существуют специальные библиотеки для подсветки синтаксиса и программного кода. Одной из самых популярных на сегодняшний день является библиотека SyntaxHighlighter, разработанная Алексом Горбачёвым.

В чем же её особенности?

Во-первых, простота установки. Для подключения на веб-сайт достаточно скопировать файлы библиотеки на свой хостинг (обычно это отдельная папка syntaxhighlighter) и подключить ядро скрипта shCore.js, таблицы стилей shCore.css и shThemeDefault.css и необходимые библиотеки кистей для подсветки, например shBrushXml.js, shBrushCss.js, shBrushPhp.js и shBrushJScript.js для веб-программирования.

Во-вторых, простота использования. Для вставки программного кода на страницу нужно поместить его между дескрипторами

где в классе прописывается язык кода, который должен быть подсвечен. Также существует ещё один метод вставки между дескрипторами

подсвечиваемый код вставляется между включением CDATA, а в классе также прописывается язык подсвечиваемого кода.

В-третьих, настройка. Скрипт для подсветки синтаксиса можно настраивать под свои требования:

• – автоматически блокировать ссылки,
• – добавлять классы и соответствующие стили для каждого подсвечиваемого элемента,
• – сворачивать/скрывать подсвечиваемые блоки,
• – изменять номер первой строки,
• – выключать поле с номерами строк,
• – выделять наиболее важные строки,
• – подсвечивать HTML-код совместно с JavaScript, PHP или CSS,
• – включать/отключать "умные" вкладки для нескольких подсвечиваемых блоков,
• – устанавливать нужный интервал для табуляции,
• – включать/отключать отображение панели управления,

а также,

• – использовать режим интеграции для сайта http://blogger.com,
• – менять текст сообщений по умолчанию (перевести их на русский язык),
• – включать/отключать игнорирование символов переноса строки (теги <br />),
• – использовать любой другой тег вместо <pre> для вставки подсвечиваемого кода.

Последняя на данный момент версия 3.0.83 и она значительно отличается от предыдущих версий 2.x и 1.x. В этой версии есть следующие нововведения и возможности:

• – динамическая загрузка нужной кисти для подсвечиваемых блоков,
• – копирование кода в буфер обмена без использования Flash, достаточно двойным нажатием мыши выделить весь код и нажать Ctrl+C,
• – блок с номерами строк и блок с подсвеченным кодом идут отдельно, что облегчает процесс копирования блока с подсвеченным кодом,
• – есть возможность добавлять названия к подсвеченным блокам, которые появятся над самим блоком (это работает и для свернутых блоков),
• – совместимость с Common JS и AJAX, которое дает веб-разработчикам более широкое применение Syntax Hightlighter,
• – улучшенная поддержка CSS, которая упрощает процесс создания новых тем и их добавление к основной теме.