Пещера программиста
19Янв/098

Подсветка программного кода в WordPress

Создал программист, значится, себе пещеру. И дал ей название «Пещера программиста». А что же это за пещера программиста, если встроенные возможности настенной живописи не дают подсвечивать программный код? Верно — это неправильная пещера. Крикнул тогда программист грустно в гугль — "как мне подсветить свой код на стене ? ". И вернулась ему туева куча ссылок. Долго рыскал он по ссылкам этим и вот что накопал...

Вначале  попался интересный обзор плагинов  от Tod. Но в отличии от Tod`а, мне понравился SyntaxHighlighter Plus. Подкупил он меня своим визуальным оформлением, ну и плюс такими «рюшечками», как просмотр кода в отдельном окне , копирование текста, печать кода.  Первые тесты показали — плагин то что надо.  Но протестировав дальше попалась неприятная особенность — при редактировании в визуальном редакторе, когда вставляешь внутри секции кода символ  '<' , а потом переключаешься в режим HTML и обратно в визуальный редактор, символ заменяется на его HTML код.  А это очень неудобно , ведь надо постоянно проверять — не испортил ли что при последнем редактировании.
Кстати, пользовался тогда (и сейчас) TinyMCE Advanced. Насколько я знаю, в нем нет возможности отключить форматирование кода, заключенного в определенный блок. Использовал когда то такую возможность в Drupal в FCKeditor. Но, как назло, версии FCKeditor под последний WordPress 2.7 не было.
В итоге  SyntaxHighlighter Plus меня разочаровал.
Поскольку обзор от Tod по меркам IT был старым, то я решил присмотреться к другим, рассмотренным им плагинам. Но мнение о них осталось прежним, к тому же часть из них не поддерживает WP 2.7. Но чуть позже ( в конце декабря) я изменил свое мнение о CodeColorer в связи с выходом новой версии (об этом ниже).

Следующим шагом был поиск на странице плагинов официального сайта WordPress. Вот тут то и открылось все тайное -) . Мое внимание привлекли 3 плагина. Отмечу вначале, что все они построены на GeSHi, так что выбор языков для подсветки у них одинаков.

WP-CODEBOX ( страница плагина)

WP-CODEBOX sample

Посмотришь и не нарадуешься, тут тебе и нормальное ( по моему мнению) визуальное оформление, и нумерация строк (начиная с нужной вам цифры), и раскрывающийся блок ( ну просто сказка). Возможность скачать код сразу в файле тоже нужная вещь. Казалось вот он идеал ( пока еще не рассмотрел остальные ), но он не поддерживает WP 2.7 .  Остается только ждать новой версии...

CodeColorer ( страница плагина)

2Зайдя на страницу плагина чуть не захлебнулся слюной — наворотов то O_O . Хотелка умерла, осознав что большего хотеть нельзя. Тут тебе и стандартная для многих плагинов нумерация строк, и невиданная для других подсветка кода в комментариях. Регулировка размера табуляции, различные темы оформления блока кода. А уж регулировка ширины блока кода, и количество строк без скролбара это просто супер. Да и к тому же плагин совместим с WP 2.7 .
Правда и тут я нашел несколько минусов для себя. Это проблема использования визуального редактора — в FAQ сказано , что не надо им пользоваться. Другая проблема возможно специфична для моей темы оформления — в блоке кода при передаче на него фокуса  рисовалась тень, которая портила весь вид и цвета. Но опять же в админке в настройках плагина все отображается нормально, как и на сайте разработчика.

WP-SynHighlight ( страница плагина)

3Последним на моем пути оказался WP-SynHighlight. Плагин сразу подкупил своей простотой и размером. Выводимая «картинка»  радовала глаз. Из особенностей хочу отметить выбор контейнера, в котором код будет показан, изменение регистра букв. А самое главное — код можно писать в визуальном редакторе. Точнее код как раз нужно писать в визуальном редакторе. При переходе в HTML спец символы  отображаются как соответствующие им коды, но при переходе обратно в визуальный редактор — все отлично.   Расстроило, что в комментариях код не подсвечивается. Но автор плагина, при общении, сказал что сделает это в скором времени.

И остановил он свой взгляд на WP-SynHighlight. Взгляд его радовал этот вид. И понял он — это то что надо. И засверкала стена пещеры его разными цветными словами.

Связано с категорией: Разное Оставить комментарий
Комментарии (8) Пинги (0)
  1. У себя в блоге использую WP-Syntax. Имхо: лучший.

  2. DRiVER

    он очень «простой». настроек практически нету. А глюки при редактировании убивают желание что то писать ))

  3. тоже отказался от wp-syntax, он превращал "" в html... как их там... вспомнил, html сущности

  4. Я раньше, когда была необходимость, тоже использовал WP-Syntax. Сейчас такая необходимость отпала, но о нем остались приятные воспоминания :)

  5. Здравствуйте. помогите решить проблемку: в HTML редакторк ввоже неоходимый для вывода код (php). Сохраняю. На предпросмотре все замечательно. Перехожу из HTML в визуальный и обратно. Половина кода пропала... :- ( На предпросмотре пустое окно кода. Повторяю переход из одного редактора в другой — код пропал совсем.

    Убедительная просьба — подскажите где собака зарыта и как это дело можно обойти (спрятать код от визуального, какая нибудь примочка или другой плагин) Пробовал на WP-codebox и и еще один. Одинаково. WP 8.5

    Спасибо.

    • Приветствую.

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

      суть — не забыть поставить тэги плагнина

  6. Спасибо.

    WP-codebox — при вводе кода в визульном — выводит вместе с и по . Никакой таблицы и подсветки кода. А когда вводил в html — рисовалась.

    Буду пробовать CodeColorer. Если будут проблемы, обращусь.

  7. 2Валерий:

    Попробуйте мой WP_SynHighlight. Там не должно быть подобных проблем вообще.

    wordpress.org/extend/plugins/wp-synhighlight/


Оставить комментарий


Spam protection by WP Captcha-Free

Нет обратных ссылок на эту запись.