Может ли одна идея изменить мир?

Syntax Highlighter

Syntax Highlighter

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

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

SyntaxHighlighter 3.0.83

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

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

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

<pre class="brush: язык кода">код для подсветки</pre>,

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

<script type="syntaxhighlighter" class="brush: язык кода"><![CDATA[код для подсветки]]></script>,

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

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

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

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

SyntaxHighlighter Test

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

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

Понравился материал?
Поделись со своими друзьями в социальных сетях!


Комментарии:

Здесь комментариев пока нет.

Оставить комментарий
Ваш e-mail необходим только для связи с Вами и не публикуется на сайте
Введите сумму чисел с картинки = 
* Звёздочкой помечены обязательные поля для заполнения
Вход
Вы вошли на сайт, как Гость


Внешний вид сайта

Какой вид сайта Вы предпочитаете?



Telegram
Подпишись на Telegram-канал, чтобы первым узнать все новости сайта:
Подпишись на Telegram-канал, чтобы первым узнать все новости сайта
Рассылка
Подпишитесь на рассылку наших новостей, чтобы всегда быть в курсе последних обновлений!


* Звёздочкой помечены обязательные поля для заполнения
Ваши данные никому не передаются. Вы можете отписаться от рассылки новостей в любой момент.
Статистика
Сейчас на сайте:
Cтатей: 136
Партнёрских продуктов: 171
Файлов: 100
Секретных материалов: 136
Обучающих курсов: 99
Товаров: 6
Галерей: 2
Альбомов: 1
Категорий: 32
Партнёров: 16
Заметок: 27
Комментариев: 15
Мудрых фраз: 146
Страниц: 6
Пользователей: 97
Подписчиков: 165
Посетителей на сайте: 3
Реклама
Группа Вконтакте
Группа Facebook
 Наверх