Новое в блоге
Loading...
11 янв. 2012 г.

Подсветка синтаксиса кода (Syntax Highlighter) для Blogger

Привет всем моим посетителям блога. Всё таки я решил поделиться с Вами JavaScript библиотекой для подсветки синтаксиса исходных кодов для Blogger. Ведь Syntax Highlighter обычно используют  в основном такие как я. У кого блоги о виджетах, сценариях(Script), о разных HTML, CSS ну и так далее. Разработал эту самую знаменитую библиотеку JavaScript для подсветки синтаксиса исходных кодов Alex Gorbatchev. Вот процитирую немного самого Alexа, что он пишет.

Syntax Highlighter от Alex Gorbatchev - JavaScript библиотека для подсветки синтаксиса исходных кодов на веб-страницах. Имеет очевидные преимущества среди своих многочисленных собратьев: очень гибкая в конфигурации, предельно простые настройки, много приятных функциональных возможностей, и при этом легко интегрируется с любыми сайтами и блогами. На данный момент включена в дистрибутив поддержка следующих языков: Java, C++, XML, CSS, HTML, JavaScript, Bash, C#, Delphi, Diff, Groovy, PHP, Plain, Python, Ruby, Scala, SQL, Visual Basic. Благодаря этому завоевала огромную популярность.

Но нам для блога столько языков программирования не понадобится. Я например использую только несколько основных: HTML,CSS,JavaScript.Этого достаточно и Вам будет.Как  работает подсветка синтаксиса кода для Blogger  Вы могли заметить у меня.Я стал ей пользоваться совсем не давно.В первую очередь для удобства моих посетителей,то есть для Вас.Хватит описания,давайте перейдём к установке библиотеки JavaScript для подсветки синтаксиса исходных кодов для Blogger
Перейдите к Blogger-- Шаблон--Изменить HTML. Поиск <head> (обычно в начале шаблона) и вставляем ниже код:

<link href='http://new-school-blogger.googlecode.com/files/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://dl.dropbox.com/u/48089857/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://new-school-blogger.googlecode.com/files/shCore.js' type='text/javascript'/>
<script src='http://new-school-blogger.googlecode.com/files/shBrushCss.js' type='text/javascript'/>
<script src='http://new-school-blogger.googlecode.com/files/shBrushJScript.js' type='text/javascript'/>
<script src='http://new-school-blogger.googlecode.com/files/shBrushXml.js' type='text/javascript'/>
<script type='text/javascript'>
SyntaxHighlighter.all()
</script>

Можете сохранить шаблон. Видите как удобно с подсветкой синтаксиса кода для Blogger. Теперь поговорим как пользоваться. Когда Вы будите публиковать статью с кодом 'html', то мы заключаем в теги для HTML :

<pre class="brush:html">
Здесь будет ваш код
</pre>

Для "JavaScript", Вы можете использовать "JS" или "JScript" или "JavaScript":
<pre class="brush:JavaScript">
Здесь ваш код
</pre>

Аналогично и для стилей "CSS" использовать:
<pre class="brush:css">
Здесь ваш код стиля
</pre>

Ну и последнее для js использовать:
<pre class="brush: js">
Ваш скрипт здесь
</pre>
Вот вроде и всё. Время пол пятого утра,надо баиньки. Дорогие друзья пожалуйста подписывайтесь на новости и становитесь постоянными читателями моего блога. Это будет мне благодарность от Вас, за мои труды. Всего доброго. До новых встреч.

Читайте также: карта(содержание) блога с эффектом аккордеона и кнопка вверх и вниз для Blogger

Ух ты кнопочки! Понравилась статья? Поделитесь с друзьями:

2 коммент. :

  1. почему у меня получается такой бред? http://mypronote.blogspot.com/2012/11/include-include-include-char-vdeck564.html

    вот мой шаблон: http://pastebin.com/W1hgStGH

    ОтветитьУдалить
  2. Я не знаю, что у Вас должно быть.

    ОтветитьУдалить

 
Footer