MENU
WordPressを使ってウェブサイトを作成するための情報・WordPressテーマの作成にチャレンジ！
  1. ホーム
  2. WordPressテンプレートタグ
  3. wp_tag_cloud()

wp_tag_cloud()

WordPressテンプレートタグ
wp_tag_cloud()
目次

wp_tag_cloud()の用途

wp_tag_cloud() は、WordPress でタグクラウド（tag cloud）を簡単に表示するためのテンプレートタグです。人気タグは大きく、あまり使われていないタグは小さく表示され、投稿数に応じた視覚的なインパクトを提供することができます。

この関数は、wp_generate_tag_cloud() のラッパー関数で、HTML を直接出力します。サイドバーや記事下にタグ一覧を表示する用途に便利です。

wp_tag_cloud()の基本構文

wp_tag_cloud( array|string $args = '' );

$args は配列またはクエリ文字列で指定します。省略可能です。

wp_tag_cloud()のパラメータ

パラメータ名型説明
smallestint最小フォントサイズ（デフォルト：8）
largestint最大フォントサイズ（デフォルト：22）
unitstringフォントサイズの単位（pt, em, px など）
numberint表示するタグの最大数（例：45）
formatstringflat（スペース区切り）, list（ul/li）, array（配列）
separatorstringタグ間の区切り（format => flat のとき）
orderbystring並び順：name, count, rand
orderstring昇順（ASC）・降順（DESC）
taxonomystring対象タクソノミー（デフォルト：post_tag）
echobooltrue（出力する）/ false（返すだけ）

wp_tag_cloud()の基本的な使用例

<?php wp_tag_cloud(); ?>

→ 現在の投稿タグを、フォントサイズに変化を付けて表示します。

wp_tag_cloud()のカスタマイズ例

① 最小12px、最大24px、リスト形式で表示

wp_tag_cloud( array(
    'smallest' => 12,
    'largest'  => 24,
    'unit'     => 'px',
    'format'   => 'list'
) );

② 投稿数順に表示、最大20件まで

wp_tag_cloud( array(
    'orderby' => 'count',
    'order'   => 'DESC',
    'number'  => 20
) );

③ 出力せず HTML を取得

$cloud = wp_tag_cloud( array(
    'echo' => false
) );
echo '<div class="tag-cloud">' . $cloud . '</div>';

wp_tag_cloud() vs wp_generate_tag_cloud()

関数役割出力方法
wp_tag_cloud()タグクラウドを表示（簡易）直接出力（echo）
wp_generate_tag_cloud()タグクラウドのHTMLを生成（カスタム用）HTMLを返す（要 echo）

→ より高度な制御をしたい場合は wp_generate_tag_cloud() を使います。

タグクラウドの役割・メリット

  • 視覚的にタグの人気度が分かる
  • 内部リンクを増やして SEO にも有利
  • ユーザーの回遊性を高めるナビゲーション要素

特に、投稿が多くカテゴリもタグも充実しているブログやメディアでは、タグクラウドが情報整理と可視化に役立ちます。

wp_tag_cloud()の実用的なヒント

タグクラウドにアイコンをつける

echo '<div class="tag-cloud"><i class="fa fa-tags"></i> ';
wp_tag_cloud();
echo '</div>';

CSSで視覚調整

.tag-cloud a {
  margin: 4px;
  text-decoration: none;
  display: inline-block;
}

複数タクソノミーに対応したい場合

wp_tag_cloud( array(
    'taxonomy' => 'custom_taxonomy'
) );

wp_tag_cloud()の注意点

  • タグの投稿数（count）がすべて同じだと、フォントサイズに変化が出ません。
  • タグが1つもないと出力されないため、get_tags() での条件分岐も検討してください。

wp_tag_cloud()のまとめ

項目内容
関数名wp_tag_cloud()
用途タグクラウド（タグの一覧を人気順に視覚化）を表示
特徴シンプルな使い方で簡単に出力可能
カスタマイズ最小/最大サイズ、並び順、件数、形式などが変更可能
関連関数wp_generate_tag_cloud()（HTML生成のみ）

タグクラウドは、ただの装飾以上に「コンテンツの全体像をユーザーに伝える強力なUI」です。必要に応じてカスタムCSS、条件分岐、JavaScriptとの連携なども活用すれば、さらに魅力的なUIに仕上げることができます。

WordPressテンプレートタグ
よかったらシェアしてね！
  • URLをコピーしました！
  • URLをコピーしました！

この記事を書いた人

katsu@WP-Designのアバター katsu@WP-Design

初めてホームページを作成したのは1996年。
2000年よりフリーランスで主に中小企業、学校、各種公的団体、個人事業主のWordPressを活用したホームページ制作を行っています。WordPressテーマはそれぞれのクライアントに合わせて作成しています。
WordPressを活用したサイト運営のための情報発信をしていきます。

関連記事

目次