Настраиваем свой блог на Blogger.com. Подсветка кода.

Всем привет! В этом посте я расскажу, как сделать подсветку синтаксиса вставляемого кода в ваш блог на Blogger.
5JGRS3JHEN2V

Подсветка синтаксиса в Blogger:

В этом методе будет использоваться opne-source проект Alexa Gorbatcheva - SyntaxHighlighter.

1. Войдите в свой аккаунт на Blogger.com, Перейдите  "Дизайн" -> "Изменить HTML"
2. Выберете "загрузить весь шаблон", чтобы сохранить текущую версию шаблона. Это нужно для того чтобы если что-то пойдет не так,  вы всегда могли восстановить старую версию шаблона.
3. Нажмите Ctrl-F, чтобы открыть поисковик, и найдите тег </head>. Перед этим тегом вставьте следующий код:

<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/>
<!-- добавляйте языки сюда -->
<script type='text/javascript'>
  SyntaxHighlighter.config.bloggerMode = true;
  SyntaxHighlighter.all();
</script>

4. После комментариев "Добавляйте языки сюда", вставьте языки которые вы собираетесь использовать. Допустим вы собираетесь использовать языки: JavaScript, Java, SQL, XML, C++, C#, тогда вам нужно вставить следующий код:

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'/>

Ознакомьтесь также с полным списком языков.
5. Сохраните изменения, нажмите "сохранить шаблон".
6. Теперь вы можете использовать подсветку синтаксиса в ваших постах. Для этого вставляйте код между тегами <pre class="brush:язык"> </pre>. Приведу пример с языком SQL. Допусти нам надо вставить следующий код: SELECT * FROM users WHERE userID = 1:

         <pre class="brush:sql">

           SELECT *

           FROM users

           WHERE userId = 1;

         </pre>

SELECT *
FROM users
WHERE userId = 1;

   И напоследок если так получается, что ваш код вставляется в одну строчку, или вообще редактор выдает ошибки на вставляемый код, воспользуйтесь HTML Encoder.