Дизайн та розробка сайту

Как вставить код в комментарий без плагина без плагинов WordPress

Код в виде текста

Доброго времени суток. 🙂

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

Код в виде текста

Я конечно же сразу хотел ответить, что у меня установлен плагин - syntaxhighlighter и чтобы вывести код, нужно в комментарии добавить спец теги этого плагина, но потом я подумал о том, а что делать если, допустим, нет этого плагина и кому-то устанавливать его нет смысла. Как им быть в этой ситуации у себя на блоге.

Тогда я залез в дебри интернета и нашел интересную функцию, которая заменяет символы "" на спецсимволы. Как выяснилось, эта функция работает не только на комментарии. С ее помощью можно показать код в комментариях и в записи и при этом без плагинов. Данная функция привязывается к тегам pre и code. В моем случаи я больше предпочитаю code.

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

<code></code>

я получал правильный вывод кода с интересным видом. Чтобы добавить себе такую функцию, нужно открыть functions.php и прописать в нем следующий код:

// Преобразуем символы  < > в спецсимволы при отправке комментария
function html_replace_char_code_pre ($matches){
	$out = str_replace (array ('<'   ,'>'),	array ('&lt;','&gt;'),	$matches[3]	);
    return "<{$matches[1]}{$matches[2]}>".$out."</{$matches[1]}>";
}
function convert_html ($comment_text){
	$comment_text = preg_replace_callback ('!<(pre|code)([^>]*)>(?:\r\n|\n|\r|)(.*?)(?:\r\n|\n|\r|)</\\1>!ims', 'html_replace_char_code_pre', $comment_text);
	return $comment_text;
}
add_filter ('pre_comment_content','convert_html');

Настраивать ничего не нужно и по сути у Вас уже все готово, можете проверить готовый результат. Для этого просто в форме комментариев, в текстовом поле, вставьте любой html или другой код, предварительно заключив его тегом code или pre, как я написал выше.

Чтобы задать более привлекательный вид, я добавил стили к code, Вы можете также задать к pre. Если у Вас уже есть стили для этих тегов, можете пропустить этот шаг.

Открываем style.css и добавляем стили:

code{
color:#f30;
display:block;
background:#f9f9f9;
border-left:3px solid #f30;
padding:10px;
margin:10px 0;
}

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

У себя я использовал небольшой скрипт, который с помощью кнопки вставляет в поле теги, как в редакторе, чтобы узнать как я это сделал читайте статью - Своя кнопка, в форме комментариев для вставки тегов html без плагинов WordPress

На этом все, спасибо за внимание. 🙂

Дизайн та розробка сайту

Back to top