Добро пожаловать, дамы и господа! Используйте кнопки соцсетей, чтобы добавить меня в друзья.

Подсветка синтаксиса кода PRISM для Blogger

prism-syntaxhighlighterПриветствую вас, дорогой читатель! В прошлый раз я показал вам несколько способов подсветки синтаксиса кода - это SyntaxHighlighter от Алексея Горбачева и при помощи Highlight.js. В дополнение к этому набору, я добавлю ещё один - подсветка синтаксиса кода PRISM.

Подсветка синтаксиса PRISM для Blogger - это более легкая нагрузка на блог, молниеносно быстрая, все стили делаются с помощью CSS и так далее.

Подсветка синтаксиса кода PRISM SyntaxHighlighter для Blogger

Чтобы установить подсветку синтаксиса кода PRISM в блоггер, требуется только два простых шага, то есть установка стиля CSS и код JavaScript. Перед установкой кода CSS, выберите тему темную или светлую.

Светлая тема будет выглядеть вот так:

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

Код стиля:

Темный стиль такой:

css
Подсветка синтаксиса кода PRISM

Код для вставки:

Для установки стиля темы зайдите в панель управления Blogger - Шаблон - Изменить HTML. В шаблоне находим тег: ]]></b:skin> и чуть выше добавляем код выбранной темы. Далее, находим тег </body> и над ним вставляем скрипт:

Сохраните шаблон. Теперь как использовать:

Каждый язык имеет свой тип класса, соответственно:

 HTML, XML, PHP ⇒ язык разметки
 CSS ⇒ язык CSS
 JavaScript ⇒ язык JavaScript

Код заключаем в теги вот так:

<pre><code class="language-markup"> ...Ваш код HTML, XML, PHP здесь ... </code></pre>
<pre><code class="language-css"> ...Ваш код CSS здесь ... </code></pre>
<pre><code class="language-javascript"> ...Ваш код JavaScript здесь ... </code></pre>

Удачи друзья. До новых встреч.

С уважением, Сергей - блог shkolablogger.ru

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Решите задачку: *