среда, 28 января 2015 г.

Как прикрутить подсветку кода codehighlighter к блогу blogspot ?

Собственно, сабж. Ответ же таков.

1. Для начала, сделаем бэкап текущего шаблона.
2. После, открываем шаблон на редактирование (Edit HTML mode) и копируем весь css код по ссылке link и вставляем его перед закрывающим </b:skin> тэгом.
3. Вставляем этот код перед </head> тэгом
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shCore.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCpp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCSharp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCss.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushDelphi.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJava.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJScript.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPhp.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPython.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushRuby.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushSql.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushVb.js' type='text/javascript'></script>
<script src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushXml.js' type='text/javascript'></script>
4. Вставляем следующий код перед </body> тэгом.
<script language='javascript'>
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');
</script>
5. Сохраняемся.
6. Теперь вы можете использовать возможности подсветки синтаксиса, заключив код в <pre></pre> тэг, например из кода вида:

<pre name="code" class="php">
    echo "I like PHP";
</pre>
Получится

echo "I like php"
7. Для конвертации вида  <a> to &lt;a&gt; можете воспользоваться сервисом (quick-escape).
8. Здесь находится описание атрибутов тэга <class>.

Комментариев нет:

Отправить комментарий