На эту тему довольно много статей есть. При начальной настройке у меня вылазили различные глюки, потому я решил поделиться окончательным решением, которое у меня сейчас работает.
Подсветка синтаксиса использует Java-script библиотеку SyntaxHighlighter
Итак, открываем панель блоггера, переходим в Шаблон › Изменить HTML и находим там строчку такого вида (у вас может быть другая, главное – чтобы были теги <title>):
<title><data:blog.pageTitle/></title>
После этой строчки дописываем следующее:
<link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet" type="text/css"></link>
<link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" rel="stylesheet" type="text/css"></link>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="text/javascript">
</script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.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'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.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/shBrushJScript.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.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/shBrushVb.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/shBrushPerl.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js' type='text/javascript'/>
<script src='http://alex
gorbatchev.com/pub/sh/current/scripts/shAutoloader.js' type='text/javascript'/>
<script type='text/javascript'>
SyntaxHighlighter.config.bloggerMode = false;
SyntaxHighlighter.all();
</script>
Также, чтобы в браузере Google Chrome не было глюков с нумерацией строк, нужно найти строчку:
/* Content
----------------------------------------------- */
И прописать под ней:
.syntaxhighlighter table td.gutter .line
{
padding: 0 5px !important;
}
Всё, теперь чтобы сделать подсветку кода нужно сделать следующее: во время написания статьи переходим из режима Создать в HTML. и в нужном месте делаем теги и вставляем туда код (например, для подсветки синтаксиса Python):
<pre class="brush:python">
...
</pre>
После brush: указываем язык кода: html, js, css и т. д. А между ними вставляем код. Для питона код можно вставлять “как есть”, а вот если код html, то нужно его закодировать html-кодировкой спец символов – для того, чтобы код поспринимался именно как текст, а не как теги. Делается это или вручную 🙂 или с помощью сайтов вроде этого http://www.string-functions.com/htmlencode.aspx