Заработок в интернет

Создание, оптимизация, продвижение сайта и заработок на его основе

Плагины Wp-Syntax и Wp-Syntax Button – выводим любой код в записи на блоге wordpress.

Автор: Сергей Егерев Опубликовано: 24 - Май - 2012

выводим любой код на wordpressПриветствую вас уважаемый читатель!

В сегодняшней статье пойдет разговор о том, как можно выводить в своих записях на блоге wordpress различные коды – html, php и другие при помощи плагина WP-Syntax.

Есть еще один плагин WP-Syntax Button, который может использоваться в дополнение к первому, но давайте обо всем по порядку.

Ёжику понятно, что не всем это нужно и если у вас блог на кулинарную тематику, то на фига козе баян зачем вашим домохозяйкам этот плагин и вывод синтаксиса кода какого-либо языка программирования. Ну а если у вас блог посвящен, к примеру, движку wordpress, то конечно желательно поставить плагин WP-Syntax, либо какой другой из этого же сериала.

Пишете вы пост и нужно вам показать читателям кусочек кода, или целый код, а встроенный wordpress редактор не позволяет вам его корректно отобразить, он его будет резать в html и писать каракули.

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

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

Возьмем для примера какой-нибудь код баннера в html, скопируем его и вставим в режиме визуального редактора.

У нас получится примерно такая запись:

<a href=»http://egofilin.ru» target=»_blank»><img src=»http://egofilin.ru/wp-content/uploads/2012/05/10000.gif» alt=»» border=»0″ /></a>

Согласитесь, что не очень красиво. А если мы используем плагин WP-Syntax, то код примет аккуратный вид:

1
 <a href="http://egofilin.ru" target="_blank"><img src="http://egofilin.ru/wp-content/uploads/2012/05/10000.gif" alt="" border="0" /></a>

Плагин WP-Syntax – выводим аккуратный код в записях блога.

Для начала нам нужно плагин WP-Syntax скачать на свой компьютер. Заходим в админку блога на вкладку Плагины – добавить новый и вводим его название, после чего жмем кнопку «поиск». Перед нами предстанет найденный плагин WP-Syntax, щелкаем «установить», а затем его активируем.

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

<pre lang="LANGUAGE" line="1"> здесь ваш код </pre>

Линия 1 – это не обязательный атрибут, если его не ставить, то слева на строчке просто не будет отображаться цифра 1.

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

Если вы, после того как прописали код, перейдете обратно в визуальный режим редактора, то ровно в 12.00 ваша карета превратится в тыкву ваш красивый и приятный блок с кодом превратится в белиберду, не предусмотрено в плагине WP-Syntax работа в визуальном редакторе.

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

Изначально есть три способа решения данного вопроса:

  1. Изучить язык html, рано или поздно, а с этим столкнуться придется и нужно иметь хотя бы базовые знания языка гипертекстовой разметки.
  2. Подготовить статью в визуальном редакторе полностью и в конце уже перейти в html, прописать код и опубликовать статью.
  3. Этот способ наверняка вам больше всего понравится, потому что, добавив к плагину WP-Syntax еще один, WP-Syntax Button, можно вообще не переходить в режим html, а все манипуляции производить в визуальном редакторе.

WP-Syntax Button – плагин для вставки кода в визуальном редакторе.


Аналогичным образом закачиваете себе в админке блога этот плагин WP-Syntax Button и активируете его. Настраивать также ничего не надо. После активизации у вас в редакторе wordpress должна появиться дополнительная кнопка “Code”.

плагин wp-syntax-button

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

После этого в появившемся окне выбираете язык (html, php и т.д.) и нажимаете кнопку Insert. Все. Код скопирован и уже отображается, перейдите на сайт и посмотрите, на творение рук своих и творение плагинов WP-Syntax и WP-Syntax Button.

Теперь вы знаете, как можно разместить на своем блоге любой код в виде аккуратного блока при помощи WP-Syntax и WP-Syntax Button.
Успехов вам!

  1. Antonio:

    Плагин хороший, однако заметил он коряжит код PHP, делает лишний пробел после скобки, но как-то решения не нашел.

    Опубликовано: 26 Январь 2015 в 18:34

  2. Сергей Егерев:

    У меня почему то в связке эти плагины тоже не работают, хотя у кого то все прекрасно, не знаю с чем это связано. Поэтому я использую только первый.

    Опубликовано: 26 Январь 2015 в 19:59

Оставить комментарий

Switch to Dark fonts Switch to Light fonts