Статьи

10 Синтаксических маркеров jQuery

Как разработчик вы можете поделиться своим кодом на своем веб-сайте или в блоге (так же, как мы!). Есть много вариантов для вас в зависимости от выбранного вами языка программирования. Будь то HTML-страница или работает на PHP, Ruby, Python, ASP, всегда есть подходящий подсветчик синтаксиса для вас.

В основном я хочу отображать JavaScript, поэтому я выбрал плагин WordPress под названием SyntaxHighlighter. Это плагин, который делает все красивые цвета, которые вы видите в нашем отображаемом коде. Возможно, вы захотите узнать, как настроить подсветку синтаксиса в своем блоге, чтобы начать. Кроме того, я по желанию добавил текст с надписью «двойной щелчок для редактирования кода» в каждое поле кода в верхнем правом углу, посмотрите, как добавить пользовательский текст в фрагменты кода . Всегда сложно переключаться между разными подсветками синтаксиса, поскольку все они имеют разные настройки, и для большинства из них требуются разные теги идентификатора кода, поэтому убедитесь, что вы выбрали мудрый выбор, потому что вы можете застрять в нем.

В этом посте мы собрали 10 маркеров синтаксиса, чтобы украсить презентацию вашего кода . Они были разделены на языки, на которых они были написаны: jQuery, JavaScript, Mootools, PHP, Ruby & Python. Наслаждайтесь!

Написано в jQuery

1. Чили

Плагин jQuery для подсветки кода.


чили

Источник + Демо

2. SyntaxHighlighter

Здесь для того, чтобы помочь разработчику / программисту с легкостью размещать фрагменты кода в Интернете и выглядеть красиво. Он на 100% основан на Java Script и ему все равно, что у вас на сервере.


SyntaxHighlighter

Источник + Демо

Написано на JavaScript

3. SyntaxHighlighter 3.0.83

Является полностью функциональной подсветкой синтаксиса кода, разработанной в JavaScript.


SyntaxHighlighter 3.0.83

Источник
демонстрация

4. google-code-prettify

Модуль JavaScript и файл CSS, который позволяет подсветить синтаксис фрагментов исходного кода на html-странице.


Google-код-приукрашивают

Источник
демонстрация

5. Highlight.js

Выделяет синтаксис в примерах кода на блогах, форумах и фактически на любых веб-страницах. Его очень просто использовать, потому что он работает автоматически: находит блоки кода, определяет язык и выделяет его.


Highlight.js

Источник
демонстрация

6. SHJS — Подсветка синтаксиса в JavaScript

Это программа на JavaScript, которая выделяет фрагменты исходного кода в документах HTML. Документы, использующие SHJS, выделяются на стороне клиента веб-браузером.


SHJS - Подсветка синтаксиса в JavaScript

Источник + Демо

Написано в MooTools

7. Lighter.js

Это бесплатный класс подсветки синтаксиса, разработанный с помощью MooTools. Он был создан с учетом интересов разработчика MooTools и использует преимущества многих функций Framework.


Lighter.js

Источник
демонстрация

Написано на PHP

8. GeSHi — Общий синтаксис Highlighter

GeSHi начинался как идея создания подсветки общего синтаксиса для системы форума phpBB, но был обобщен для этого проекта. GeSHi стремится быть простым, но мощным классом выделения, со следующими целями:

> Поддержка широкого спектра популярных языков
> Легко добавить новый язык для выделения
> Настраиваемые форматы вывода


GeSHi - Общий синтаксис Highlighter

Источник + Демо

Написано на Ruby

9. Ультрафиолет

Является механизмом подсветки синтаксиса на основе Textpow. Поскольку он использует файлы синтаксиса Textmate, он предлагает встроенную подсветку синтаксиса для более чем 50 языков и 20 тем.


ультрафиолетовый

Источник
демонстрация

Написано на Python

10. Фрагменты

Это универсальная подсветка синтаксиса для общего использования во всех видах программного обеспечения, таких как форумные системы, вики и другие приложения, которым требуется предварительная обработка исходного кода.


Pygments

Источник
демонстрация