Оформление текста в вордпресс

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

Посмотрел я на стилизацию Яндекса и захотелось мне вдруг чего-то такого-же )) (Я про выделение первой буквы красным). Только раз уж развивать какую-нибудь идею, то до победного, а потому мы не только раскрасим букву, но и поменяем размер. Как всё это дело выглядит, вы можете наблюдать на этой странице. Также жду ваших отзывов в комментариях — хорошо смотрится или паршиво — мне очень важно ваше мнение. А я расскажу как это делается.

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

Чтобы поменять цвет и размер буквы, нам нужно заключить её в отдельный тег <span>, то есть «Привет, друзья!» из начала поста будет выглядеть так: <span style=«тут свойства»><b>П</b></span>ривет, друзья! В моём случае это:

<span style="color: red; font-size: 22px;"><b>П</b></span>ривет, друзья!

Каждый раз так прописывать неудобно, поэтому я сделал пару кнопок в текстовый редактор. Теперь просто: выдеил нужную букву — нажал кнопочку и всё. Как сделать? Сейчас.

Идем мы с вами в вашу папку с вашей темой, ищем многострадальный functions.php и открываем для редактирования. Ну или Внешний вид => Редактор в меню вордпресс, но я этим редактором не пользуюсь и вам не советую. в файл, в самый конец вставляем:

add_action('admin_footer', 'eg_quicktags');

function eg_quicktags() {

?>

<script type="text/javascript" charset="utf-8">

jQuery(document).ready(function(){

if(typeof(QTags) !== 'undefined') {

QTags.addButton( 'big-red', 'BigRed', '<span style="color: red; font-size: 22px;"><b>', '</b></span>');

QTags.addButton( 'big-blue', 'BigВlue', '<span style="color:#6900FF; font-size: 22px;"><b>', '</b></span>');

}

});

</script>

<?php

}

Получаем пару кнопок для разных цветов. Можно и по другому — для разных размеров или еще каких-то ваших идей.

big-red — имя функции (любое)

 BigRed — то, что написано на кнопке будет

<span style=«color: red; font-size: 22px;»><b> — то, что будет перед выделенным участком текста,

</b></span> — то, что будет после оного.

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