» » » Редактор для категорий (рубрик), меток и произвольных таксономий
logotip

Редактор для категорий (рубрик), меток и произвольных таксономий

Всем привет! Сегодня на seo-mayak.com мы продолжим расширять возможности WordpPress и создадим полноценный текстовый редактор для категорий (рубрик), меток и произвольных таксономий.

Возникает резонный вопрос, а зачем он вообще там нужен?

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

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

redaktor-dlia-kategorii

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

В общем пришлось мне изрядно поломать голову и о том, что у меня в итоге получилось я и собираюсь Вам рассказать. Поехали!

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

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

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

Среди таких есть хуки: edit_category_form_fields, позволяющий добавлять дополнительные поля в раздел редактирования категорий и edit_tag_form_fields, отвечающий за новые поля в разделе редактирования меток.

Еще нам надо отключить функции форматирования wp_filter_kses() и wp_kses_data(), иначе при сохранении или обновлении будут вырезаться все HTML теги.

Итак, какие фильтры нам нужны мы выяснили, осталось написать функцию, с помощью которой мы будем изменять ядро.

Данную функцию надо вставлять в файл functions.php вашей темы.

remove_filter( 'pre_term_description', 'wp_filter_kses' );
remove_filter( 'term_description', 'wp_kses_data' );

function mayak_category_description($container = ''){
	$content = is_object($container) && isset($container->description) ? html_entity_decode($container->description) : '';
	$editor_id = 'tag_description';
	$settings = 'description';		
	?>
    <tr class="form-field">
	<th scope="row" valign="top"><label for="description">Описание</label></th>
	<td><?php wp_editor($content, $editor_id, array(
				'textarea_name' => $settings,
				'editor_css' => '<style>.html-active .wp-editor-area{border:0;}</style>',
	)); ?><br />
	<span class="description">Описание по умолчанию не отображается, однако некоторые темы могут его показывать.</span></td>
    </tr>
    <?php	
}
add_filter('edit_category_form_fields', 'mayak_category_description');
add_filter('edit_tag_form_fields', 'mayak_category_description');

Кстати, сам редактор выводится с помощью функции WordPress wp_editor(), работу которой я уже подробно разбирал в одной из своих прошлых статей. Кто не читал, советую ознакомиться.

Посмотрим, что получилось:

redaktor-dlia-kategorii-1

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

Для решения этой проблемы, пришлось написать еще одну простенькую функцию, вот она:

function mayak_remove_category_description(){
    global $mk_description;
    if ( $mk_description->id == 'edit-category' or 'edit-tag' ){
    ?>
        <script type="text/javascript">
        jQuery(function($) {
            $('textarea#description').closest('tr.form-field').remove();
        });
        </script>
    <?php
    }
}
add_action('admin_head', 'mayak_remove_category_description');

Смотрим

redaktor-dlia-kategorii-2-1

Если старое поле исчезло, значит все в порядке.

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

Все работает на ура!

Но это еще не все! Теперь надо как-то вывести текст с редактора на страницах категорий или меток, ведь по умолчанию там выводятся только анонсы записей.

Для вывода содержимого поля «Описание» предусмотрены специальные функции WordPress:

category_description()> — выведет описание рубрики;
tag_description() — выведет описание метки.

В файлах их нужно прописывать с оператором echo, т.е. так:

<?php echo category_description(); ?>
<?php echo tag_description(); ?>

Данные функции могут работать, как внутри цикла WordPress, так и за его пределами, это к слову, но лучше описание выводить за приделами цикла, т.е. перед строчкой:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

Или после строчки:

<?php endwhile; ?>

Конечно, могут быть и другие варианты цикла, все зависит от шаблона.

И это еще не все! Остался один маленький штрих.

Дело в том, что на странице списка рубрик или меток по умолчанию отображаются их описание и если описание будет слишком большое, то получится следующее:

redaktor-dlia-kategorii-4-1

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

В правом верхнем углу страницы есть вкладка «Настройки экрана», вот она то нам и нужна:

redaktor-dlia-kategorii-4

Снимаем галочку и описание больше не будет мозолить глаза. Все просто!

Предвижу вопрос по поводу формирования description для категорий. Здесь сложностей быть не должно. Тот же плагин All in One SEO Pack автоматом выводит в качестве description определенное количество символов из первых предложений описания, лишнее просто обрезается.

В следующих статьях будет не менее интересно, следите за обновлениями.

До встречи!

С уважением, Виталий Кириллов

Статьи по теме:

Картинки для категорий (рубрик) — изображения WordPress
Title, description, keywords и h1 для категорий (рубрик) WordPress
Шаблоны для категорий или как сделать каталог из рубрики
Категории WordPress — термы и таксономии
wp_list_categories() — как выводить рубрики WordPress

Комментарии: 30

  1. Наталья:

    Классная возможность! Я думаю, многим пригодится. Я помню, как раньше мучилась, вставляя теги в поле описания категорий.
    Только я с недавних пор просто убрала это описание, т.к. оно было скорее для поисковиков, пользователи его не читали)) Может, теперь подумаю и верну его))

    Ответить
    • Виталий Кириллов:

      Здравствуйте Наталья!
      Многие вставляют теги в описание и я это делал до недавних пор)

      Ответить
  2. Альберт:

    Вот спасибо, Виталий! А я мучился с html-кодом, правда нельзя было вставить тег -more-. На днях попробую и отпишусь о результатах.

    Ответить
    • Виталий Кириллов:

      Здравствуйте Альберт!
      Тег more предусмотрен только для записей post, в категориях он работать не будет.

      Ответить
  3. Роман:

    Полезная статья. Однозначно будет полезна владельцам сайтов на Ворд-пресс.

    Ответить
  4. Андрей:

    Статья полезная, в описании рубрики действительно появилось соответствующее окно. Правда есть одно НО!!! После нажатия кнопки «Обновить» все тэги пропадают. У меня стоит WordPress 4.7.2, плагинов, кроме «Image Watermark» — добавляет водяные знаки (т.е. ни как не влияет), нет. Можно ли это как-то решить?

    Ответить
    • Виталий Кириллов:

      Андрей, надо добавить отключение фильтров в функцию.

      Вставьте в functions.php:

      remove_filter( 'pre_term_description', 'wp_filter_kses' );
      remove_filter( 'term_description', 'wp_kses_data' );
      Ответить
      • Андрей:

        И еще небольшое уточнение: так если я отключу фильтры это же во всех редакторах они отключатся. Можно ли их отключить только для редактора категорий?

        Ответить
        • Виталий Кириллов:

          Форматирование отключается только для функций: pre_term_description() и term_description(), которые относятся к функционалу таксономий.

          Ответить
          • Андрей:

            Ок. Спасибо

            Ответить
  5. Дмитрий:

    Для всех кто знаком с html редактор с кнопками не обязательная штука. А вот код отключения фильтров вещь незаменимая, т.к. без этого в описании рубрики вырезаются большинство html тегов. У меня без отключения фильтров работали только теги. Огромное человеческое спасибо вам за код отключения фильтров! Его работу я ещё не пробовал, но попробую в ближайшее время.

    Ответить
  6. Дмитрий:

    Сразу возникли два вопроса:

    1. Вы пишете:

    В файлах их нужно прописывать с оператором echo, т.е. так:

    В каких файлах? Где они находятся?

    2. Как добавить description для категорий без плагина All in One SEO Pack?

    Заранее спасибо за ответ!

    Ответить
    • Виталий Кириллов:

      1. Если речь идет о категориях, то это могут быть файлы: archive.php или category.php, зависит от шаблона.
      2. Позвольте ответить вопросом. А как сейчас у Вас выводится дискрипшен для категорий, его просто нет?

      Ответить
      • Дмитрий:

        1. А где находятся файлы archive.php или category.php ? В моей теме нет таких файлов.

        2. Дескрипшн для категорий у меня нет, в том то и проблема!
        Предвижу ваш вопрос… дескрипшн для постов я вывожу добавив код в файл header.php моей темы между тегами head:


        <meta name="description" content="ID, 'Description', true); if ($description) { ?>ID, "Description", true); ?>
        " />

        <meta name="description" content="" />

        Код добавляет тег description и дает возможность использовать произвольное поле Description для задания содержания тега, если нужно изменить описание description. Если произвольное поле не существует, то используется выдержка из содержания страницы/записи.

        Ответить
        • Дмитрий:

          Часть кода в предыдущем посте пропала. Как добавить код, чтобы он не вырезался в комментариях?

          Ответить
          • Виталий Кириллов:

            Чтобы добавить код в комментарий воспользуйтесь преобразователем.
            Обычно файлы находятся в корне темы, но повторяю все шаблоны разные.

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

            Ответить
  7. Дмитрий:

    1. Я уже нашёл в инете ответ на свой вопрос. Как вы и сказали выше, файл category.php находится в шаблоне темы. Если файл category.php не найден WordPress ищет шаблон для вывода архива archive.php. Если нет и этого файла, WordPress будет использовать основной шаблон Темы index.php.

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

    Ответить
    • Виталий Кириллов:

      Будет.

      Ответить
  8. Дмитрий:

    Виталий, здравствуйте, а как сделать так, чтобы описание меток(тегов) не повторялось на всех страницах, а было только на первой?

    Ответить
    • Виталий Кириллов:

      Здравствуйте Дмитрий! Обычно постраничная навигация закрывается от индексации, так что не вижу проблемы, что описание повторяется. Или Вы намеренно отрыли индексацию страниц пагинации?

      Ответить
  9. Игорь:

    добрый день, статья очень кстати. но есть одно но…
    Насколько я понимаю функция mayak_remove_category_description()
    должна удалить стандартное поле Описания. но почему то у меня она остается вместе с новим визуальным редактором WordPress 4.7.3

    Ответить
    • Виталий Кириллов:

      Здравствуйте Игорь! Версия WordPress здесь не причем, дело скорее всего в теме или плагинах.

      Ответить
  10. Мурад:

    Добрый день, однако кнопка Настройки экрана не раскрывает блок с галочками, в эту статью пришёл из статьи про миниатюры рубрик, так как не появлялось стандартное окно выбора картинок, после добавления редактора стало работать, но Настройки экрана и Помощь перестали работать и в консоли висит ошибка Cannot read property ‘editor’ of undefined
    at mayak_image_upload

    Ответить
    • Виталий Кириллов:

      Добрый день!
      Спасибо, что сообщили об ошибке.
      Честно говоря просто небыло времени все тщательно протестировать.
      Тут дело не в вызове редактора. Была ошибка в подключении функции mayak_loader(), что в статье — Картинки для категорий (рубрик) — изображения WordPress.
      Подключение поправил.

      Ответить
      • Мурад:

        скопировал заново function mayak_loader()
        пока ничего не поменялось

        Ответить
        • Виталий Кириллов:

          Возможно кеш.
          Скопируйте от суда, полностью!

          if(preg_match("#tag_ID=([0-9.]+)#", $_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI']))
          add_action( 'admin_footer', 'mayak_loader'  );
          function mayak_loader() { ?>
             <script>
               jQuery(document).ready( function($) {
                 function mayak_image_upload(button_class) {
                   var mm = true,
                   _orig_send_attachment = wp.media.editor.send.attachment;
                   $('body').on('click', button_class, function(e) {
                     var mb = '#'+$(this).attr('id');
                     var mt = $(mb);
                     mm = true;
                     wp.media.editor.send.attachment = function(props, attachment){
                       if (mm) {
                         $('#id-cat-images').val(attachment.id);
                         $('#cat-image-miniature').html('<img class="custom_media_image" src="" style="margin:0;padding:0;max-height:100px;float:none;" />');
                         $('#cat-image-miniature .custom_media_image').attr('src',attachment.sizes.thumbnail.url).css('display','block');
                       } else {
                         return _orig_send_attachment.apply( mb, [props, attachment] );
                       }
                      }
                   wp.media.editor.open(mt);
                   return false;
                 });
               }
               mayak_image_upload('.bitton_images.button'); 
               $('body').on('click','.bitton_images_remove',function(){
                 $('#id-cat-images').val('');
                 $('#cat-image-miniature').html('<img class="custom_media_image" src="" style="margin:0;padding:0;max-height:100px;float:none;" />');
               });
               $(document).ajaxComplete(function(event, xhr, settings) {
                 var mk = settings.data.split('&');
                 if( $.inArray('action=add-tag', mk) !== -1 ){
                   var mh = xhr.responseXML;
                   $mr = $(mh).find('term_id').text();
                   if($mr!=""){
                     $('#cat-image-miniature').html('');
                   }
                 }
               });
             });
          </script>
          <?php }
          
          Ответить
          • Мурад:

            C условием if работает всё как надо, странно что из поста про миниатюры у некоторых без редактора заработала подгрузка
            Спасибо!

            Ответить
  11. Андрей:

    Виталий, подскажите, вывел текстовый редактор в категории как описано в вашей статье, по началу всё получилось, текст оказался внизу. Я начал писать новый текст с загаловками и вот что получилось shop-tale.ru/product-category/biznes-nabory/biznes-aksessuary-muzhchine текст вылез дополнительно в верху над верхним меню. Если удалять заголовки из текста, то всё нормально становится! Подскажите что с этим можно сделать?

    Ответить
    • Виталий Кириллов:

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

      Ответить
      • Андрей:

        Да, странно это, обычный блок с описанием корректно работает с заголовками, а когда текстовый редактор ставишь начинает глючить!

        Ответить

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

Внимание комментатор! Прежде чем вставить: HTML, JavaScript или PHP код в свой комментарий, преобразуй его в html сущность!

Subscribe without commenting

» Подписаться на комментарии по RSS