RSS-лента

Лучшие CMS интернета бесплатно для создания сайта

Ноя
4

Красивое оформление кода на сайте — плагин Crayon Syntax Highlighter

Всем привет. Давненько, хотел написать статью про вордпресс плагин Crayon Syntax Highlighter — это скрипт, который помогает сделать код на вашем сайте более «читабельным» выделяя ключевые слова цветом, и добавляя нумерацию строк и делая еще многое другое.


Необходимость читабельно оформлять код возникла у меня вместе с началом публикации статьи:  Как создать RSS – ленту? , кстати я так и не оформил эту статью должным образом. На поиски вордпресс плагина, который бы удовлетворял всем моим потребностям ушло не менее недели, пока не наткнулся на почти идеальный — Crayon Syntax Highlighter. Если тема вашего блога, также предусматривает частое размещение кода, возможно, эта статья избавит вас от необходимости тратить время на поиски.

Что же мне так понравилось в Crayon Syntax Highlighter?

  Прежде всего — множество функций, которые позволяют динамически контролировать внешний вид блоков с кодом, добавляя при необходимости нумерацию строк, возможность переносить строки (или наоборот — выключать перенос и включать горизонтальную прокрутку), подсвечивать важные детали кода цветом, выбирать любой из многочисленного количества поддерживаемых языков (html, css, php, ActionScript, javascript, Delphi, java, Perl, Ruby, xml и многие другие).

crayon

Основным преимуществом в пользу выбора именно этого вордпресс плагина стало жесткое привязывание нумерации строк к коду. Как бы странно это не звучало, в большинстве подобных решений столбик нумерации ведет свою жизнь, отдельную от блока с кодом, в результате чего нумерация съезжает и получается невозможно определить, какой номер принадлежит к какой строке.

Более того, плагин Crayon Syntax Highlighter для вордпресс имеет несколько встроенных тем оформления и позволяет создавать свои собственные темы, которые максимально впишутся в дизайн блога.

Вот так, например, выглядит блок с кодом, размещенный на моем сайте:

код

Конфигурация и использование Crayon Syntax Highlighter

  После несложной установки и активации плагина в редакторе статей сайта на wordpress появляется новая кнопка при помощи которой можно оформить блок кода:

плагин crayon

После нажатия на кнопку появляется спец. панель добавления кода в статью:

crayon меню

Вордпресс плагин полностью переведен и особых комментарий не требует. Выберите желаемые настройки и добавляйте код.

Также, разместить блок с кодом в WordPress-публикации, можно используя разные шорткоды и варианты разметки:

  • Пример простой вставки кода PHP:
[crayon lang="php"] your code [/crayon]
  • Пример вставки кода из внешнего текстового файла:
[crayon url="http://example.com/code.txt"/]

Названием файла можно указать, какую разметку использовать. Можно собрать свою коллекцию сниппетов в папке, и указать эту папку в настройках.

  • Пример вставки сниппета из папки на сайте:
[crayon url="/local-path-defined-in-settings/code.java"/]
  • Можно использовать привычную разметку, указав вариант подсветки:
<pre lang="php"> your code </pre>
  • Пример использования мини-тегов с указанием цветовой схемы:
[php theme="twilight"]your code[/php]

Несложно догадаться, что для использования других языков программирования нужно просто изменить язык в параметре language .

Где взять плагин Crayin Syntax Highlighter для WordPress?

  Если вы хотите больше узнать о скрипте и его функционировании, посетите официальный сайт Crayon Syntax Highlighter .
А скачать плагин для WordPress на русском вы можете здесь.

Получай первым обновления блога!

Введите Ваш e-mail:


Комментарии (0) на “Красивое оформление кода на сайте — плагин Crayon Syntax Highlighter”

  • Юрий (4 коммент.) 13 Июнь 2016 в 16:20

    Здравствуйте! Поставил этот плагин на сайт и категории сайта перестали читаться. Никак не убираются, только при отключении плагина. А если в другие статьи вставляем любой код, то на сайте для читателей видно сверху код, ниже описание статьи. Почему так получается?

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


вверх