Как сделать подсветку синтаксиса кода без плагинов?

Всем привет smile Наверняка многие из вас используют какой-либо плагин для подсветки синтаксиса кода. Действительно, я тоже считаю, что это достаточно полезно делать, потому что так код получается читабельнее. Я использую Enlighter с недавних пор.

Ну да ладно, а вопрос в том, как сделать подсветку синтаксиса кода практически любого языка без плагина? Сидел я тут значит утром, просто серфил по интернету и случайно наткнулся на сервис, который позволяет вставить код, а на выходе получить его с подсветкой. Вот ссылка — http://highlight.hohli.com

В самом сервисе все очень просто — есть поле для ввода кода и поле выбора языка. В первое вставляете код, вот такой вставил я:

Чуть выше этого поля нужно выбрать сам язык. В моем случае это html, но есть и десятки других. Можно включить дополнительный параметр — пронумеровать линии. Все, после этого нажимаем на кнопку Highlight!

Автоматически следующие 2 поля заполнятся. В первом из них будет показан наглядный результат того, что получилось:

Как видите, на выходе мой код гораздо красивее, с подсветкой тегов и атрибутов. А в последнем поле содержится исходный код, который вам нужно вставить, чтобы получить то, что изображено в поле 2. Вот такой код мне снегерил сервис:

Разбираться что тут к чему нет смысла, просто копируете и вставляете в нужном месте.

Еще в качестве альтернативы можно использовать сервис tohtml.com.

Если же вы хотите более интересное и автоматизированное решение — предлагаю воспользоваться скриптом prettify.js. Загуглите и найдете про него, подключение там очень простое. Ну а если у вас сайт на wordpress то тогда проще всего через плагин, лично я выбрал Enlighter.

Понравилась статья? Поделиться с друзьями:
Комментариев: 1
  1. Валерий

    Здравствуйте, Михаил! Очень интересная и полезная для меня статья. Спасибо! С уважением, Валерий Бородин!!!

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