Как вставить код в запись WordPress?

Рад приветствовать читателей моего блога!

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

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

Как вставить код в запись WordPress?

Как вам? По-моему довольно приятный внешний вид.

Так вот, когда я писал вышеупомянутую статью, то у меня, как и у многих начинающих блогеров, создающих собственный блог на движке WordPress, возникла проблема со вставкой кода в статью. Если вы в рамках своего интернет-ресурса затрагиваете тонкости создания сайтов/блогов, то вам довольно часто придется вставлять в статьи разнообразные фрагменты кода. Просто так воткнуть код в текстовку вашей статьи нельзя, он будет восприниматься соответствующим интерпретатором на сервере именно как код, и не будет отображаться так, как вам бы хотелось. Если вы сейчас читаете данную статью, то с высокой долей вероятности решение данной проблемы стоит у вас на повестке дня. Попробую помочь вам с ней разобраться.

Как вставить код на страницу WordPress?

Разберем подробно. На самом деле решается данная проблема очень легко. Для начала устанавливаем плагин WordPress под названием WP-Syntax:

Как вставить код в запись WordPress?

Активируем его:

Как вставить код в запись WordPress?

Плагин готов к работе, никаких дополнительных настроек не требуется.

Теперь осталось разобраться, как же использовать данный плагин, чтобы наш код отображался как надо.

Для того, чтобы плагин WP-Syntax понял, что мы хотим отображать определенный отрывок кода именно как код, существует конструкция:

<pre lang=»xxx» line=»1″>код</pre>

Все действия по редактированию статей со вставкой кода производить нужно в режиме текстового (html) редактора WordPress, в противном случае (при использовании визуального редактора) возникнут проблемы с интерпретацией тега pre. Все, что заключено внутри конструкции (обозначено словом код) будет отображаться на странице вашего ресурса именно в том виде, в каком вы его туда вставите, и не будет интерпретироваться в качестве операторов какого-либо языка программирования.

Расшифрую содержимое данной конструкции:

  • <pre></pre> — открывающий и закрывающий теги, определяющие предварительно отформатированный в исходном коде текст;
  • lang — (сокращение от language) язык программирования, на котором составлен код, вставляемый вами в запись;
  • xxx — нужно вписать язык программирования, на котором составлен код. В этом случае встречающиеся в коде операторы указанного языка программирования будут выделены визуально (подсвечены цветом, жирным текстом и т.д.). Наиболее распространенные языки: html4strict, php, css, xml. Полный список поддерживаемых языков можете посмотреть здесь;
  • line=»1″ — атрибут, отвечающий за отображение нумерации строк в области вывода кода на странице вашего сайта/блога. Цифра означает номер первой строчки кода, если нумерация не нужна — просто удалите данную конструкцию.

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

1
Увидимся на страницах моего блога!

Вот такая статья! Нашли ли вы ответ на свой вопрос в ней? Пишите об этом в комментариях, буду рад услышать отзывы.

На этом все, подписывайтесь на обновления моего блога!

До скорых встреч. С уважением, Владимир Денисов!

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

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