Как добавить кнопки в редактор WordPress

Без плагина WordSmall

кнопки в редактор TinyMCE

Перед публикацией новой статьи ее внешний вид оформляется должным образом. Выделение цитаты, заголовка, вставка блока: внимание, осторожно, совет и т.д. Некоторые из этих действий возможно выполнить при помощи стандартных кнопок, находящихся в редакторе WordPress. И это очень удобно одним щелчком избавиться от написания дополнительных HTML-тегов. Вот, к примеру, вам необходимо выделить цитату. Вы же не оборачиваете вручную текст тегами <blockquote> </blockquote>. А просто используете кнопочку «b-quote» в чем и заключается красота, то есть удобство.

Но что делать если нужных кнопок нет в наличии? Правильно, остается сделать их самому. Как обычно, по-другому и быть не может, есть несколько вариантов решения. Оба варианта просты, может не до идиотизма, но обезвоживание от пота вам не грозит. Первый способ – это подключение специальных плагинов, что я стараюсь чаще всего избегать. Лишняя нагрузка, запросы и все такое не приносит особой радости. Второй способ – использование отдельного кода этим сейчас и займемся.

Добавляем свои кнопки в HTML редактор

На каждом блоге имеется свой стиль оформления определенных блоков. Допустим, у меня есть три тега <span> с разными классами и разными стилями, которые я часто использую для выделения текста. Первый с красным текстом, другой желтый, третий зеленый. И чтобы каждый раз не писать вручную тот или иной тег <span> проще всего добавить в редакторе свою кнопку. После чего одним взмахам руки решается двойная работа.

вордпресс редактор

Откройте файл functions.php и в конце перед знаком ?> добавьте следующие строки:

//Кнопки в редакторе
if( !function_exists('my_buttons') ){ function my_buttons()
{ ?>
<script type="text/javascript">
QTags.addButton( 'Red', 'Red', '<span class="red">', '</span>' );
QTags.addButton( 'Yellow', 'Yellow', '<span class="yellow">', '</span>' );
QTags.addButton( 'Green', 'Green', '<span class="green">', '</span>' );
</script>
<?php }
add_action('admin_print_footer_scripts', 'my_buttons');
}

Чтобы добавить свои теги или еще несколько кнопок достаточно продублировать строку:

QTags.addButton( 'идентификатор', 'название кнопки', 'открывающий тег', 'закрывающий тег' );

И все, дело сделано. Таким образом, сэкономите свое драгоценное время и не придется больше возиться с написанием тегов в статье.

— Не забывайте делиться с друзьями в социальных сетях: —

Автор, он же Андрей, он же Admin, он же WordSmall

Лентяй-любитель, окончил высшую школу безделья с многочисленными знаками отличия. Создатель этого небольшого «чудо-блога» о еще более «чудном» контенте.

E-mail Google+ Twitter
Добавить комментарий
bold quote code