MENU

wp_generate_tag_cloud()

wp_generate_tag_cloud() は、タグやタクソノミーの用語をクラウド形式で表示するためのテンプレートタグです。各タグの使用頻度に応じて異なるサイズで表示されるため、重要なタグを視覚的に強調できます。

目次

機能の説明

wp_generate_tag_cloud() は、タグのリストを受け取り、使用頻度に応じてリンク付きの「タグクラウド」を生成します。このタグクラウドでは、使用頻度が高いタグほど大きく表示されます。

シンプルなコード例

<?php echo wp_generate_tag_cloud( get_tags() ); ?>

このコードは、get_tags() で取得したタグのリストを使って、タグクラウドを生成・表示します。

使い方の解説

  • wp_generate_tag_cloud() の引数にタグやタクソノミーのリストを渡す必要があります。
  • タグクラウドの見た目は、引数でカスタマイズでき、CSSでさらに調整可能です。

使用例

<?php
$tags = get_tags( array( 'orderby' => 'count', 'order' => 'DESC' ) );
echo wp_generate_tag_cloud( $tags, array(
    'smallest'  => 10,  // 最小フォントサイズ
    'largest'   => 22,  // 最大フォントサイズ
    'unit'      => 'px', // フォントサイズの単位
    'format'    => 'flat', // 出力形式 ('flat' または 'list')
    'separator' => ' ', // 各タグ間の区切り文字
) );
?>
  • get_tags(): タグのリストを取得し、使用頻度順に並べ替えています。
  • smallest / largest: タグのフォントサイズを最小10px、最大22pxに設定。
  • unit: フォントサイズの単位を指定。
  • format: 'flat' はフラットなHTML出力、'list'<li> タグを使ったリスト形式を生成。
  • separator: タグを区切る文字列を指定。

一緒に使うことが多い関連タグ

get_tags()

get_tags() は、すべてのタグを取得して配列として返します。タグのクラウドを生成するためのデータとしてよく使います。

<?php
$tags = get_tags( array( 'orderby' => 'name', 'order' => 'ASC' ) );
foreach ( $tags as $tag ) {
    echo '<a href="' . get_tag_link( $tag->term_id ) . '">';
    echo esc_html( $tag->name );
    echo '</a> ';
}
?>
  • get_tags(): タグの一覧を取得。
  • get_tag_link(): 各タグへのリンクを生成。
  • esc_html(): タグ名を安全に出力。

the_tags()

the_tags() は、投稿に関連するタグをリンク付きで表示します。タグクラウドとは異なり、個々の投稿のタグを取得するために使用されます。

<p>タグ: <?php the_tags( '', ', ', '' ); ?></p>

the_tags() を使用して、現在の投稿に関連付けられたタグを表示します。

追加情報を取得したい場合

タグの詳細な情報が必要な場合は、get_term() で各タグの情報を取得できます。

get_term()で取得できる情報

<?php
$tag = get_term( 5, 'post_tag' ); // タグIDが5のタグを取得
echo 'タグ名: ' . esc_html( $tag->name );
echo '<br>スラッグ: ' . esc_html( $tag->slug );
echo '<br>説明: ' . esc_html( $tag->description );
?>

出力できる情報

  • name:タグ名
  • slug:タグのスラッグ(URLフレンドリーな名前)
  • description:タグの説明
  • count:タグが使われている投稿の数

想定されるトラブル

タグクラウドが表示されない

使用するタグが存在しない可能性があります。

解決方法

投稿にタグを追加するか、デフォルトでタグがあるか確認してください。

フォントサイズが意図した通りに表示されない

CSSの競合が原因でスタイルが上書きされている可能性があります。

解決方法

テーマのCSSに !important を追加して強制的にスタイルを適用します。

.tagcloud a {
    font-size: 12px !important;
}

タグの順序が変わらない

get_tags() の引数で並び替えオプションを指定していない可能性があります。

解決方法

orderby パラメータを使って順序を指定してください。

Q&A

wp_generate_tag_cloud() でカスタムタクソノミーを使用するには?

get_terms() でカスタムタクソノミーの用語を取得し、それを wp_generate_tag_cloud() に渡します。

<?php
$terms = get_terms( array( 'taxonomy' => 'custom_tax', 'orderby' => 'count' ) );
echo wp_generate_tag_cloud( $terms );
?>

タグクラウドのリンクを外すにはどうすれば良いですか?

カスタム関数を使って、リンクを除去したタグクラウドを生成します。

<?php
$tags = get_tags();
foreach ( $tags as $tag ) {
    echo '<span>' . esc_html( $tag->name ) . '</span> ';
}
?>

特定のタグのみをクラウドに表示するには?

include パラメータを使って、特定のタグのみを取得します。

<?php
$tags = get_tags( array( 'include' => array( 1, 2, 3 ) ) );
echo wp_generate_tag_cloud( $tags );
?>

まとめ

wp_generate_tag_cloud() は、タグやタクソノミーの用語を使用頻度に応じて異なるサイズで表示するための強力なテンプレートタグです。get_tags()get_terms() と組み合わせることで、より柔軟なタグクラウドの表示が可能になります。テーマのスタイルと組み合わせて、視覚的に魅力的なコンテンツナビゲーションを提供するのに役立ちます。

よかったらシェアしてね!
  • URLをコピーしました!

コメント

コメントする

This site uses Akismet to reduce spam. Learn how your comment data is processed.

目次