Перед нами стоит задача: сделать подсветку синтаксиса в WordPress для участков кода, и сделать процесс выделения кода максимально удобным.
Среди множества плагинов для подсветки я остановил свой выбор на Prettify GC Syntax Highlighter. Он мне показался простым и удобным, без лишнего функционала. Установка плагина стандартная — через раздел «Плагины — Добавить новый». Далее может потребоваться отключить авто-экранирование html кода.
Теперь при добавлении в пост тега pre
с классом .prettyprint
— синтаксис будет автоматически подсвечиваться. Цвета при желании можно настроить в файле prettify.css
в директории с плагином.
Чтобы сделать удобным выделение участков кода (не дописывать класс prettyprint вручную), рекомендую добавить в файл function.php
следующий код:
function add_more_buttons($buttons) { $buttons[] = 'styleselect'; return $buttons; } add_filter("mce_buttons_3", "add_more_buttons");
function mce_insert_formats( $init_array ) { $style_formats = array( array( 'title' => '.prettyprint', 'block' => 'pre', 'classes' => 'prettyprint', 'wrapper' => false, ), ); $init_array['style_formats'] = json_encode( $style_formats ); return $init_array; } add_filter( 'tiny_mce_before_init', 'mce_insert_formats' );
Функция add_more_buttons
— добавит выпадающий список с пользовательскими стилями, а mce_insert_formats
добавит в него стиль .prettyprint.
Теперь когда мы в редакторе TinyMCE выделим участок кода и в выпадающем списке выберем стиль «.prettyprint», наш код автоматически будет помещен в блок pre с классом .prettyprint, а при отображении записи плагин Prettify GC Syntax Highlighter подсветит наш синтаксис автоматически.
При желании можно посоздавать стили для разных языков: javascript, c# и т.д., которые автоматически будут добавлять классы «.prettyprint .lang-js», «.prettyprint .lang-csh».
Полный перечень поддерживаемых языков: aea, agc, apollo, bsh, c, cc, cl, cpp, cs, csh, css-str, cv, cxx, cyc, default-markup, el, fs, go, hs, htm, html, java, js, json, lisp, lua, m, ml, mxml, perl, pl, pm, proto, py, rb, scala, scm, sh, sql, vhd, vhdl, wiki, xhtml, xml, xsl, yaml, yml. Для php язык указывать не нужно.
Дополнительные возможности Prettify GC Syntax Highlighter.
Можно добавить нумерацию строк, для этого достаточно поместить код между тегами pre с классами .»prettyprint и .linenums. Если вы хотите чтоб нумерация начиналась с 18 строки, добавьте следующий код:
<pre class=»prettyprint linenums:18″> // Ваш код тут </pre>
Можно добавить подсветку одной или нескольких строк:
<pre class=»prettyprint lang-YOURLANG linenums highlight:1-3,5-6″> // подсвеченный синтаксис </pre>
Стоит заметить, что эта функция недоступна, только если нумерация строк отключена.
Плагин поддерживает также shortcode. Скачать плагин можно тут: http://wordpress.org/plugins/prettify-gc-syntax-highlighter/