Как вставить HTML (CSS, PHP, SQL, JAVA) на страницу или запись в WordPress

Исходный код на странице WordPressЧасто на сайтах, что работают на движке WordPress, появляется необходимость вставки кода языков программирования для отображения примера решения какой-нибудь задачи.

Для реализации данной задачи вставки кода на страницу или запись в WordPress я предлагаю вашему вниманию три наиболее подходящих плагина, которые фактически помогут решить задачу.

1. WP-Syntax

Плагин WP-Syntax справится с данной задачей на все 100%. В своей основе он достаточно простой, и для его функционирования не нужно совершать никаких настроек после установке на ваш сайт. Для вставки кода (HTML, CSS, PHP, SQL, JAVA) достаточно использовать конструкцию:

<pre lang=”LANGUAGE” line=”1″> … необходимый исходный код … </pre>

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

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

2. CodeColorer

Один из лучших плагинов не только для вставки кода (HTML, CSS, PHP, SQL, JAVA), но и его красивого оформления. Также функционал данного плагина позволяет не только добиться поставленной задачи, но и сделать следующие пункты:

  1. Подсветка синтаксиса в RSS-каналы
  2. Подсветка синтаксиса одной строки кода
  3. Подсветка синтаксиса кода в комментариях
  4. Номера строк
  5. Автоматические ссылки на документацию вставки
  6. Блок кода интеллектуального обнаружения
  7. Готовые цветовые темы
  8. Синтаксис цветов настраивается в CSS файл
  9. Код защиты от искажения на WordPress (например, кавычки, двойные-тире, и другие)

 3. SyntaxHighlighter Plus

Данный плагин также решает проблему вставки кода (HTML, CSS, PHP, SQL, JAVA) при этом не нужно писать дополнительные теги. Вставка кода производится нажатием в визуальном редакторе на кнопку SyntaxHighlighter Plus. Во всплывающем окне выбираете язык кода и вставляете нужный код.

В данном плагине присутствует ряд настроек, что позволит как улучшить внешний вид блока кода, так и увеличит его функциональные возможности:

  1. Stylesheet — выбор цветовой гаммы подсветки.
  2. Auto-Links — при выключенной опции , URL-адреса, не будут блокироваться.
  3. Collapse — если поставить галочку, то код будет свернут, и откроется по клику, очень удобно при работе с длинными примерами кодов.
  4. Gutter     — включает нумерацию строк.
  5. Smart-Tabs — позволяет включить смарт-теги.
  6. Tab-size   — определяет начальный номер строки.
  7. Toolbar — включенная опция делает ссылку кликабельной.

Вот пожалуй самые популярные варианты вставки кода HTML (CSS, PHP, SQL, JAVA) на страницу или запись в WordPress. Выбор за Вами!

You may also like...

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

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

20 − 14 =