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

Пост о том, как в blogger добавить возможность подсвечивать синтаксис для кодов php, sql, html и xml.

Как установить:

Заходим в настройки, выбираем вкладку «Дизайн»  и «Изменить HTML«. далее в окне редактора шаблона, после тега <title><data:blog.pageTitle/></title> пишем следующее:

<link href='https://dl.dropboxusercontent.com/u/72419062/JS/SyntaxLight/shCore.css' rel='stylesheet' type='text/css'/>

<link href='https://dl.dropboxusercontent.com/u/72419062/JS/SyntaxLight/shThemeDefault.css' rel='stylesheet' type='text/css'/>

<script src='https://dl.dropboxusercontent.com/u/72419062/JS/SyntaxLight/shCore.js' type='text/javascript'/>

<!-- add brushes here -->

<script type='text/javascript'>

  SyntaxHighlighter.config.bloggerMode = true;

  SyntaxHighlighter.all();

</script>

После комментария «add brushes here,» добавляем скрипты для обработки тех языков, подсветку которых мы хотим использовать. В следующем примере будет использована подсветка для Javascript, SQL, XML/HTML, and PHP:

<script src='https://dl.dropboxusercontent.com/u/72419062/JS/SyntaxLight/shBrushJScript.js' type='text/javascript'/>

<script src='https://dl.dropboxusercontent.com/u/72419062/JS/SyntaxLight/shBrushPhp.js' type='text/javascript'/>

<script src='https://dl.dropboxusercontent.com/u/72419062/JS/SyntaxLight/shBrushSql.js' type='text/javascript'/>

<script src='https://dl.dropboxusercontent.com/u/72419062/JS/SyntaxLight/shBrushXml.js' type='text/javascript'/>

Осталось только сохранить изменения шаблона и приступать к использованию. Для того чтобы скрипт автоматически «раскрашивал» и размечал код, его необходимо разместить в теги <pre class=»brush:[язык подсветки]»>. Например, для подсветки блока с SQL-запросом:

<pre class="brush:sql">

SELECT *

FROM users

WHERE user_id = 1212;

</pre>