Как вывести теги на отдельной странице WordPress

Задача возникает при разработке сайтов-каталогов. Решение быстрое в три шага.

1. Создать отдельный шаблон страницы (например, template-tags.php)
2. Вставить код (в блок вывода контента)
3. Отредактировать CSS-стили

Код вывода тегов:

<section class="post-content">
    <?php if( !has_post_thumbnail() ): ?>
        <h1 class="title ularge bordered bold"><?php the_title(); ?></h1>
    <?php endif; ?>
<div class="tags">
        <?php
        $tags        = get_tags( 'orderby=name&order=ASC' );
        $capital     = '';
        $i           = 0;
        $cols_number = 3; // Количество колонок
        $cut         = ceil( count( $tags ) / $cols_number );
        $cutter      = $cut;
        $letter_i    = 0;
        $output      = '<div class="column">';
        foreach ( $tags as $tag ) {
            $i ++;
            $firstletter = mb_substr( $tag->name, 0, 1 );
            $firstletter = mb_strtoupper($firstletter);
            if ( $firstletter != $capital ) {
                $letter_i ++;
                if ( $letter_i != 1 ) {
                    $output .= '</ul>';
                }
                if ( $i > $cutter ) {
                    $output .= '</div><div class="column">';
                    $cutter = $cutter + $cut;
                }
                $capital = $firstletter;
                $output .= '<h4>' . $capital . '</h4><ul>';
            }
            $term = get_term_by( 'id', (int) $tag->term_id, 'post_tag' );
            $output .= '<li><a href="' . get_term_link( (int) $tag->term_id, 'post_tag' ) . '">' . $tag->name . '</a> (' . $term->count . ')</li>';
        }
        echo $output . '</ul></div>';
        ?>
    </div>

    <div class="clear"></div>
</section>

В 10 строке $cols_number нужно указать на сколько колонок выводить список тегов. В этом коде указано 3 колонки. Поэтому в CSS коде ширина колонки указана, как треть страницы – 33%.

Код CSS:

.page-template-template-tags-php h4 {font-weight: bold; text-transform: uppercase;}
.page-template-template-tags-php .post-content {width: 100%; overflow: hidden;}
.page-template-template-tags-php .post-content .tags {width: 100%;}
.page-template-template-tags-php .post-content ul {list-style: none; margin: 0 0 10% 0;}
.page-template-template-tags-php .post-content ul li {color: #ccc;}
.page-template-template-tags-php .post-content .column {width: 33%; float: left;}