Добрый день, дорогие читатели! Этот материал будет полезен людям, которые используют в своих статьях примеры программного кода, скриптов и т.д. Когда я начал создавать данный проект, то знал, что мне предстоит выдавать код для своих читателей. Я хочу познакомить вас с плагином Auto SyntaxHighlighter, но для начала, я расскажу какие еще я пытался использовать средства для подсветки синтаксиса кода.
Конечно, можно и вовсе не использовать плагин для этих целей, тогда ваш код нужно будет поместить в тег <pre> и это будет выглядеть так:
Но согласитесь что подсветка синтаксиса кода делает его более наглядным. Я нашел и установил плагин WP-Syntax, и для отображения кода в статье, нужно зайти в редактор HTML и там использовать следующую форму <pre lang="LANGUAGE" line="1">и </pre>
.
Плагин WP-Syntax удобен тем, что в нем можно выбрать язык кода, вписав в место LANGUAGE например php. А также, можно задать нумерацию с определенной строки используя параметр line="1"
.
Но большим минусом данного плагина, оказалось то, что когда в статье предполагается множество вставок кода, то переходя в редакторе из визуального просмотра в просмотр html, сам код сбивается, коверкается и приходиться все время его исправлять. Точнее сказать, чтобы всё-таки статья со множествами вставок кода удалась, код нужно размещать в самом конце редактирования статьи, перед выпуском. Иначе не получается.
Вот, как раз редактируя предыдущую статью — Как вывести информацию об авторе? я понял, что плагин WP-Syntax мне не подходит. И стал искать другой, более удобный плагин. И нашел Auto SyntaxHighlighter.
Плагин Auto SyntaxHighlighter очень удобен в использовании, по крайне мере мне понравилось. Я установил и активировал плагин, и более не требуется никаких настроек.
На панели управления редактора появилась новая кнопка.
И для того, чтобы вставить код, достаточно кликнуть по данной кнопке, и в открывающемся новом окне выбрать язык кода, и вставить сам код.
Приведу пример работы плагина Auto SyntaxHighlighter:
<script type="text/javascript"> $(document).ready(function(){ $('#contact').ajaxForm(function(data) { if (data==1){ $('#success').fadeIn("slow"); $('#bademail').fadeOut("slow"); $('#badserver').fadeOut("slow"); $('#contact').resetForm(); } else if (data==2){ $('#badserver').fadeIn("slow"); } else if (data==3) { $('#bademail').fadeIn("slow"); } }); }); </script>
Теперь всё работает, внесенный код отображается стабильно во время редактирования статьи и ничего не сбивается! Спасибо автору плагина Auto SyntaxHighlighter.
Добавить комментарий