Подсветка синтаксиса на сайте при помощи Google Code Prettify + Bootstrap 3

Делаем подсветку синтаксиса (кода) на сайте средствами плагина Google Code Prettify в связке с Bootstrap 3.

В секции head подключить стили для подсветки кода:

<!-- Подключаем стили бутстрапа: -->
<!-- Подключаем стили для подсветки кода: -->
<link href="prettify.css" rel="stylesheet">

Перед закрывающим тэгом body поместить:

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<!-- Подключаем скрипт бутстрапа: -->
<!-- Подключаем скрипт для подсветки кода: -->
<script src="prettify.js"></script>
<!-- Инициализация функции подсветки кода: -->
<script type="text/javascript">
!function ($) {
  $(function(){
    window.prettyPrint && prettyPrint()   
  })
}(window.jQuery)
</script>

Если нужно просто подсветить код:

<pre class="prettyprint"><!-- ваш подсвеченный код --></pre>

Подсветка синтаксиса конкретной технологии с нумерацией строк:

<pre class="prettyprint linenums lang-php">
<?= Breadcrumbs::widget([
  'links' => isset($this->params['breadcrumbs']) ? $this->params['breadcrumbs'] : []
]) ?>
</pre>
lang-html
lang-css
lang-js
lang-php
lang-apache
lang-sh
lang-sql	

Скачать исходники Пример

Другие статьи

SQLite
SQLite3: Транзакции с использованием PHP PDO
SQLite3: Транзакции с использованием PHP PDO

В этом уроке мы рассмотрим, как использовать функции транзакций PHP PDO для обеспечения целостности данных в б...

SQLite
SQLite3: Работа с BLOB-типом данных
SQLite3: Работа с BLOB-типом данных

В этом уроке вы узнаете, как управлять BLOB-данными в базе данных SQLite с помощью PHP PDO. BLOB обозначает бо...

SQLite
SQLite3: Получение данных из таблиц с помощью PHP PDO
SQLite3: Получение данных из таблиц с помощью PHP PDO

В этом уроке показано, как можно различными способами запрашивать данные из таблицы SQLite с помощью PHP PDO....