wp_tag_cloud() в WordPress: Полное руководство с примерами

wp_tag_cloud() — это встроенная функция WordPress, которая позволяет отображать облако меток (тегов) в виде HTML-кода. Облако меток представляет собой список тегов, где размер шрифта каждой метки зависит от частоты её использования. Эта функция полезна для визуального отображения наиболее часто используемых тегов и категорий.

Принцип работы wp_tag_cloud()

Размер каждой метки (тега) изменяется в зависимости от того, сколько раз она была присвоена записям. Чем больше записей связано с меткой, тем крупнее она будет отображена в облаке. Это делает визуализацию меток на сайте более привлекательной и интуитивно понятной.

wp_tag_cloud( array|string $args = ” ): void|string|string[]

Параметры для аргумента $args:

1. smallest (число) — размер текста для меток с меньшим количеством записей. Единицы измерения задаются в параметре unit. По умолчанию: 8.
2. largest (число) — размер текста для меток с большим количеством записей. Единицы измерения задаются в параметре unit. По умолчанию: 22.
3. unit (строка) — единицы измерения для параметров smallest и largest. Может быть любым CSS-типом размера: pt, px, em, %. По умолчанию: ‘pt’.
4. number (число) — максимальное количество меток, которое будет показано в списке. Если установить на 0, будут показаны все метки. По умолчанию: 45.
5. format (строка) — формат вывода списка меток. Может быть:
   • flat — метки разделены разделителем separator;
   • list — метки выводятся в виде списка UL;
   • array — возвращает массив меток для дальнейшей обработки. По умолчанию: ‘flat’.
6. separator (строка) — текстовый разделитель между метками. По умолчанию: «\n».
7. orderby (строка) — сортировка меток. Может быть:
   • name — сортировка по имени;
   • count — сортировка по количеству записей. По умолчанию: ‘name’.
8. order (строка) — порядок сортировки. Может быть:
   • ASC — по возрастанию;
   • DESC — по убыванию;
   • RAND — случайный порядок. По умолчанию: ‘ASC’.
9. exclude (строка) — ID меток, которые нужно исключить, через запятую. По умолчанию: null.
10. include (строка) — ID меток, которые нужно включить, через запятую. По умолчанию: null.
11. topic_count_text_callback (строка/массив) — функция для изменения текста количества записей для каждой метки. По умолчанию: default_topic_count_text.
12. link (строка) — действие по нажатию на метку. Может быть:
    • view — переход на страницу метки;
    • edit — переход на страницу редактирования метки. По умолчанию: ‘view’.
13. taxonomy (строка/массив) — таксономия или массив таксономий для вывода облака меток. По умолчанию: ‘post_tag’.
14. show_count (логический) — показывать ли количество записей для каждой метки. Может быть: 0, 1 или true/false. По умолчанию: 0.
15. echo (логический) — выводить на экран (true) или возвращать для обработки (false). По умолчанию: 1 (true).

1. Базовый пример облака меток

<?php wp_tag_cloud( array( 'smallest' => 10, 'largest' => 22, 'number' => 20 ) ); ?>

Этот код выводит облако меток с 20 метками, где размер шрифта варьируется от 10 до 22 pt.

2. Возвращение облака в переменную

Если нужно использовать облако меток в коде, а не сразу выводить на экран:

<?php $tag_cloud = wp_tag_cloud( array( 'format' => 'array', 'echo' => false ) ); ?>
<pre><?php print_r( $tag_cloud ); ?></pre>

3. Облако категорий

Выведем облако категорий вместо облака меток:

<?php wp_tag_cloud( array( 'taxonomy' => 'category' ) ); ?>

4. Облако категорий и меток одновременно

Если нужно вывести не только метки, но и категории:

<?php wp_tag_cloud( array( 'taxonomy' => array( 'post_tag', 'category' ) ) ); ?>

5. Изменение текста атрибута title

Изменим текст, который отображается при наведении на ссылку метки:

<?php
wp_tag_cloud( array( 'topic_count_text_callback' => 'my_tag_count_text' ) );

function my_tag_count_text( $count ) {
    return sprintf( _n( '%s запись', '%s записей', $count ), number_format_i18n( $count ) );
}
?>

6. Ограничение количества меток и сортировка по количеству записей

В этом примере ограничим количество меток до 50 и отсортируем их по количеству связанных записей:

<?php wp_tag_cloud( array( 'smallest' => 15, 'largest' => 40, 'number' => 50, 'orderby' => 'count', 'order' => 'DESC' ) ); ?>

Метки будут отсортированы по количеству записей, от самой популярной до менее популярной, при этом размер шрифта будет варьироваться от 15 до 40 pt.

7. Добавление классов и изменение структуры списка

Этот пример показывает, как можно изменить UL на OL список и добавить классы к каждому элементу LI:

<?php
$cloud = wp_tag_cloud( array(
    'format' => 'list',
    'echo' => false,
) );

$cloud = str_replace( array( '<ul ', '</ul>' ), array( '<ol ', '</ol>' ), $cloud );
$cloud = str_replace( '<li>', '<li class="custom-tag-class">', $cloud );

echo $cloud;
?>

В результате код будет выводить облако меток в виде OL списка с добавлением класса custom-tag-class для каждого LI элемента.

8. Создание архива меток

Вы можете создать страницу архива меток, которая будет отображать облако меток и список записей, связанных с выбранной меткой. Для этого создается шаблон tag.php в каталоге темы:

<?php get_header(); ?>

<div class="tag-archive">
    <h2>Облако меток</h2>
    <?php wp_tag_cloud(); ?>
    
    <div class="tag-posts">
        <?php if ( have_posts() ) : ?>
            <?php while ( have_posts() ) : the_post(); ?>
                <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                <div class="post-content"><?php the_content(); ?></div>
            <?php endwhile; ?>
        <?php endif; ?>
    </div>

    <div class="pagination">
        <div class="prev-posts"><?php next_posts_link( 'Предыдущие записи' ); ?></div>
        <div class="next-posts"><?php previous_posts_link( 'Новые записи' ); ?></div>
    </div>
</div>

<?php get_footer(); ?>

Этот шаблон выводит облако меток в верхней части страницы, а ниже — записи, относящиеся к выбранной метке. Pagination добавляется для навигации между записями.

9. Виджет облака меток с измененными параметрами

Если вы хотите изменить параметры виджета облака меток, можно использовать фильтр widget_tag_cloud_args:

<?php
add_filter( 'widget_tag_cloud_args', function( $args ) {
    $args['largest'] = 16;  // Максимальный размер шрифта
    $args['smallest'] = 8;   // Минимальный размер шрифта
    $args['number'] = 30;    // Количество меток
    return $args;
});
?>

Этот код изменяет параметры виджета, задавая максимальный размер шрифта в 16 pt, минимальный в 8 pt и ограничивает количество меток до 30.

10. Облако меток для произвольной таксономии

В WordPress можно использовать произвольные таксономии для создания облака меток. Например, если у вас есть таксономия product_tag:

<?php wp_tag_cloud( array( 'taxonomy' => 'product_tag' ) ); ?>

Этот код выводит облако меток для произвольной таксономии product_tag.

Полезные советы и практики при использовании wp_tag_cloud()

Оптимизация размера облака

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

<?php wp_tag_cloud( array( 'number' => 20 ) ); ?>

Это ограничит облако до 20 самых популярных меток.

Кеширование облака меток

Для оптимизации производительности сайта можно закешировать результат функции wp_tag_cloud(). Это особенно полезно на крупных сайтах с большим количеством меток и записей:

<?php
$cached_tag_cloud = get_transient( 'my_tag_cloud' );

if ( false === $cached_tag_cloud ) {
    $cached_tag_cloud = wp_tag_cloud( array( 'echo' => false ) );
    set_transient( 'my_tag_cloud', $cached_tag_cloud, 12 * HOUR_IN_SECONDS );
}

echo $cached_tag_cloud;
?>

Здесь результат сохраняется в кэш на 12 часов, что уменьшает нагрузку на сервер при частых запросах.

Создание кастомных стилей для облака меток

Вы можете кастомизировать внешний вид облака меток с помощью CSS. Например, добавим стили для изменения цвета и размера шрифта меток:

.wp-tag-cloud a {
    color: #3498db;
    text-decoration: none;
    transition: color 0.3s ease;
}

.wp-tag-cloud a:hover {
    color: #e74c3c;
}

Заключение

Функция wp_tag_cloud() — это мощный инструмент для отображения меток и категорий в виде облака на сайте WordPress. Благодаря множеству параметров, её можно гибко настроить под любые нужды: ограничить количество меток, изменить размер шрифтов, добавить собственные стили и даже вывести произвольные таксономии.