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

Подсветка php кода на страницах блога — штука невероятно удобная. Давайте в двух словах разберемся как я подкрутил её у себя...

Все инструменты для подсветки синтаксиса делятся на две категории (насколько мне известно): js скрипты делающие подсветку на стороне клиента и серверные скрипты которые делают всё это на стороне сервера.

Описывать подробно плюсы и минусы думаю нет смысла, т.к. они вполне очевидны:

• js-библиотеки изменяют блок с кодом на лету в браузере пользователя. Если javascript у него будет отключен - всей красоты он не увидит. Конечно выполнение скрипта требует небольшого времени и для больших страниц с кодом пользователю потребуется подождать пока скрипт выполнит свою работу (примерно 0.5-2сек)
• серверные скрипты подсветки синтаксиса делают разукравшивание всего один раз, при добавлении/изменении страницы. css/html требуемый для красивого отображения кода попадает сразу в базу. Данный вариант удобен конечным пользователям т.к. не требует от них поддержки js и выполнения кода подсветки у себя в браузере от страницы к странице.

Для подсветки на своем блоге я выбрал маленький скрипт highlight.js который на стороне клиента занимается всеми «разукрашиваниями». Мне просто удобнее что бы код в базе не меняли всякие скрипты, вдруг я через день передумаю и решу использовать что то другое.

Порядок работы:

1. Заходим на сайт и скачиваем highlight.js

2. Распаковываем папку highlight в корень, рядом с папкрй protected

3. Подключаем скрипт в лаяуте строчкой:

<script src="/highlight/highlight.pack.js"></script>

$cs=Yii::app()->clientScript;
$cs->scriptMap=array(
    'highlight'=>'/highlight/highlight.js',
    …
);

4. На странице где хотим использовать подсветку синтаксиса (либо сразу в лаяуте) делаем инициализацию библиотеки:

<script type="text/javascript">
hljs.initHighlightingOnLoad();
</script>

5. Блоки кода на сайте в которых хотим использовать подсветку синтаксиса оформляем по типу:

<pre><code>...</code></pre>

Пользуемся!