Как вставить код в статью WordPress

Плагины для WordPress WordSmall

В этом уроке рассмотрим подборку лучших плагинов, позволяющих вставить красиво код в статью. Такая необходимость пригодится тем, кто часто приводит примеры кодов php, html, css и т.д. в своих статьях. Под словом красиво я имею в виду что код будет отображаться корректно с подсветкой синтаксиса и нумерацией строк. Возможно, вы замечали на многих ресурсах, в том числе и на моем подобную подсветку кода. Теперь вы узнаете, как это делается, и будете использовать на своем сайте.

№1 SyntaxHighlighter Evolved

Довольно легкий плагин хорошо справляется со своей работой имеет ряд самых необходимых настроек. Сохраняет форматирования текста также есть возможность выбрать тему оформления кода. Чтобы вставить код в статью требуется представить его в виде короткого кода:

Пример.

[php]ваш код[/php]
[css]ваш код[/css]
[codelang="js"]ваш код[/code]

Результат.

Как вставить код в статью WordPress

Больше информации о коротких кодах вы найдете после установки плагина в конце настроек.

№2 WP-Syntax

Как говориться в официальном описании плагина: обеспечивает чистую подсветку кода, поддерживает широкий круг популярных языков, а также сохраняет форматирования кода. Лично у меня с ним возникли небольшие проблемы, а точнее отображение в браузере Chrome (появлялись очень большие пробелы). Из-за этого мне пришлось многое переделать, но возможно это проблема была только у меня. Во всяком случае протестировать лишний раз не мешало бы. Для того чтобы вставить код следует обвернуть его в тег pre.

Пример.

<pre lang=”php”line="1">ваш код</ pre>
<pre lang=”css”line="1">ваш код</ pre>

Результат.

Как вставить код в статью WordPress

Разборка.

lang=”…”-язык, который следует отобразить (css,php,html,js и т.д.)
line=”1”-номер первой строки (необязательный атрибут)

У плагина настроек нет, после установки можете сразу вставлять код с правилами указанными выше.

№3 WP Code Highlight

Очень простой и удобный плагин как раз то, что необходимо для такой работы. Не нужно указывать язык выделения, после установки в редакторе появится кнопка для удобной вставки кода, есть четыре темы оформления и нумерации строк. Чтобы использовать его следует обвернуть нужный код в тег pre.

Пример.

<pre>ваш код</ pre>

Результат.

Как вставить код в статью WordPress

№4 Crayon Syntax Highlighter

Плагин имеет ну просто очень огромное количество настроек, половина которых совсем не нужны. Это делает его слишком сложным для такой простой работы. Чтобы вставить код нужно обвернуть в тег pre.

Пример.


<pre>ваш код</ pre>

Результат.

Как вставить код в статью WordPress

№5 FV Code Highlighter

Отличный легкий плагин, настроек не имеет, поддерживает языки PHP, (x) HTML, JavaScript, CSS и XML. Цветовая тема используется та же что и в Dreamweaver, но при знании css можно с легкостью изменить стили оформления (это касается всех перечисленных плагинов). Чтобы вставить код требуется обвернуть его в нужный тег.

Пример.

[code type=codetype]ваш код[/code]

Результат.

Как вставить код в статью WordPress

Вот такая подборка плагинов для вставки кода в статью. На своем сайте я использую плагин №3 и вполне им доволен, а каким плагином воспользуетесь вы?

Автор, он же Андрей, он же Admin, он же WordSmall

Лентяй-любитель, окончил высшую школу безделья с многочисленными знаками отличия. Создатель этого небольшого «чудо-блога» о еще более «чудном» контенте.

E-mail Google+ Twitter
Добавить комментарий
bold quote code